Притурка форма за абонамент със социални икони

Добър ден, приятели, читатели и посетители на блога. Днес имам за вас една красива, елегантна форма на притурка за абонамент с икони за социалните мрежи. Разполага се в блога чрез притурката HTML / JavaScript. Можете да замените предложените от мен социални икони с ваши, да промените CSS стиловете и в крайна сметка да я направите напълно уникална, подходяща за шаблона на вашия блог.
В Блог за блогове има много предложения за социални икони в блога. Този път ви предлагам социални икони в комбинация с форма за абонамент. А мнението и препоръките относно значението на формата на абонамент са тук. Ако сте пропуснали нещо, можете да видите тук или тук. А вариантът, който ви предлагам днес изглежда така.
Кодът на тази форма за абонамент е:

<style>.w2bOldSocial ul {
font-family: 'Oswald', sans-serif;
margin: 15px 0;
overflow: hidden;
}
.w2bOldSocial ul li {
float: left;
width: 90px;
padding: 0 0 0 55px !important;
margin: 0 0 0 5px !important;
line-height: 48px !important;
}
.w2bOldSocial ul li a {
font-size: 20px !important;
text-decoration:none;
padding:0 !important;
margin:0 !important;
text-decoration:none;
}
.w2bOldSocial ul li a:hover {
text-decoration:underline;
}
.w2bOldSocial ul li.w2brss {
background: url("http://s45.radikal.ru/i109/1406/43/219daaabb709.png") no-repeat scroll left center transparent !important;
}
.w2bOldSocial ul li.w2bгугл {
background: url("http://s019.radikal.ru/i618/1406/40/71d113bc8bce.png") no-repeat scroll left center transparent !important;
}
.w2bOldSocial ul li.w2btwitter {
background: url("http://s019.radikal.ru/i618/1406/76/98d12801cd3d.png") no-repeat scroll left center transparent !important;
}
.w2bOldSocial ul li.w2bfacebook {
background: url("http://i069.radikal.ru/1406/d9/74471340c15b.png") no-repeat scroll left center transparent !important;
}
#w2bEmailsub {
display: block;
clear: both;
margin: 10px 0;
}
form.w2bEmailform {
margin: 20px 0 0;
display: block;
clear: both;
}
.emailText {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjLbCZYsdifmVHsX3ykCPuP_tEA89LjmY_YwHHWeGAKTf8wbM4lzr-6z6HfjKwjWcsZc1Sy2g-hsRBaiCiRuPtQDyMUmzQ6nmNBkGsy_XhwcEzFrKopN9C_eGiYLIlFJCLOsMwQyoSihdKB/s28/w2b-mail.png") no-repeat scroll 4px center transparent;
padding: 7px 15px 7px 35px;
color: #444;
font-weight: bold;
text-decoration: none;
border: 1px solid #D3D3D3;

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;

-webkit-box-shadow: 1px 1px 2px #CCC inset;
-moz-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.emailButton {
color: #444;
font-weight: bold;
text-decoration: none;
padding: 6px 15px;
border: 1px solid #D3D3D3;
cursor: pointer;

-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;

background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}</style>

<div class="w2bOldSocial">
    <ul>
        <li class="w2brss"><a href="http://feeds.feedburner.com/#### ">RSS</a></li>
        <li class="w2bгугл"><a href=" https://plus.google.com/u/0/####/posts" >Гугл+</a></li>
        <li class="w2btwitter"><a href="https://twitter.com/#### ">Twitter</a></li>
        <li class="w2bfacebook"><a href="https://www.facebook.com/#### ">Facebook</a></li>
    </ul>
</div>
<div id="w2bEmailsub">
    <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggerwidgetgenerators', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="w2bEmailform">
        <input type="hidden" value="domahniedela " name="uri" />
        <input type="hidden" name="loc" value="en_US" />
        <input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Въведете вашия email..." name="email" class="emailText" />
        <input type="submit" class="emailButton" value="изпрати" title='' />
    </form>
</div>

Копирайте го в уърдовски файл или там, където обикновено го правите, за да промените настройките, ако желаете това. Какво можете да промените?

➤Ако смятате за необходимо можете да сменете иконите на социалните мрежи със свои. Мястото им в кода е маркирано в червено.

➤В синьо са маркирани адресите на вашите страници в социалните мрежи. Разберете кои са вашите адреси, като отворите страниците си и копирайте това, което се показва в браузъра.

➤В зелено е текстът за въвеждане на email –а. И него можете за замените със свой.

➤В CSS стилове подберете вариант, подхождащ на вашия проект или ги оставете така както са, ако ви устройва.

Това е всичко. Поставете готовия код в притурката HTML / JavaScript и да я преместете на видно място в страничната колона на блога. Нека да привлече веднага вниманието на посетителите.
На добър час.

Здраве за всички вас! Не забравяйте да правите добро на други хора!

Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога на: