Как поставить в блог рекламное место

Как поставить на блог красивое место для рекламы.

Привет мои постоянные читатели и гости моего сайта

Хочу с Вами поделиться еще одним видом заработка на блоге. Предлагать место для рекламы желающим. Этим пренебрегать не надо. Возможно кто - нибудь согласится разместить свою рекламу на Вашем блоге за определенную плату. Цена будет зависеть от количества посетителей на Вашем блоге. Как это выглядит можете посмотреть здесь

Давайте приступим к самой вставке кода. Это делается очень легко.

Заходим в админку блога. Нажимаем изменить шаблон html. Находим строчку  ]]></b:skin>

Чуть выше этой строки вставляем следующий код.

/*****************************************
Имя: Blogspot рекламное место с CSS3
******************************************/
.lihat {width: 300px;height: 200px; margin: 5px;float: left;border: 10px solid #eee;overflow: hidden;position: relative;text-align: center;box-shadow: 1px 1px 2px #999;cursor: default;}
.lihat .masker,.lihat .content {width: 300px;height: 200px;position: absolute;overflow: hidden;top: 0;left: 0;}
.lihat img { display: block;position: relative;}
.lihat h2 {text-transform: uppercase;color: #fff;text-align: center;position: relative;font-size: 17px;padding: 10px;background: rgba(255, 0, 0, 0.5);margin: 20px 0 0 0;font-family: Verdana;}
.lihat p {font-family: verdana;font-size: 12px;position: relative;color: #fff;padding: 0 20px 0 20px;text-align: center;line-height: 20px;}
.lihat a.informasi {display: inline-block;text-decoration: none;padding: 7px 14px;color: #fff;text-transform: uppercase;box-shadow: 0 0 1px #000;font-family: "Courier New", Courier, monospace;background-color: #2788C2;}
.lihat a.info: hover {box-shadow: 0 0 5px #000;}
.pasang-iklan img {transition: all 0.2s linear;}
.pasang-iklan .masker {opacity: 0;background-color: rgba(0,0,0, 0.7);transition: all 0.4s ease-in-out;}
.pasang-iklan h2 {transform: translateY(-100px);opacity: 0;transition: all 0.2s ease-in-out;}
.pasang-iklan p {transform: translateY(100px);opacity: 0;transition: all 0.2s linear;}
.pasang-iklan:hover img {transform: scale(1.1,1.1);}
.pasang-iklan a.informasi {opacity: 0; transition: all 0.2s ease-in-out;}
.pasang-iklan:hover .masker {opacity: 1;}
.pasang-iklan:hover h2, .pasang-iklan:hover p, .pasang-iklan:hover a.informasi {opacity: 1;transform: translateY(0px);}
.pasang-iklan:hover p {transition-delay: 0.1s;}
.pasang-iklan:hover a.informasi { transition-delay: 0.2s;}
/*** Blogspot рекламное место с CSS3 конец ***/

Красный цвет размеры виджета, Вы можете изменить под себя.

Теперь идем в дизайн- добавить html гаджет и вставляем следующий код

<!--Код рекламное место Blogspot начало -->
<div class="lihat pasang-iklan">
<img alt="space iklan blogspot dengan CSS3" src="АДРЕС КАРТИНКИ" title="space iklan blogspot dengan CSS3"/>
<div class="masker">
<h2>Рекламное место свободно</h2>
<p>Для того, чтобы разместить объявление на страницах этого сайта, пожалуйста, свяжитесь с нами...</p>
<a href="URL адрес страницы" class="informasi" target="_blank" rel="nofollow" title="Контакт">Подробнее</a>
</div>
</div>
<!--Код рекламное место Blogspot конец -->

Вот и весь процесс. Но Вы можете сделать красивую картинку и направлять своих читателе на другой какой- то свой блог или рекламировать свою страницу. Применения разные, сами подумайте.

Код взят из зарубежного сайта Rivai Silaban за что ему спасибо.

С уважением Вероника.