Форма Подписаться на E-Mail для ucoz

Рейтинг:3.5

Оригинальный скрипт для подписи участников Ucoz сайтов на E-Mail почту любого желавшего,скрипт очень удобный,думаю он найдёт своё применение во многих сайтах

Установка:

Перед тем как создавать данное решение у себя на сайте, вам необходимо ознакомиться с инструкцией по регистрации аккаунта Feedburner.

Как настроить Feedburner

Счетчик Feedburner и подписка по E-mail

Шаг 1 - Установим HTML:

И так заходим в Feedburner => Выбираем нужный rss канал который вы создали => Выбираем вкладку Публикуй => Подписки по электронной почте => Ставим нужный язык => Сохраняем и копируем нужный html код:

Код

<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=center-dm/AimX', '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="center-dm/AimX" 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>

В вашем случае у вас будет такой же html код, но со своим фидом, в моём случае это - center-dm/AimX.

Теперь давайте изменим данный html код, пропишем ему нужные классы:

Код

<div class="cell-subscription">
  <div class="cell-subscription-info">

  <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=center-dm/AimX', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
  <p>Подписаться на E-Mail:</p>
  <input class="subscription-input" type="text" name="email"/>
  <input type="hidden" value="center-dm/AimX" name="uri"/>
  <input type="hidden" name="loc" value="ru_RU"/>
  <input class="subscription-button" type="submit" value="Подписаться" />
  </form>

  </div>
  </div>

Шаг 3 - Установим CSS:

Теперь когда мы проделали нужные манипуляции с данным html кодом, пропишем ему css стили:

Код

/* Форма Подписаться на E-Mail для ucoz
------------------------------------------*/
.cell-subscription {
  float:left;
  width: 250px;
  text-align:center;
  background: url(http://www.center-dm.ru/ucoz/vid_podskazka/2/cell-subscription.png) #fff repeat;
  border-radius: 3px;
}

.cell-subscription-info {
  float:left;
  width: 210px;
  padding: 10px 15px;
  margin: 5px 5px 5px 5px;
  background:#fff;
  border-radius: 3px;
}

.cell-subscription-info input {
  font:11px Verdana,Arial,Helvetica, sans-serif;
  padding: 5px 10px;
  border-radius: 3px;
}

.cell-subscription-info p {
  float:left;
  width: 100%;
  padding: 0px;
  margin: 0px;
}

.subscription-input{
  float:left;
  width: 188px;
  margin: 10px 0px;
  background:#FAFAFA;
  border: 1px solid #CAD3DA;
  color:#555;
}

.subscription-input:focus {box-shadow:inset 0px 0px 3px #e6e6e6!important;}

.subscription-button {
  cursor:pointer;
  background: #78db64!important;
  border:1px solid #33a41c!important;
  text-shadow:1px 1px 1px #258b10!important;
  font-weight: bold!important;
  color:#fff!important;
}

.subscription-button:active {box-shadow:inset 0px 0px 3px #23880e!important;}
.subscription-button:hover {background:#6cca59!important;}

На этом всё, мы создали для вашего сайта в системе uCoz свою подписку на E-Mail адрес ваших пользователей!