Подарок
Приветствую Вас Гость RSS
RSS



Подписаться на E-mail:



Давайте дружить;)

Работа в интернете и финансовая свобода
Построй свой путь к финансовой свободе!
  • 1.jpg
    Изучив этот курс, Вы узнаете ровно пять секретов создания источника Пассивного Дохода. Этого достаточно, чтобы Вы определились - какой способ больше подходит лично для Вас. Узнать подробнее
  • 2.jpg
    Секреты практического SEO
    Скидка 13%
    Думаю, Вам не нужно объяснять, насколько важно для Вашего сайта иметь первые позиции в поисковых системах по ключевым для Вас запросам. Чем больше таких высоких мест, тем больше потенциальных клиентов приходит к Вам из поисковых систем. Узнать подробнее
  • 3.jpg
    Бесплатно
    В этом бесплатном курсе вы найдете 15 видеоуроков. Это проверенная на практике модель построения успешного инфобизнеса, для тех, кто не ищет халявы, а понимает, что создание и развитие любого бизнеса – это большой труд, Узнать подробнее
  • 4.jpg
    СКАЧАЙТЕ PDF: ПЛАН ОТ 0 ДО 2,500,000 В БИЗНЕС-КВЕСТЕ,
    ДЛЯ АКТИВНО РАСТУЩЕЙ НИШИ 2017 ГОДА
    Узнать подробнее
  • 5.jpg
    Бесплатно
    Надоело работать на дядю и получать за это копейки?
    Построй свой источник дохода в Интернете!
    Что Вы получите
    Узнать подробнее

ВАШ ПОДАРОК

Ваша информация защищена на 100%! Гарантированная защита от СПАМа!


Давайте дружить;)



Скрипты [8]Макеты сайта и его составляющие [2]

Программы и обучалки » Скрипты для сайта » Скрипты » Оформление формы подписки RSS для Feedburner


Оформление формы подписки RSS для Feedburner

01.03.2014, 13:56

Здравствуйте, сегодня мы с Вами оформим форму подписки RSS Ваших новостей в feedburner. Итак, приступим.

Интернет бизнесШаг 1. Заранее создайте иконку с логотипом RSS-канала и залейте себе на сервер. Разрешение не должно превышать разрешение блока веб-сайта, обычно это значение равно 200 px(пикселей). Оптимальным вариантом будет разрешение: 125x125 px(пикселей); 64x64px(пикселей). Меньше делать не нужно. Расширение лучше использовать в "PNG"- либо в "JPG"-формате, чтобы он очно подходил к косметическому дизайну веб-сайта. Какой выбрать стиль иконке – на своё усмотрение.

Шаг 2.Заходим в Feedburner -> RSS канал, который Вы создали -> Публикуй -> Подписки по электронной почте->Subscription Managment


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


Формы с кодами тут же обновятся. Теперь внимательно смотрим на код формы подписки (1-е поле).

Код

<form style="border:1px solid #ccc;padding:3px;text-align:center;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=fastzar', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Enter your email address:</p><p><input type="text" style="width:140px" name="email"/></p><input type="hidden" value="fastzar" name="uri"/><input type="hidden" name="loc" value="ru_RU"/><input type="submit" value="Subscribe" /><p>Delivered by <a href="http://feedburner.google.com" target="_blank">FeedBurner</a></p></form>


У Вас должен быть такой же код, но со своим фидом, в моём случае это – fastzar.

Форму можно изменять как Вам угодно, в смысле дизайна. Вот мы его и изменим.

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

Шаг 3.Скопируйте нижеприведенный код на отдельную страницу сайта, где будет располагаться форма подписки.

Код

<form class="subscription_e-mail" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=fastzar, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<p align="center"><font color="цвет" size="6">Подписаться на E-mail:</font></p>
<p align="center"><input class="rss_fieldn"type="text" name="email"/>
<input type="hidden" value="fastzar" name="uri"/>
<input type="hidden" name="loc" value="ru_RU"/>
<input class="rss_button" type="submit" value="Подписаться" /> </p>
</form>


И так мы с Вами имеем готовый html код, с которым мы будем работать в css стилях. Но для начала замените выделенное красным на свой фид и измените цвет надписей.

Шаг 4.Установим CSS. Теперь самое основное, это css стили, которые помогут нам привести форму rss подписки на почтовый ящик в надлежащий вид. Скопируйте нижеприведенный код CSS в файл таблицы стилей (с расширением *.css).

Код

/* Подписка на почтовый ящик
------------------------------------------*/
.subscription_email {
float:left;
width:300px;
}
.subscription_email p {
margin: 5px 0px;
}
.subscription_email input {
float:left;
font:11px Verdana,Arial,Helvetica, sans-serif;
}
.rss_fieldn {
color:#555;
width:200px;
height:27px;
outline:none;
padding:5px 10px;
border: 1px solid #CAD1DB!important;
border-right:none!important;
}
.rss_fieldn:focus {
box-shadow:inset 0px 0px 3px #ccc!important;
}
.rss_button{
width:100px;
height:27px;
cursor:pointer;
border:1px solid #186F8F!important;
color:#fff!important; text-shadow:1px 1px 1px #186F8F!important;
background: #3CB6E3!important;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3CB6E3), color-stop(1, #2CA0CA))!important;
background: -moz-linear-gradient(top, #3CB6E3 1%, #2CA0CA 100%)!important;
background: -o-linear-gradient(#3CB6E3, #2CA0CA)!important;
}

Если Вы разбираетесь в html и css, то без труда можете изменить дизайн на свой вкус!

Шаг 5.Создание ссылки RSS на Вашу форму подписки. В 1 шаге Вы выбрали картинку с логотипом RSS. Теперь эту картинку привяжем к Вашей форме подписки. Для этого копируем к себе в блокнот:


<a target="blank_" href="">
<img title="Новости" src=" " width="32"></a>

В первую строчку копируем URL Вашей страницы. Во 2-ю URL Вашей картинки.

Должно получиться вот что:


<a target="blank_" href="http://sitename.ru/podpiska/index.html">
<img title="Новости" src="http://sitename.ru/RSS/rss.png" width="32"></a>

Параметр width можно опустить, если хотите чтоб размер картинки был по умолчанию.

Все кнопка готова, копируйте код кнопки к себе на страницу сайта.

Как получать новости с блогов через минуту после публикации? Полезная программа-читалка новостей по RSS: RSS FAST>>



Источник:  не указан
Категория: Скрипты | Теги: Скрипты
Просмотров: 1316 | Загрузок: 0

Похожие материалы:


    Как установить боковую панель социальных закладок?

    Как установить боковую панель социальных закл

    ЧИТАТЬ
    Для чего нужны мета-теги?

    Для чего нужны мета-теги?

    ЧИТАТЬ
    Как создать RSS-ленту для сайта?

    Как создать RSS-ленту для сайта?

    ЧИТАТЬ
    Как установить кнопки социальных сетей на сайт?

    Как установить кнопки социальных сетей на сай

    ЧИТАТЬ







Гарантированная защита от СПАМа!




Поделись с друзьями:



Уважаемые пользователи! Если Вы используете информацию с сайта, пожалуйста, ставьте ссылку на источник!


Читайте также:

Как заработать на рекламе Google Adsense?
Партнерские программы инфопродуктов как прибыльная работа на дому в сети Интернет
Как заработать на партнерских программах?
Пассивный доход и его секреты
Партнерские программы инфопродуктов
Заработок в проекте Whole World
Заработок в игре Ферма Соседи
Самостоятельная раскрутка сайта с нуля
Заработок на легендарном Seosprint



Загрузка...


Если Вы нашли битую ссылку, пожалуйста, отпишите в комментарии!


Оставить комментарии:


Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]





нет аватара




ОБ АВТОРЕ
TELEGRAM
FACEBOOK
ВКонтакте
МОЙ YOUTUBE
Я В INSTAGRAM
ПОЛУЧАТЬ НОВОСТИ САЙТА
РЕКЛАМА


СКИДКА 13%!!!



БИЗНЕС-КВЕСТ
Кнопка сайта
Если Вам понравился данный материал, то можете рекомендовать его своим посетителям. Если Вы хотите обменяться с баннерами, пишите в форме Обратной Связи.

Работа в интернете и финансовая свобода

Код баннера
<a target="_blank" href="http://fastzar.ru" alt="Работа в интернете и финансовая свобода" title="Сайт Fastzar"><img src="http://fastzar.ru/baner/banner88x31.gif" alt="Работа в интернете и финансовая свобода"></a>
Для добавления сообщения авторизуйтесь

Вы хотите достичь финансовой независимости?
Узнайте все секреты построения успешного бизнеса в сети интернет!

Что такое инфобизнес и как он приносит деньги?

Как создать сайт и зачем он нужен в инфобизнесе?

Как зарабатывать в инфобизнесе большие деньги?

Что Вы получите:

очень полезные инфопродукты

права перепродажи на все инфопродукты

бесплатные уроки по созданию собственной системы продаж

только проверенные способы заработка в Интернете и Инфобизнесе

создание бесплатной рассылки

первый заработок в Интернете

а также Инфобизнес на автопилоте




Чтобы получить сборник, Просто введите Ваше Имя и E-mail в форму ниже и подтвердите свой e-mail, ссылка на скачивание будет выслана сразу же в письме.

Ваша информация защищена на 100%! Гарантированная защита от СПАМа!

Оставить отзыв