Loading...
JoomlaJoomla 2.5Joomla Tutorials

Joomla 2.5 Tutorial – How To Add Banners To Website

Joomla 2.5 Tutorials – This tutorial will help you create a brand new Banner Client, Banner Category, Banner, and learn how to Add these banners to your website on the front end.

If you are using Beez_20 template, you should first look at this post here on – How to remove the 3 banners at the bottom of your page – Contribute!, Books!, Shop! because I will create a new banner module where the ‘Contribute!’ banner currently is.

Where the Contribute! Banner IS:

Joomla 2.5 Banners - Contribute! Shop! Books!
Joomla 2.5 Banners – Contribute! Shop! Books!

Beez_20 Contribute Banner Module Position is Position-9

Joomla 2.5 Banners - Contribute! Shop! Books! Module Positions
Joomla 2.5 Banners – Contribute! Shop! Books! Module Positions

This tutorial is based on the following details, but please feel free to customize the names to anything you wish and is appropriate for your site.  I want to create a new banner category for my webhosting, the banner is Fatcow and client is CJ.

 Overview of How to Create a New Banner Module with New Banners

1.  Remove Banners Contribute!, Books!, Shop!

Following the instructions here in the link provided.  I want to create my own banner modules that’s why I’m removing the existing Beez20 banner modules.

2.  Create New Banner Client in Component Banner Manager

Every banner has a Client and a Category it belongs to.  You can enter anything in your client.   The client may be the Affiliate Management Site like CJ or can be a store name.  In my case, my client is CJ.

Joomla 2.5 - Component Banner Manager Clients
Joomla 2.5 – Component Banner Manager Clients
  • Login to your Joomla 2.5 Administrator Panel
  • Click on ‘Components’, ‘Banners’, ‘Clients
Joomla 2.5 - Banner Create New Client
Joomla 2.5 – Banner Create New Client
  • In the Banner Manager – New Client, set the following fields:
    • Client Name = CJ
    • Contact Name = CJ
    • Contact Email =  whatever email
    • Status = Published
    • Purchase Type = Use Global
    • Track Impressions = Yes/No
    • Track Clicks = Yes/No
    • Use Own Prefix = No
  • Click on ‘Save & Close’

3.  Create New Banner Category in Component Banner Manager

You can display your banners on your site based on category.  You maybe want to rotate many of the same type of ads in one position.  For example, you want to rotate shoe ads in one position.  In my case, I’m create a category for all the web hosting ads.  My Category will be Webhosting.

Joomla 2.5 - Components Banner Manager - Create Category
Joomla 2.5 – Components Banner Manager – Create Category
  • Click on ‘Components’, ‘Banners’, ‘Categories
Joomla 2.5 - Components Banner Manager - Add New Banner Category
Joomla 2.5 – Components Banner Manager – Add New Banner Category
  •  In the Banner Category Manager: Add A New Banner Category – Select the following values:
    • Title =  Webhosting
    • Parent = No Parent
    • Status = Published
    • Language = All
  • Click  on ‘ Save & Close

4.  Create New Banner in Components Banner Manager

Create a new banner and specify it’s category and client.  Here you can also upload an image of your banner.  You can add as many banners as you want in a category.  The module will either randomly display the banners in their respective category or display based on it’s order in the banner manager.

Joomla 2.5 - Component Banner Manager
Joomla 2.5 – Component Banner Manager
  •  Click on ‘Components’, ‘Banners’, ‘Banners
Joomla 2.5 - Component Banner Manager - New Banner
Joomla 2.5 – Component Banner Manager – New Banner
  • In the Banner Manager: New Banner, set the following values:
    • Name = Fatcow
    • Category = Webhosting
    • Type = Image
    • Image = Click the Select button to select from your computer
    • Sticky = No
    • Client = CJ
  • Click on ‘Save & Close’

5.  Add New Banner Module in Module Manager

You will now create a new banner module in your module manager.

Joomla 2.5 - Extensions - Module Manager
Joomla 2.5 – Extensions – Module Manager
  • Click on ‘Extensions’, ‘Module Manager’
  • Click on the ‘New‘ button on the top right corner
Joomla 2.5 - Create New Banner Module Type
Joomla 2.5 – Create New Banner Module Type
  •  Under the ‘Select a Module Type:’, select Banners

6.  Configure Banner Module in Module Manager

Now you will configure your Banner Module to only show the banners that are in the banner category and client created above in steps 2,3,4.

Joomla 2.5 - Create new Banner Module
Joomla 2.5 – Create new Banner Module
  •  In the Module Manager: Module Banners, Set the following values:
  • Under Details:
    • Title = Whatever title you want – Elaine New Banner Module
    • Show Title = Hide
    • Position = position-9
    • Status = Published
    • Access = Public
    • Language = All
  • Under Menu Assignment:
    • Module Assignment = On all pages
  • Under Basic Options:
    • Target = Open in a new window
    • Count = 1  <— how many banners to show at one time
    • Client = CJ
    • Category = Webhosting  <— Can select more than one category
    • Search by Tag = No
    • Randomise = Sticky, Ordering  <—- Can select Sticky, Random where it will display banners randomly
  • Click on ‘Save & Close’

Now refresh your website and you will see a new banner you created in step 4 in position-9 on your Joomla 2.5 website.   You can add as many banners as you want in a category.  If you select Count=1 in step 6, it will display 1 banner at a time from the chosen categories.

If you are using Beez_20 and want to create new module banners to place in position-10 and position-11, you can easily do that by repeating step 5, 6.  You will need to perform those steps twice for each position, one for position-10 and another for position-11.

Thanks,

Elaine

6 comments
  1. JP Fourie

    Good day Elaine.
    This site of yours is FULL of valuable information. Thank you!

    Question: When a module is created inside an article, this new module width is the same as that of the content page. Is it possible to fix the width at say 200 px and wrap the article around it – exactly as when you would insert an image into the article?

    JP

Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha Captcha Reload