This tutorial shows you how to display Google Adsense ads on your Joomla! website without installing an extension.
Requires you have a Google Adsense account. Should work for other ad providers that provide you with a code snippet for ads on your site.
Intructions for installing Adsense under Joomla! 1.6 can be found here.
Some images may be clicked for larger sized versions.
It is very easy to place Google Adsense ads on your Joomla! site without installing an extension.
Yet, the last time I looked, there were dozens of different Joomla! extensions to help you with Google Adsense ads on your site.
Embedding ads directly within your article requires a plug-in and is not covered by this tutorial.
Determine Ad Placement
You need to find a place for the ads on your site.
Ads are typically placed at the:
- top of the page
- bottom of the page
- side of the page
To reveal the module positions available in your Joomla! template, simply type in
?tp=1
at the end of your URL. As shown below, the various module positions making up this site are revealed. NOTE: in Joomla! 1.6, viewing module positions with ?tp=1 is disabled by default. See this tutorial for instructions on how to enable it.
You can choose to place ads in a currently empty module position, for example: user1, user2, search, topnav, breadcrumb, banner or right in the case of this website. Or you can place them in already occupied module positions, for example, left.
Where you place the ad will determine the type of ad you place. For instance, if you choose to place an ad on the left position, then a narrow and tall ad makes more sense than a short, wide ad.
Remember the name of the module position where you want to place your ad.
Disabling the HTML Editor
Joomla! tries very hard to prevent users from entering malicious code. This also means it prevents adding legitimate code. To get around this we need to disable the HTML editor.
1) Select Global Configuration from the Site menu item.
2) Select Editor – No Editor for the Default WYSIWYG Editor.
3) Click on Save to save the changes.
After you are done, you can restore the editor to the TinyMCE editor (or which ever editor you were using).
Adding Adsense
You require an Adsense account.
You also need the HTML code Google will provide you for your ad.
1) Select Module Manager from the Extensions menu item.
2) Click on New to create a new module.
3) Click on Custom HTML (You could also select the radio button next to Custom HTML and then click on Next).
4) Fill in the module information.
Details
- Title: enter a title for this module. If you want to display the title, something like Sponsored by is a good choice.
- Show Title: select Yes to display the title, No to not display the title.
- Enabled: select Yes to enable (show / display) the module.
- Position: from the dropdown list, select the name of the module position you decided on when determining your ad placement
- Order: if there are other modules occupying your selected position, you can choose the ordering of the modules.
- Access Level: ensure Public is selected.
Menu Assignment
Ensure All is selected. This will place the ads module on all pages of your Joomla! site.
If you want some pages to be ad free, then select Select Menu Item(s) from the List and then select only those pages were you want the ads to appear.
Custom Output
This is where you paste the HTML code that Google Adsense gives you.
Advanced Formatting Trick
It is likely that the ads will be left-justified in the module position.
You can horizontally center the ads by adding
<div align=”center”>
before the HTML code Google Adsense gave you and adding
</div>
at the end of the Adsense code. Check the highlighted code in the image.
5) Click on Save
6) Observe that the module has been correctly installed:
7) Check that the ads show up and are correctly positioned on your site (in this case, I added created two Adsense module – one for position user1 and the other for position user2):
When I click save on the Module page, the JS in the custom output re formats and changes the code before going live. It jumbles it up.
Thank you for your feedback.
My instructions were incomplete and would lead to your problem. They have now been updated.
The problem was that HTML filtering has to be disabled for you to correctly add Adsense to your site.
As well, I created a seperate article for Joomla! 1.6 (since the process is a little different).
I have published adds on my joomla site more than 2 months. but there is no earnings comes on my addsense account While i am getting a good number of visitors and one of my friends click on adds. Can you help me.
Thanks
My website link http://www.bnews24.com
I am no conversion expert (converting visits to ad clicks), but … here are my thoughts and observations:
Looking at your site, the biggest problem I see is that you have no content, no original information. You simply provide links to other sites. Most visitors leave these kinds of sites in a hurry.
You have to try and think like a user or visitor to your site: What are they looking for? They are looking for information. They type a query into a search engine (usually Google) and your site comes up. They expect their query to be answered on your site – not to be redirected somewhere else.
There is no problem with providing a one stop collection of links to Bangladeshi newspapers – it is a wonderful convenience to have them in one place, but that is just one page – not a whole site.
If you want this to be the model for your whole site, then you have to think about designing your site as a portal or gateway to Bangladeshi newspapers.
As for advertising revenue … well, again, think as a user or visitor: Did they come to your site to check out ads or to check out content? – They came to check out content. For most people, ads are just annoying.
Every once in a while, somebody might find an ad of interest and might click it. But how many people do that? Unfortunately, Google doesn’t allow people to talk about numbers when talking about Adsense, however, use your own web browsing habits as a guide.
Myself, I rarely click on ads. I go months without clicking on ads (and I, generally, browse over 100 pages per day). However, when I am looking for something specific (say an ARM SBC), as well as clicking on site links, I might click on related ads.
I realy thank you for your teaching on custom html,but im still having some problem with adding addsense to my page,pls how can i disble my html filtering and whenever i use custom Html for other codes,it works fine but with google adsense it doesent work,and adsense dont work in my site
With Joomla! 1.5 it is simply a matter of disabling the HTML editor – as in steps 1 – 3 above.
Unfortunately, the instructions are slightly different for other versions of Joomla!
If you are using a version of Joomla! other than 1.5, please check out one of the following articles:
If you are using Joomla! 1.6, the instructions can be found here.
If you are using Joomla! 1.7, the instructions can be found here.
If you are using Joomla! 2.5, the instructions can be found here.
im using 1.5,please
Ok, then the steps should be as illustrated in the article.
You are positively certain that you have disabled the HTML editor? Because the only thing I can think of that will mess with the HTML is if the HTML editor is enabled.
Perhaps if you don’t have administrator privilege that may also cause problems.
One of the driving philosophies behind Joomla! is security. They try very hard to disallow anything that might compromise the security of the system – which is why certain HTML tags are automatically stripped.