2012-10-26, 12:00 PM
OK so today im going to show you how to add a shadow or border around your Google ads! Just listen carefully and im sure you will get it right.
Step 1
Go to your Admin CP >> Templates >> Your themes templates >> Header Templates >> header
Step 2
Find:
Replace with:
Step 3
Go back to >> Your themes templates >> Show Thread Templates >> showthread
Find:
Add above:
Step 4
Go to >> Templates & Style >> Themes >> your theme >> global.css >> Edit Stylesheet: Advanced Mode
Then add the to the bottom of the css:
To add a border instead of a shadow use the css below.
Feel free to change the border style (solid / dotted etc) thickness (1px / 3px etc) and border color (#000 / #00FF00 etc).
Step 5
To change the colour of the border edit: box-shadow: 0px 0px 4px 4px #253D66; change the #253D66; to your desired hex colour, hex colours can be found here: http://www.colorpicker.com
You will have to do this for both .headerad and .headerad2 now .headerad is the top ad and .headerad2 is the bottom ad when viewing a thread.
Enjoy you have successfully created a border or shadow around your Google ads!
This tutorial was written for another forum please bare in mind the steps will be different depending what you call your ads.
Step 1
Go to your Admin CP >> Templates >> Your themes templates >> Header Templates >> header
Step 2
Find:
<navigation>
<br />
Replace with:
<navigation>
<br />
<center><div class="headerad">{$headerad}</div></center>
<br />
Step 3
Go back to >> Your themes templates >> Show Thread Templates >> showthread
Find:
{$quickreply}
Add above:
<center><div class="headerad2">{$topicad}</div></center>
Step 4
Go to >> Templates & Style >> Themes >> your theme >> global.css >> Edit Stylesheet: Advanced Mode
Then add the to the bottom of the css:
.headerad {
box-shadow: 0px 0px 4px 4px #253D66;
-moz-box-shadow: 0px 0px 4px 4px #253D66;
-webkit-box-shadow: 0px 0px 4px 4px #253D66;
-khtml-box-shadow: 0px 0px 4px 4px #253D66;
-icab-box-shadow: 0px 0px 4px 4px #253D66;
width: 468px;
}
.headerad2 {
box-shadow: 0px 0px 4px 4px #253D66;
-moz-box-shadow: 0px 0px 4px 4px #253D66;
-webkit-box-shadow: 0px 0px 4px 4px #253D66;
-khtml-box-shadow: 0px 0px 4px 4px #253D66;
-icab-box-shadow: 0px 0px 4px 4px #253D66;
width: 728px;
}
To add a border instead of a shadow use the css below.
.headerad {
border: 1px solid #000;
width: 468px;
}
.headerad2 {
border: 1px solid #000;
width: 728px;
}
Feel free to change the border style (solid / dotted etc) thickness (1px / 3px etc) and border color (#000 / #00FF00 etc).
Step 5
To change the colour of the border edit: box-shadow: 0px 0px 4px 4px #253D66; change the #253D66; to your desired hex colour, hex colours can be found here: http://www.colorpicker.com
You will have to do this for both .headerad and .headerad2 now .headerad is the top ad and .headerad2 is the bottom ad when viewing a thread.
Enjoy you have successfully created a border or shadow around your Google ads!
This tutorial was written for another forum please bare in mind the steps will be different depending what you call your ads.