Меняем вид AdSense

Меняем вид AdSense 

Есть мнение, что Google AdSense Ads не любят чтобы с ними экспериментировали. Экспериментировать, нарушая при этом целостность его кода действительно нельзя! Но что же делать если хочется избавиться от скучного и весьма уже надоевшего вида этих
объявлений?

На помощь приходит CSS. Все эксперименты проводились на себе, результат абсолютно положительный. Во всех примерах абсолютно не трогается код AdSense, он просто обрамляется в стиль CSS, которого в коде шаблона вашего блога или сайта предостаточно!

Для того, чтобы установить рекламу AdSense в новом дизайне нужно выполнить по порядку несколько действий:

1. Получить код рекламного объявления в AdSense;
2. Скачать в примере фон для рекламного блока (в каждом случае он естественно разный под разные форматы);
2. Вставить в CSS часть вашего шаблона нижепреведённый для каждого случая CSS код, при этом заменяя строку вида YOUR-FOLDER/2007/04/background.png на URL-адрес куда вы скачали фон для рекламного блока;
3. Вставить соответствующий HTML код в место где будет располагаться рекламный блок, а вместо строки <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --> вставить код полученный в AdSense.

Ни одно из перечисленных действий не противоречит Terms Of Use.
Украшайте ваши сайты рекламой!

Для Blogger нужно вставить CSS код в шаблон, затем создать новый элемент HTML/Javascript и вставить туда HTML из примера.


1. Голубой банер со скруглёнными краями в косую полоску



CSS код:
#ad_code { width:516px; text-align:center; background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; padding:35px 0; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #003366
Border Color: #003366
Text Color: #666666
Link Color: #FFFFFF
URL Color: #666666

Скачать фон для AdSense

---

2. Тлеющий банер



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; text-align:center; padding:11px 10px 10px 9px; width:487px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #666666
Border Color: #666666
Text Color: #26AEED
Link Color: #FFFFFF
URL Color: #26AEED

Скачать фон для AdSense

---

3. Банер рассвет



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/01/background.png) center center no-repeat; padding:25px 0; width:468px; text-align:left; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FFFFFF
Border Color: #FFFFFF
Text Color: #777777
Link Color: #282828
URL Color: #777777

Скачать фон для AdSense

---

8. Чёрный банер с градиентом



CSS код:
#ad_code { text-align:center; width:490px; padding:15px; background:transparent url(YOUR-FOLDER/2006/12/background.png) center center no-repeat; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #333333
Border Color: #333333
Text Color: #FFFFFF
Link Color: #5C9CDD
URL Color: #CCCCCC

Скачать фон для AdSense

---

9. Чёрный полубанер с градиентом



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/05/background.png) center center no-repeat; width:314px; text-align:center; padding:6px 45px 6px 35px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #333333
Border Color: #333333
Text Color: #999999
Link Color: #FFFFFF
URL Color: #999999

Скачать фон для AdSense

---

10. Оранжевый в полосочку полубанер



CSS код:
#ad_code { background:transparent url(YOUR-FOLDER/2007/01/background.png) center center no-repeat; text-align:center; width:312px; padding:65px 0; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FF9933
Border Color: #FF9933
Text Color: #111111
Link Color: #FFFFFF
URL Color: #111111

Скачать фон для AdSense

---

11. Утончённо-голубой полубанер



CSS код:
#ad_code { width:260px; text-align:center; padding:10px 20px 20px 10px; background:transparent url(YOUR-FOLDER/2007/01/background.png) center center no-repeat; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #5D8AC9
Border Color: #5D8AC9
Text Color: #CBE6A6
Link Color: #FFFFFF
URL Color: #CBE6A6

Скачать фон для AdSense

---

12. Чёрный полубанер



CSS код:
#ad_code { width:253px; text-align:left; padding:16px 0 23px 5px; background:transparent url(YOUR-FOLDER/2006/12/background.png) center center no-repeat; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #333333
Border Color: #333333
Text Color: #CCCCCC
Link Color: #FFFFFF
URL Color: #CCCCCC

Скачать фон для AdSense

---

13. Кнопка Чёрный Бриллиант



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/05/background.png) center center no-repeat; width:248px; text-align:center; padding:58px 67px 67px 58px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #333333
Border Color: #333333
Text Color: #FFFFFF
Link Color: #FFFFFF
URL Color: #FFFFFF

Скачать фон для AdSense

---

14. Кнопка с тенью



CSS код:
#ad_code { background: #ffffff url(YOUR-FOLDER/2007/05/background.png) center center no-repeat; text-align:center; padding:3px 13px 13px 3px; width:138px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FFFFFF
Border Color: #FFFFFF
Text Color: #038C03
Link Color: #038C03
URL Color: #038C03

Скачать фон для AdSense

---

15. Чёрная с золотом кнопка



CSS код:
#ad_code { background:#ffffff url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; width:161px; height:161px; padding-top:20px; text-align:center; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FFCC33
Border Color: #FFCC33
Text Color: #333333
Link Color: #000000
URL Color: #333333

Скачать фон для AdSense

---

16. Чёрная кнопка



CSS код:
#ad_code { background:#ffffff url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; width:163px; height:166px; padding-top:15px; text-align:center; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #333333
Border Color: #333333
Text Color: #888888
Link Color: #FFFFFF
URL Color: #888888

Скачать фон для AdSense

---

17. Скруглённая кнопка с тенью



CSS код:
#ad_code { text-align:center; padding:10px 0; background:transparent url(YOUR-FOLDER/2007/02/background.png) center no-repeat; width:182px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FFFFFF
Border Color: #FFFFFF
Text Color: #666666
Link Color: #336699
URL Color: #666666

Скачать фон для AdSense

---

20. Синий 2.0



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; text-align:center; padding:9px 15px 18px 7px; width:363px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #28527B
Border Color: #28527B
Text Color: #EEEEEE
Link Color: #FFFFFF
URL Color: #EEEEEE

Скачать фон для AdSense

---

21. Доска почёта Тучи



CSS код:
#ad_code { background:#ffffff url(YOUR-FOLDER/2007/05/background.png) center center no-repeat; width:768px; padding:18px 22px 22px 18px; text-align:center; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #E8F5FF
Border Color: #E8F5FF
Text Color: #0099FF
Link Color: #000000
URL Color: #0099FF

Скачать фон для AdSense

---

23. Доска почёта Скомканая Бумага



CSS код:
#ad_code { width:765px; text-align:center; padding:30px 25px 30px 15px; background:transparent url(YOUR-FOLDER/2007/01/background.png) center center no-repeat; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #FFFFFF
Border Color: #FFFFFF
Text Color: #555555
Link Color: #006699
URL Color: #444444

Скачать фон для AdSense

---

24. Доска почёта New Digg



CSS код:
#ad_code { width:750px; padding:10px; background:transparent url(YOUR-FOLDER/2006/12/background.png) center center no-repeat; text-align:center; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #CCDEAF
Border Color: #CCDEAF
Text Color: #000000
Link Color: #1B5790
URL Color: #444444

Скачать фон для AdSense

---

26. Серый пузырьковый небоскрёб



CSS код:
#ad_code { width:142px; background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; text-align:center; padding:11px 6px 19px 0; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #CCCCCC
Border Color: #CCCCCC
Text Color: #333333
Link Color: #111111
URL Color: #333333

Скачать фон для AdSense

---

27. Красный газетный небоскрёб



CSS код:
#ad_code { width:140px; background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; text-align:center; padding:10px 8px 10px 0; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #CD2424
Border Color: #CD2424
Text Color: #FFFFFF
Link Color: #FFEEAA
URL Color: #FFEEAA

Скачать фон для AdSense

---

28. Small Square металл



CSS код:
#ad_code { width:230px; padding:18px 15px; text-align:center; background:transparent url(YOUR-FOLDER/2007/01/background.png) center center no-repeat; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #6DA6D1
Border Color: #6DA6D1
Text Color: #104570
Link Color: #000000
URL Color: #104570

Скачать фон для AdSense

---

29. Small Square в голубой дымке



CSS код:
#ad_code { background:#FFFFFF url(YOUR-FOLDER/2007/04/background.png) center center no-repeat; text-align:center; padding:30px; width:260px; }

HTML код:
<div id=\"ad_code\"> <!-- REPLACE ONLY THIS LINE WITH YOUR AD CODE --></div>

Цветовая схема:
Background Color: #666666
Border Color: #666666
Text Color: #FFFFFF
Link Color: #FFFFFF
URL Color: #FFFFFF

Скачать фон для AdSense

---