How to Use the Banners Component in Joomla




Alright, back over on your site, go ahead and click on the word components and let's begin to take a look at these. There's a banner component, contacts, Joomla update, messaging, news feeds, post installation messages, redirect, search, smart search and tags. Now one of the things that's great about Joomla is that you can add a ton of extensions to your site to make it do whatever you want. These are just the built-in ones, so let's explore each one quickly.
Go ahead and click on banners and banners are exactly what they sound like. They provide banner rotations in any section of your site. Go ahead and click new. We follow the same cache workflow for some of these components: categorise, add a banner and then show it in a module position let's go ahead and do that. Click on categories. You have an uncategorised category. Go ahead and click new and let's call this Joomla ville advertising. We don't need to worry about anything else there. As is true of categories in our article manager, we could put descriptions, video or images here. We could make them a subcategory of something else but we don't need to worry about that. Go ahead and click Save and close. Click on banners and now click new again. Let's call this Joomla ville ad 1. It's going to be an image. Let's go ahead and select that image. We're going to just take some of the banners that come with Joomla. Let's use the OSM one banner here. Click insert. We won't worry about a height and a width. We're going to make that so it fills the entire area, but we do need alternate text. This is the open source matters banner one and let's make it so it goes to open source matters. Open source matters - or osm - is the board that oversees the legal and financial aspects of the joomla project. HTTP open source matters dot org. Go ahead and put that in. Once again, you can add a description. Let's change the category to joomla ville advertising.
We can also have a maximum number of impressions so, with any banner advertising, you can say hey after fifty or a thousand impressions, stop using this one. You can look at the total impressions and clicks. Joomla will track all of these for you.
If you want to assign a banner to a client, you can do that as well. We saw that just a few moments ago and again we can have a purchase type so this is a pretty nice little system for banner rotations on your site. Let's go ahead and track impressions and track clicks. That way we can report back to OSM how well their banner is doing. Go ahead and click Save and new. Let's do another one. Joomla will ad two and, back on details, let's select advertisement for shopping for Joomla books. Go ahead and click insert and let's just put in the site and click on category. Change it to joomla ville advertising. We could put many more banners in here but we'll just leave it at two for now.
Click on banner details and go ahead and track impressions and clicks and click Save and close, so categorise, add the banners and finally show. Just before we do that, click on clients. This is where we could add a client in and assign it to a banner ad and this is where we can track everything that's going on.
Head over to extensions and modules. We did this when we did our menus. It's similar. Modules, as you recall, are like the dashboard they place around our site. Click new and you'll see banners. Click on banners and these are going to be our Joomla ville banners. We don't want the title shop, that would be kind of silly. The target will open these clicks in a new window, not to worry about the client. We don't want to show all categories, let's just show Joomla ville advertising. We'll randomise the order. We could have some header and footer text here if we wanted. We could also start and stop publishing these modules just the same way as articles allow anybody or nobody to see them and of course we need to put it in a position. So now, before we do that, I want to show you a little trick.
Go ahead and click Save and close. For now, it's going to mean that our banner is there but it's not going to show up anymore because we don't have a position. Click on extensions and templates for a moment and click on options. We're able to preview the module positions for any template, if we go ahead and enable that. So go ahead and enable that and click Save and close and then head over to the front page of your site.
Go to the base URL and then put question mark TP equals 1, and that overlays the template module positions onto our page. Now we can see where all the module positions are. Well, a nice banner position here is actually positioned to where the breadcrumbs are. It's kind of a strange place for the breadcrumbs, so let's put the breadcrumbs in position three and we'll put the banner in position two. We'll talk more about this later but, for now, just go ahead and do that.
So, let's see. Breadcrumbs. We're going to move that to position three, the top Center. Click save and close and then the banners. Go ahead and put that scroll all the way to the bottom and put that in position two, which here is called breadcrumbs, and don't worry about what it's called for now. We're going to fix that later. I suppose we could put it in the banner position. Let's see what that looks like. Go ahead and click Save and go ahead and get rid of the question mark TP equals one on your page and there's the banner. That's kind of a weird place to put it. I still think we should put it down on the bottom for at least this particular template. We'll fix that later so go back over and let's put it in position two which, once again, is called breadcrumbs in protostar that's all right. Click Save and close and, if you wouldn't mind, just go back into breadcrumbs and hide the title. Click Save and close. Let's just do one more update to our banners. Click on Joomla ville banners, change the count to one. We don't want both banners showing at the same time, we want them to kind of show up in a random way. Finally change randomise from pinned ordering to pinned randomise. We're not pinning our banners but we are going to ask them to be randomised on page loads. Go ahead, make those changes and click Save and close.
Alright, head over to your site, click home and now just click around on your site and you should see the two banners loading at different times in a completely random fashion. If I click on that one, it's going to open that up in a new tab and there we are.
Let's head back to our components and banners, see what kind of tracking we're getting. Here we are. Joomla ville add one has three impressions and one click, Joomla ville ad 2 has 3 impressions and no clicks.
So, if a simple banner rotation system is what you're looking for for a client or for yourself, well then the banner component is really helpful.

Tags: Joomla 3



OSTraining teaches people how to build great websites, focusing on PHP platforms such as WordPress, Joomla, Magento and Drupal. You can learn more about there service by visiting or by subscribing to their Youtube channel.