Простая форма подписки для блога

Форма подписки по электронной почте - необходимый элемент любого блога.

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

Именно по этому опытные вебмастера уделяют форме подписки повышенное внимание, располагая её в самых заметных местах.

Простая и лаконичная форма подписки, которую я предлагаю вашему вниманию, обладает ещё одним неоспоримым достоинством - любой, даже начинающий блоггер, затратит на её установку не более 3-х минут.

Вот, как она выглядит:

Посмотреть работающий образец можно перейдя по ссылке на тестовый блог.

Код для этой формы создан усилиями автора блога MyBloggerTricks, с чьими надёжными и красивыми разработками я вас уже знакомил.

Установить форму подписки в Blogger

1. Заходим в Панель управления -- Дизайн -- Элементы страницы -- Добавить гаджет

2. Выбираем из списка "HTML/JavaScript" 

3. В предложенную форму вставляем код:

<style> .mbt-email{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrklpFYP_FaZmRb1TTMF_V3bdmr9xwzAfqZmE6_W3Ti3l6948JCVGh6U9WYnggfHD6WvfJAUPpvODIjszXz7ud3ZgF76NK40dAJJRyblgTQwdZbEboMsfgOJ1HHZXztAymUqSz9tRFj-Uz/s1600/email.png) no-repeat 0px 12px ; width:300px; padding:10px 0 0 55px; float:left; font-size:1.4em; font-weight:bold; margin:0 0 10px 0; color:#686B6C; } .mbt-emailsubmit{ background:#9B9895; cursor:pointer; color:#fff; border:none; padding:3px; text-shadow:0 -1px 1px rgba(0,0,0,0.25); -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; font:12px sans-serif; } .mbt-emailsubmit:hover{ background:#E98313; } .textarea{ padding:2px; margin:6px 2px 6px 2px; background:#f9f9f9; border:1px solid #ccc; resize:none; box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); -moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); -webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px; width:170px; color:#666;} </style> <div class="mbt-email"> Подпишитесь по Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feeds.feedburner.com/blogspot/FEeU', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"> <input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == "") {this.value = "Введите свой email";}" onfocus="if (this.value == "Введите свой email") {this.value = "";}" value="Введите свой email" type="text" /> <input type="hidden" value="FEeU" name="uri"/><input type="hidden" name="loc" value="en_US"/> <input class="mbt-emailsubmit" value="Подписка" type="submit" /> </form> </div>

4. В этом коде заменяем отрывок, выделенный красным, на URL своего Feed-канала (в моём случае это http://feeds.feedburner.com/blogspot/FEeU) Часть кода, подсвеченную жёлтым (FEeU) заменяем именем своего канала Feed, которое всегда находится в конце адреса канала 5. Сохраняем, перетягиваем виджет в нужное место (обычно форму располагают в верхней части сайдбара) и опять сохраняем. Теперь у вашего блога появилась отличная форма подписки, простая и заметная одновременно. 

 источник