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

Виджет подписаться по Email (Subscribe) для Blogger

podpisat'sja-po-EmailДоброго времени суток, дамы и господа! Я уже показывал вам, как разместить форму подписки по email после каждого сообщения и на боковую панель в вашем блоге. Вспомнили? Так вот, время не стоит на месте, благодаря разработкам зарубежных умельцев, появляются новые, более функциональные виджеты подписки по электронной почте для платформы Blogger. С вашего разрешения, сегодня я познакомлю вас с новинками, которые отыскал на просторах буржунета. Спасибо им, за то, что у меня появляются темы для новых сообщений. Давайте начнем.

Красивый Blogger виджет подписаться по Email

Этот блок подписки можно установить, как на боковую панель блога (смотреться будет лучше, если ширина  сайдбара 300), так и после каждого сообщения.

На боковой( здесь, ширина 260) будет выглядеть так:

Subscribe-po-Email
Виджет подписаться по Email

После статьи:

Subscribe-Email
Виджет подписаться по Email после поста

Кто предпочитает минимализм,тогда эта форма для вас. Установка стандартная. Все стили устанавливаем чуть выше строки ]]></b:skin> в вашем шаблоне. Код HTML устанавливаем, если в сайдбар блога тогда при помощи волшебного гаджета " HTML/JavaScript ", а если после статьи тогда после одной из этих строчек:

<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-3'/>

И так, стиль для установки такой:

Друзья, после установки этого виджета цвет может отличаться от скриншота, все настройки цвета производятся в коде выше.

HTML код виджета:

Вставьте ваш фид блога, напишите подходящий текст, измените ширину 300 на подходящий вам размер. Переходим к следующему блоку.

Социальный виджет подписаться по Email с анимацией

Блин, мне самому нравится это чудо, очень красиво смотрится:

Subscribe-now
Социальный виджет подписаться по Email с анимацией

Как видите здесь, не только можно подписаться по почте и rss (волны анимированные), но и присоединиться к вам в социальных сетях. Для этого виджета я объединил стиль и HTML код вместе. заключив CSS в теги <style> стиль </style>, для того, чтобы облегчить вам его установку. Виджет устанавливается на боковую панель блога.

Вот этот код для установки на ваш блог:

В этом коде подставьте свои данные на соцсети,  id фида, ссылку блога моего, замените на свой URL, напишите свой текст и так далее. Поехали дальше.

Blogger виджет всё в одном

Я даже не знаю, как этот виджет назвать. Назову его - многофункциональным гаджетом с кодом HTML 5 и CSS 3. В этом блоке в дополнение к подписи по почте присутствует: место под рекламу 120 х 120 (использовать можно не обязательно под объявление); социальные кнопки Like Facebook, Google plus, Follow Twitter - "Присоединиться",  а так же присутствует в форме, название читаемой статьи (SEO ссылка). Вот он супер красивый виджет:

Subscribe-Vidzhet-Email-socseti
Многофункциональный виджет подписки HTML 5 и CSS 3

Этот виджет можно увидеть воочию тут. Фон у меня получился серенький, но у вас должен быть белый.

Стиль для данного виджета:

Код HTML  для установки под сообщение в вашем блоге:

Здесь, так же, замените мои данные в соцсетях на свои и  надписи впишите как вам захочется. И напоследок, думаю на сегодня хватит, а то больно пост получится большой, не каждый дойдет до конца, чтобы поблагодарить в комментариях (я надеюсь).

Многофункциональный виджет для Blogger

В блок входит: форма подписки; социальные кнопки и даже не поверите, похожие сообщения. Вот так то. Выглядеть виджет будет так, скрин будет буржуйский, так как у меня уже не куда его устанавливать:

related-post-blogspot
Много функциональный виджет для Blogger

Стиль виджета:

Код для вставки после сообщения:

Все так же, ссылки на профили соцсетей, текст свой и так далее. На этом у меня все. Конечно есть ещё запасы, но это в следующий раз. Чтобы не пропустить новые статьи прошу подписаться на мой блог. До встречи. Пока, пока.

Виджеты одолжил у индонезийского автора - rivai-silaban, дай ему господь здоровья и побольше создать хороших и разных виджетов для нас, российских пользователей.

Всего доброго, Сергей - блог Школа Bloggera

Комментарии

  • Ну Сергей у меня глаза разбегаются. И думаю придётся отступить от моих принципов минимализма.
    многофункциональный гаджет с кодом HTML 5 и CSS 3. Суппер. Пошла играться. А с анимацией вообще что-то. Благодарна Вам. Спасибо.

    • Виктория, как приятно читать такие комментарии. Значит я не зря мучился с их проверкой на работоспособность и так далее. Надо здесь на блоге установить виджет топ комментаторов, Вы у меня точно войдете в top, пусть все видят какие у меня замечательные читатели. 🙂

  • Сергей. Ну вы меня прямо в краску ввели.
    с кодом многофункционального гаджета немного повозилась. Но в нём поменяла теги на и т.д. а то по вертикали разместились соцсети.. А так всё получилось . Сейчас попробую анимашку. Ох и люблю я это всё.

    • Привет, Виктория! Если иконки друг над другом оказались, наверное надо ширину виджета поменять, в большую сторону. Да, анимашка класс.:)

  • Сергей, спасибо. поставила себе анимашку. Немного подправила под себя. Работает. И ещё, почему-то, когда я отправляю комментарий Вам и нажимаю уведомлять у меня абракадабра вылазит. А без этой галочки нормально.

  • Спасибо, Сергей! Все просто супер, возму ваш сайт в закладки. Спасибо!

  • Здравствуйте Сергей, последний код подписки, в нем не хватает в конце и без него даже не сохраняет, в стиле он уехал у меня в левый нижний угол экрана ), отказался, думаю, вот как бы на фиббернер примастырить нужную оболочку.

  • Закрывающего тега Тега «див» не хватает

    • Надо проверить, попробую его куда нибудь установить, хотя места уже нет. Опять придется демоблог создавать.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Решите задачку: *