In this Joomla 3.0 tutorial, we are going to show you how to add a new banner. This is the first of several articles in our tutorial series on working with the banners component in Joomla 3.0.

Image banners vs. Flash banners

When we refer to banners in Joomla, we are referring to advertisements, such as an image in your sidebar that links to another website. In this article we'll show you how to create a banner using an image. There are other types of banners you can create too however. For example, most everyone has seen a flash banner on a website. Creating a flash banner is done by using HTML code as the banner instead of selecting an image, and we show you how to do that in this tutorial.

Steps for creating an image banner

The following guide assumes you've already created or have the image that you want set as a banner. These steps walk you through creating the banner within Joomla, not actually creating the banner using photo editing software such as Photoshop or Gimp.

  1. Log into your Joomla 3.0 dashboard
  2. In the top menu, click Components and then click Banners
  3. Click the New button in the top left of the page
  4. There are over 20 settings available for your banner, and most users do not need to concentrate on all of them. In this tutorial, we're focusing on the most important settings:
    Name Enter a name for the banner. This name is not going to be shown anywhere on your website. Instead, it will help you label and identify this specific banner when managing it later on.

    In our testing, we entered My First Banner as the title
    Category Choose a category for the banner. If you plan on having multiple banners on your site, you may want to consider creating a banner category to help manage them.

    We haven't created an categories yet, so we left the category as Uncategorised
    Type Choose the type of banner. Select Image to display an image from /images/banners/ directory. Select Custom to enter you custom code.

    Because we are creating a simple banner using an image, we selected Image. If you were creating a flash banner, for example, you would instead choose Custom, which would allow you to insert the HTML necessary to show a flash file, such as a .swf file.
    Image Select an image for this banner. Images have to be in the /images/banners/ directory.

    If you want to upload an image, click the Select button and then use the Upload file section towards the bottom to upload your image. In our testing, we uploaded the following banner:
    create-banner
    Click URL The URL used when the banner is clicked on.

    In our testing, we entered http://www.inmotionhosting.com. When someone clicks on the banner, this is the link we want them to go to.

    After entering the details for your banner, click the Save button in the top left of the page.

    Congratulations, you have successfully created a banner! Don't get too excited, there is still more work ahead of us. Simply creating a banner will not show it on your site. The next thing we will need to do is create a banner module so that the banner will show on our webpage.

Did you find this article helpful?

We value your feedback!

Why was this article not helpful? (Check all that apply)
The article is too difficult or too technical to follow.
There is a step or detail missing from the instructions.
The information is incorrect or out-of-date.
It does not resolve the question/problem I have.
How did you find this article?
Please tell us how we can improve this article:
Email Address
Name

new! - Enter your name and email address above and we will post your feedback in the comments on this page!

Like this Article?

Related Questions

Here are a few questions related to this article that our customers have asked:
Ooops! It looks like there are no questions about this page.
Would you like to ask a question about this page? If so, click the button below!
Ask a Question

Joomla Community Google+ Hangout #3

June 3rd, 2014

Thank you @RustyJoomla for letting me speak on the Joomla Community Google+ Hangout!

Click here to watch!

Post a Comment

Name:
Email Address:
Phone Number:
Comment:
Submit

Please note: Your name and comment will be displayed, but we will not show your email address.

0 Questions & Comments

Post a comment

Back to first comment | top

Need more Help?

Search

Ask the Community!

Get help with your questions from our community of like-minded hosting users and InMotion Hosting Staff.

Current Customers

Chat: Click to Chat Now E-mail: support@InMotionHosting.com
Call: 888-321-HOST (4678) Ticket: Submit a Support Ticket

Not a Customer?

Get web hosting from a company that is here to help. Sign up today!