How to Add a Graphic Banner to your Sidebar

Question: Beryl, I signup for an affiliate program and it has banners that I can add to my website to promote the product but, it doesn’t give instructions on how to add the banner to my site. How do I add the banner to my website and make it clickable.

Answer: Banners are a quick and easy way to promote or endorse a company, product or website you believe it.

How you add a banner to your sidebar depends in large part on the type of site you have. For example if you have a WordPress blog then it’s going to be a different process than if you have a HTML site.

Here it is in a nutshell –
First you’ll want to click on the button image and save it on your desktop. If you’re using Blogger then you’ll have to upload the image into an image host like Photobucket or Flickr.

WordPress Blog
1. From the admin panel choose “write new post.”
2. Upload the picture/button image you’re using
3. Go to “Manage” and then “Uploads” and click on the picture you want.
4. Copy the URL by highlighting the URL and hitting the control button on your keyboard and the letter C.
5. In the same ‘manage’ screen now go to ‘Presentation,’ and then ‘Sidebar Widgets.’
6. Add a text widget and enter your code. It will look something like this.
7. <a href=”www.insertbuttonlinkURLhere.com”>
<img src=”past your URL here”></a>
8. Close the text widget and save it. You’re good to go.

Typepad Blog
1. Login and access your files through your control panel.
2. Choose to upload a new file, find your saved image, and copy the URL.
3. Click the “Typelists” tab. Note if you do not already have a typelist follow the instructions on Typepad to create one.
4. Click “Add a new item” to your typlist and past the URL you copied in step two. It should look something like this.
5. <img src=”http://example.typepad.com/image.jpg”>
6. Enter the URL to the website you’d like the image linked to in the “link URL” box
7. Save and you’re good to go.

Blogger Blog
1. Login and click on “Layout”
2. Choose “Template” tab, then “Page Elements”
3. Click on “Add a Page Element”
4. Choose the “HTML/JavaScript” option and click the “Add to Blog” option.
5. Type the link code (found where your image is being hosted) into the “Content” field. Your code will look like this:
<a href=”http://websiteyourimageislinkingto.com”><img src=”http://www.yourimage.jpg”></a>
6. Save and your banner should be in the sidebar and linkable to the relevant website.

HTML website code
1. If you’re adding a sidebar banner to the HTML code on your website the code will look something like this:
2. <div align=”center”>
<a href=”http://yoursiteURL.com” target=”_blank”><img src=”http://yoursitename/images/banner125×125.jpg” alt=”Imagelocation?”></a>
</div>

Adding a banner to your sidebar is typically a pretty straightforward process. If you have any questions or difficulties, check with your website hosting documentation or blog developer documentation for clarification and FAQs.

Kick-Start your business by getting access to smart tactics like this one each month. When you join the Smart Tactics Inner Circle