"Subscription Widget στο Blog σας"

 

Θέλετε να προσελκύσετε ολοένα και περισσότερα άτομα στο site σας; Με αυτό το widget μπορείτε εύκολα να δώσετε την δυνατότητα στον επισκέπτη σας να δικτυωθεί με εσάς μέσω του Facebook, του Twitter αλλά και να λαμβάνει όλη την ροή των ειδήσεών σας (Rss).

Πώς Να Εγκαταστήσετε το Widget αυτό στο Site σας...

1. Συνδεθείτε στον blogger σας και κάντε κλικ στο εικονίδιο  που γράφει Πρότυπο...
2. Κάντε κλικ στο Επεξεργασία HTML
3. Πατώντας Ctrl+ F , βγαίνει η μπάρα αναζήτησης και γράφετε την λέξη ]]></b:skin>    
4. Με το που βρείτε την λέξη αυτή, ακριβώς πάνω από αυτή γράφεται τον παρακάτω κώδικα: 

.bnewsOldSocial ul {
 font-family: 'Oswald', sans-serif;
 margin: 15px 0;
 overflow: hidden;
}
.bnewsOldSocial ul li {
 float: left;
 width: 90px;
 padding: 0 0 0 55px !important;
 margin: 0 0 0 5px !important;
 line-height: 48px !important;
}
.bnewsOldSocial ul li a {
 font-size: 20px !important;
 text-decoration:none;
 padding:0 !important;
 margin:0 !important;
 text-decoration:none;
}
.bnewsOldSocial ul li a:hover {
 text-decoration:underline;
}
.bnewsOldSocial ul li.bnewsrss {
 background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH3nx0Mx1peQcZyAEGX1ouT4gRMklJOuVDdIVesXM_BEyelITiIsuReGt02hyphenhyphenvoDOZD-9jD12OMnqTOMHRJlTsfZOzzj7w2DLqFyS8LqswEuUHDLP5894irNujZ2j7Uk6aoRUIOmnFfQA/s48/Rss.png") no-repeat scroll left center transparent !important;
}
.bnewsOldSocial ul li.bnewsmail {
 background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjoqElsSoA54W1JUzH0bv88dPqWwr39j2XIrOcwZTze8Dkg_K0KzU_cRVWFlzcKn3QQMUsdHIa4BX4V2FOv0Qcgt88zWNA6DW9sV6-hoxGgHc9gdmurJ8ZMd-tKFx_AeTubob4JFrgg0x0/s48/e-mail.png") no-repeat scroll left center transparent !important;
}
.bnewsOldSocial ul li.bnewstwitter {
 background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiP8GcOycLDQURTqF7qd4j-8CbXYskO2EBN-jjOxMSl8QMM4OitByfn8NVITThgvKSb_QYrS0HMMZrpNfa0jmPr8AvnPmpBp8bQ4ouYTPUI0djxKTyzQwRHwXNQ1BLvmYxTEvSZvoLGtM/s48/Twitter.png") no-repeat scroll left center transparent !important;
}
.bnewsOldSocial ul li.bnewsfacebook {
 background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx8vVnwR9Z5cyYuClGcGmypcB-LeXXHWDUEcVeU1VThXosV2wbhSBRToBOm55nfpsF4YZKkvt5GM5ifos1qG_UEtHjMOaecoqMtTayMiksLm7qAL8OU0AjdlJcjKjZvAcIinPv2oYPz1s/s48/Facebook.png") no-repeat scroll left center transparent !important;
}
#bnewsEmailsub {
 display: block;
 clear: both;
 margin: 10px 0;
}
form.bnewsEmailform {
 margin: 20px 0 0;
 display: block;
 clear: both;
}
.emailText {
 background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUZwWnyXXbUJr27GXyWHlXHsA3mDFM6eHsDhgpELRHUh5tYPTfMoJhobgHccs-Iv-yGJ90oH0VppmvrZt7vY6s-lOeRprzMET9x_ViGAaADN1V7Qd4UieHnsLeUcMyAGIi33dSaRN94js/s28/bnews-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%);
}

Προσθέτωντας το widget στην Σελίδα μας...

1. Πηγαίνουμε στο εικονίδιο Διάταξη και πατάμε Προσθήκη ενός νέου gadget 
2. Επιλέγουμε το HTML/Javascript  και στο νέο παράθυρο που ανοίγει κάνουμε αντιγραφή-επικόλληση τον παρακάτω κώδικα... 

 

<div class="bnewsOldSocial">
 <ul>
  <li class="bnewsrss"><a href="http://feeds.feedburner.com/Blogger-News">RSS</a></li>
  <li class="bnewsmail"><a href="http://feedburner.google.com/fb/a/mailverify?uri=Blogger-News" >Email</a></li>
  <li class="bnewstwitter"><a href="http://twitter.com/Blogger-News">Twitter</a></li>
  <li class="bnewsfacebook"><a href="http://facebook.com/Blogger-News">Facebook</a></li>
 </ul>
</div>
<div id="bnewsEmailsub">
 <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggernews', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" class="bnewsEmailform">
  <input type="hidden" value="bnews" name="uri" />
  <input type="hidden" name="loc" value="en_US" />
  <input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Προσθέστε το E-mail σας...&quot;;}" onfocus="if (this.value == &quot;Προσθέστε το E-mail σας...&quot;) {this.value = &quot;&quot;}" value="Προσθέστε το E-mail σας..." name="email" class="emailText" />
  <input type="submit" class="emailButton" value="SignUp" title='' />
 </form>
</div>