Гаджет формы подписки на обновления RSS ленты



Здравствуйте дорогие читатели и посетители. Сегодня я не отниму у Вас много времени, предлагаю симпатичную форму подписки RSS ленты блога для новых читателей. Пример на скриншоте. Код устанавливаем в макете блога: дизайн добавить гаджет и сохраняем в нужном месте.

Форма подписки на обновления RSS ленты
Форма подписки на обновления RSS ленты

Здесь код формы

<style>
.bordered {
    border: solid #ff7417 2px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 1px #ccc;
    -moz-box-shadow: 0 1px 1px #ccc;
    box-shadow: 0 1px 1px #ccc;       
}
.bordered2 {
height: 25px;
    background-color: #ff7417;
    -webkit-border-top-left-radius: 6px;
    -khtml-border-radius-topleft: 6px;
    -moz-border-radius-topleft: 6px;
     border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -khtml-border-radius-topright: 6px;
    -moz-border-radius-topright: 6px;
     border-top-right-radius: 6px;     
     text-shadow: 0 1px 0 rgba(255,255,255,.5);
     border-top: solid #ffffff 1px;
}
</style>
<div class="bordered">
<div class="bordered2">
<center>
<span style="color: #ffffff; font-size: 16px;"><b>Будьте первыми!</b></span></center></div>
<a href="http://feeds2.feedburner.com/bloggertrix" rel="alternate" title="" type="application/rss+xml"><img border="0" alt="" style=" padding-bottom:20px; margin: 0pt 10px 10px 0pt; float: left; width:100px; height:100px;" src="http://1.bp.blogspot.com/-4GQT-yxEq1g/UKnA17_kO8I/AAAAAAAABM4/F0o3EiCuzB8/s1600/RSS-Reader-Book-icon.png"/></a><p><a href="http://feeds2.feedburner.com/bloggertrix" rel="alternate" title="" type="application/rss+xml">Читайте новые записи блога</a><span style="color: #ffffff; font-weight: bold;"></span></p>
<style>
input.bt {
color:#fff;
font: bold 10px Arial, sans-serif;
background:#F39100;
border:0;
padding:3px;
}
input.bthov {
color:#fff;
font: bold 10px Arial, sans-serif;
border:2px solid #F39100;
padding:3px;
}
</style>
<form action="http://feedburner.google.com/fb/a/mailverify" style="padding: 5px;"target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/tPDSo', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input style=" color:#ffffff; background: #fff; border:1px solid #ff7417; width: 90px;" name="email" type="text"/>
<input value="blogspot/tPDSo" name="uri" type="hidden"/><input value="en_US" name="loc" type="hidden"/> <input onmouseover="this.className='bt bthov'" onmouseout="this.className='bt'" value="Да!" class="bt" type="submit"/></form><br/>
</div>


Основные настройки выделены жирным шрифтом. Текст измените на свой. Высота и ширина по 100px, если установите виджет под сообщение, ширина формы будет на всю ширину страницы. Выделенное жирным синим-ID блога в Feedburner, смотрим здесь:

Посмотреть ID блога в аккаунте Feedburner
ID блога в аккаунте Feedburner

В аккаунте Feedburner нажмите вверху вкладку публикация, затем слева подписки по электронной почте, посмотрите в коде формы свой ID.

Если будут вопросы по настройке и установке гаджета, пишите в комментариях. Поделитесь со своими друзьями в социальных сетях, может кому-то из друзей понравится такая форма. Источник:  http://www.bloggertrix.com. Всем всего доброго.

TEXT.RU - 100.00%




Автор статьи ✎ Olga Protasova Выпуск ✹ 12/06/2015 Ярлыки ►


Открыть комментарии →

0 коммент. :

Отправить комментарий

Ув. читатели! Для вставки HTML кода в комментарии, воспользуйтесь в меню Генератором преобразования HTML кода.

 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *