Creating HTML banners in AdRotate for WordPress is quite easy and takes only a few minutes if you know a little about HTML code and have all required pieces ready. Don’t worry, knowing a little about HTML code literally requires you to know 2 tags, which are simple to use. Remember, setting up your advert campaigns with AdRotate or AdRotate Pro is easy for beginners and experts alike. So take control of your adverts and campaigns with adverts you make and control yourself. Here’s how to make your own standard HTML adverts from scratch…
Pre-requisites
Aside from the obvious requirement of WordPress and AdRotate or AdRotate Pro, you’ll generally need 4 things for an advert to work;
1. An URL or target website. This is where the people clicking the banner are sent to.
2. You’ll need an attractive banner image in a acceptable size and shape for adverts.
3. A basic understanding of how an anchor and image tag works will do just fine.
The anchor tag is what makes the link and the image tag shows the image. That’s very simple.
You can read more about those 2 tags on w3schools; Anchor tag and the Image tag.
4. And finally the HTML code to piece it all together.
In this article we’ll go over creating the HTML code and how to use that in AdRotate and AdRotate Pro.
Item 1 and 2 should be provided by your advertiser, but you can also opt to make banner images yourself.
The HTML code
The actual HTML code is very simple and in AdRotate and AdRotate Pro you’ll find various working examples. You can write your own code or use an example and modify it to your liking.
The most basic advert will look like this:
<a href="https://ajdg.solutions"><img src="%asset%" /></a>
We use the
%asset%
tag which AdRotate replaces with the image we’ll select in the advert settings. More on that later.
You can also use the full url/path to the image instead of the
%asset%
tag if you store your adverts elsewhere. On a remote server for example.
This could look something like this:
<a href="https://ajdg.solutions"><img src="https://ajdg.solutions/assets/banners/adrotate-468x60.jpg" /></a>
And this is how the above example would show up on a website:
As far as the code is concerned that’s basically it. One working advert pretty much ‘ready’ for use on your website.
Open the advert in a new window
To make the advert open in a new window you can add a
target
attribute to the anchor tag, like so;
<a href="https://ajdg.solutions" target="_blank"><img src="%asset%" /></a>
Notice the
target
attribute has a value
_blank
. This tells the browser to open a new tab when the link is clicked.
There are other values possible, but those are usually not relevant for adverts (or at all). You can read more about those on the w3schools website.
Affiliate and paid links
Since banners sometimes promote a product or service you are an affiliate for or the banner is straight up a paid deal (usually they are) you may want to consider to tell search engines about that. Most search engines have a bunch of rules for this and penalize you in their search results if you don’t follow them. Right Google? Bad Google…
Anyway, to prevent that from happening you can tell the search engine to definitely NOT follow the link. You do this with the
rel
attribute.
To expand on the advert we made, that would look like this:
<a href="https://ajdg.solutions" target="_blank" rel="nofollow"><img src="%asset%" /></a>
You’ll notice that the
rel
attribute has a value simply called
nofollow
. This tells search engines and crawlers to not ‘click’ the link. Again, other values are available. You can read up on those on w3schools. Some are beneficial for SEO but usually
nofollow
suffices.
How to use that code in AdRotate (Pro)
This is quite easy to do and takes only a few minutes.
First you upload the image to your banner folder through the AdRotate menu in Manage Media. As indicated below.
Of-course make sure the name is easy to remember. But also, do not use spaces. Replace all spaces with a – or _ for example.
Try to use only lower-caps characters. Though that’s more a visual preference any a real necessity.
You can also upload images via (s)FTP or the WordPress Media Manager, but that’s beyond the scope of this article.
Next is to create the actual advert in AdRotate or AdRotate Pro. Use the below screenshot as reference.
Basically you create a new advert and insert the code you pieced together and select the image for it.
In AdRotate Pro you’ll immediately see a preview of the advert. In AdRotate you have to save the advert first to see the preview below the AdCode field.
Now you can set up your advert to your specification – Most importantly attach a schedule for the ad. Enable stats if you need it and perhaps set up Geo Targeting and put the advert in a group and you’re good to go.
Generally it’s advisable to put adverts, even if it’s just one, in a group and place the group on your site somewhere. But that is optional.
Once you’re done creating your adverts you’re ready to place them on your site and start earning that paycheck with them.
Have fun and good luck!
