Новое в блоге
Loading...
17 дек. 2011 г.

Форма подписки под каждым постом

Привет! Сегодня в Школе Blogger(а) я покажу как установить форму подписки по электронной почте под каждым сообщением. Если у Вас еще нет возможности подписки на ваш блог через почту, рекомендую исправить данную ситуацию, потому что многие пользуются электронной почтой ежедневно и возможно Вы потеряли большую аудиторию, которая могла воспользоваться rss подпиской по email.

Посетитель сможет осуществить подписку на электронную почту, как при помощи перехода через ссылку, иконку или, введя свой емейл в специальную форму, как изображено на скриншоте или представлено у меня на боковой панели блога. Форма подписки выглядит вот так красиво:

Форма подписки по электронной почте
Так же можете посмотреть в живую,как форма выглядит под статьями. Подписка по почте смотреть. Дополнительно в этой форме присутствует:
 Изображение Вашего профиля или логотип блога,
 Краткая справка о себе или о блоге,
 Возможность присоединиться к Вам на twitter,
 Стать вашим другом на facebook

Если Вам понравилась форма подписки по электронной почте под каждым постом, тогда можно приступить к установке.

Заходим Шаблон -- Изменить HTML. С помощью сочетанием клавиш (Ctrl+F) ищем строчку ]]></b:skin> и перед ней вставляем стиль нашей формы:
.profile-box {
background: #E1DCDC;
margin: 20px 0 40px 0;
padding: 10px;
border: 1px solid #CEC2C2;
overflow: auto;
}
.profile-box p {
margin: 0;
padding: 0;
}
.profile-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
border: 1px solid #DFC7C7;
}
Дальше Вам нужно найти строчку <data:post.body/><div class='post-footer-line post-footer-line-1'/> если такой нет, тогда такую <div class='post-footer-line post-footer-line-2'> или <div class='post-footer-line post-footer-line-2'/> и прямо под ней (чуть ниже) вставьте этот код:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='profile-box'>
<p><img alt='' class='avatar avatar-70 photo' height='70' src='https://lh5.googleusercontent.com/-T6T3JXqfXug/TrOzfQON2YI/AAAAAAAABhM/cG6xIiuujNo/s300/0_4ea3e_ff1dbf45_M.jpg' width='70'/><b>Об авторе</b><br/>
<div style='text-align: justify; font-family: verdana; color: rgb(0, 0, 0);'>Супер блог Школа Blogger(а)<br/>
Follow Me on Twitter [at] <a href='https://twitter.com/#!/zagulyaevsv'>Сергей</a><br/>
Будте моим другом на Facebook [at] <a href='http://www.facebook.com/sergej.zagulaev'>Сергей</a><br/>
<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=jizET&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='border:1px solid #DDD;padding:3px;text-align:center;background:#F1F1F1;' target='popupwindow'><span style='margin:0 auto; padding-left:24px; position:relative;background: url(http://3.bp.blogspot.com/_b0xJ7qk6DTc/TEg2iHmUivI/AAAAAAAAAu0/j9tIV5fjTXw/s1600/myrss.gif) right center no-repeat;'/>Получите Бесплатные обновления: <input name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Введите email&quot;;}' onfocus='if (this.value == &quot;Введите email&quot;) {this.value = &quot;&quot;}' style='width:176px;height:18px; background: #ffffa0 url(http://1.bp.blogspot.com/_b0xJ7qk6DTc/TInWwRjgSUI/AAAAAAAABC0/DWQZc1mUvaU/s1600/new-email.png) left no-repeat;padding: 1px 0px 1px 24px;border: 1px solid #8cafe3;' type='text' value='Enter your email'/><input name='uri' type='hidden' value='Школа Blogger(а)'/><input name='loc' type='hidden' value='en_US'/><input type='submit' value='Подписаться'/>
<center><i>*Пожалуйста, нажмите на ссылку для подтверждения направлен в свой почтовый ящик.. и если не пришло во время проверить его в папке со спамом.*</i></center>
</form>
</div></p></div></b:if>

Дальнейшие Ваши действия такие, следует поменять:
 выделено синим--URL адрес с вашим изображением,фото,логотип и т.д.,
 выделено зелёным это  twitter, facebook,
 выделено красным поменять на Ваш канал Feedburner ID

И естественно поменять описание, что на русском на своё. Всё. Сохраните шаблон. Зайдите в свой блог и посмотрите, что получилось. До новых встреч. Пока.

Если Вам нужен виджет: оценка постов "Пять звёзд

Ух ты кнопочки! Понравилась статья? Поделитесь с друзьями:

0 коммент. :

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

 
Footer