Integrate AdSense into phpbb3

If you want to monetize your phpbb3 based forum and want to display some Google AdSense ads go ahead and read this simple tutorial. The following method can be applied on any prosilver based style. You can edit the files via your ACP or edit and upload them via FTP. I will post another tutorial showing you how to integrate AdSense into a subsilver2 based style. This tutorial covers the basic process of implementation but feel free to customize the code as you please.

Don’t forget to fill in your Google AdSense ID. Also you can place any kind of ads not just AdSense ads, so it’s up to you how your forum will look as there are no limits on customizing.

I suggest that you create file backups before you proceed, just in case.

Setting up the styling aspects.

1. Navigate to your style files /styles/stylename/theme/ and open stylesheet.css.
2. At the end, add the following code

   @import url("adsense.css");

3. Create a CSS file and add the following code to it:

a body {
max-width: 1024px;
margin: 0px auto;
}
ul.forums1 {
background-color: #cddeee;
}
li.row1 {
border-top: 1px solid #FFFFFF;
}
dd.mali span {
display: block;
padding-left: 10px;
}
dd.veliki span {
display: block;
padding-left: 10px;
}

4. Name the CSS file adsense.css and save it to /styles/stylename/theme

Displaying ads one the index page.
AdSense on the index page-top

1. Open index_body.html and find <!– INCLUDE forumlist_body.html –>
2. BEFORE it add the following code (this will create an ad block just before the forum list starts):

   <div class="forabg">
   <div class="inner"><span class="corners-top"><span></span></span>
   <ul class="topiclist">
   <li class="header">
   <dl class="icon">
   <dt>Ads</dt>
   </dl>
   </li>
   </ul>
   <ul class="topiclist forums1">
   <li class="row1">
   <dl class="icon1">
   <dd class="mali"><span>
   <script type="text/javascript"><!--
   google_ad_client = "pub-XXX";
   google_ad_width = 200;
   google_ad_height = 90;
   google_ad_format = "200x90_0ads_al";
   google_ad_channel = "";
   google_color_border = "cddeee";
   google_color_bg = "cddeee";
   google_color_link = "10508b";
   google_color_text = "4a5d73";
   google_color_url = "ac0000";
   //-->
   </script>
   <script type="text/javascript"
   src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
   </script>
   </span></dd>
   <dd class="veliki"><span>
   <script type="text/javascript"><!--
   google_ad_client = "pub-XXX";
   google_ad_width = 728;
   google_ad_height = 90;
   google_ad_format = "728x90_as";
   google_ad_type = "text_image";
   google_ad_channel = "";
   google_color_border = "cddeee";
   google_color_bg = "cddeee";
   google_color_link = "10508b";
   google_color_text = "4a5d73";
   google_color_url = "ac0000";
   //-->
   </script>
   <script type="text/javascript"
   src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
   </script>
   </span></dd>
   </dl>
   </li>
   </ul>
   <span class="corners-bottom"><span></span></span></div></div>

3. If you want to display the ad block just after the forum list ends paste the same code AFTER <!– INCLUDE forumlist_body.html –>

Displaying ads one the viewforum page.
AdSense on the viewforum page

1. Open viewforum_body.html and find <!– INCLUDE forumlist_body.html –>
2. Before it add the SAME code as for the index page.
3. If you want to display the ad block just after the forum list ends paste the same code AFTER <!– INCLUDE forumlist_body.html –>
If you want to display the ad block after every forum block (though i don’t really recommend it if you have small forum blocks) find <!– IF topicrow.S_FIRST_ROW or not topicrow.S_TOPIC_TYPE_SWITCH –> and AFTER it copy the SAME code.
Find <!– IF topicrow.S_LAST_ROW –> and after (just before <!– ENDIF –>)

</ul>
 <span class="corners-bottom"><span></span></span></div>
</div>

paste the same code.

Displaying ads one the viewtopic page.
AdSense on the viewtopic page

1. Open viewtopic_body.html and find <!– BEGIN postrow –>
2. Before it add the SAME code as for the index page.
3. If you want to display the ad block just after the topic list ends past the same code AFTER <!– BEGIN postrow –>
4. If you want to display ads in the first post find

   <div class="content">{postrow.MESSAGE}</div>

   and BEFORE it add the following code

   <script type="text/javascript"><!--
   google_ad_client = "pub-xxx";
   /* 728x15 */
   google_ad_slot = "xxxx";
   google_ad_width = 728;
   google_ad_height = 15;
   google_color_border = "E1EBF2";
   google_color_bg = "E1EBF2";
   //-->
   </script>
   <script type="text/javascript"
   src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
   </script>

5. If you want to display an ad block after the content of the first post AFTER

   <div class="content">{postrow.MESSAGE}</div>

   add the following code

   <script type="text/javascript"><!--
   google_ad_client = "pub-xxx";
   /* 728x90 */
   google_ad_slot = "3092398785";
   google_ad_width = 728;
   google_ad_height = 90;
   google_color_border = "E1EBF2";
   google_color_bg = "E1EBF2";
   //-->
   </script>
   <script type="text/javascript"
   src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
   </script>

Displaying ads one the search results page.
AdSense on the search page

1. Open search_results.html and find <!– ENDIF –>
   <!– IF S_SHOW_TOPICS –>
2. Before it add the SAME code as for the index page.
3. If you want to add the ad block just after the search block ends add the SAME code AFTER it.

If you encounter problems with this method please give me a notice.
Also, if you want to see a live example check out this forum.

Have you enjoyed reading this article ? Subscribe to my feed.

Stumble It! • Digg This! • Save to del.icio.us • Add to Mixx! • Sphinn It! • Email this