Παρακολούθηση μέσω ηλεκτρονικού ταχυδρομείου Widget
Ένα widget που προσαρμόζεται σε όλα τα site/blog.
Αφού έχετε σύνδεση το site/blog σας στο feedburner.com μπορείτε να κάνετε αντιγραφή επικόλληση και στην συνεχεια να επεξεργαστείτε τον κώδικα.
* Το κουμπί εμφανίζεται στο κάτω μέσος της σελίδας και με ένα εφέ εμφανίζεται στο κέντρο της σελίδας, με επιλογή [X] Κλείσιμο.
Πληροφορίες κατά το άνοιγμα.
Το όνομα username στης υπηρεσία feedburner.
Μπάρα εισαγωγής κειμένου και κουμπί.
<style>
/* foulscode.com*/
#popup-wrap .popup-button {
background: #333333 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheqSTaspBfkWNZgWijeNw0kyvhgTkMjnxO6lEde_4YZTYh0pdKutlYbWmI1o0I7eocLYd5lfMzl8ZoUajXJDmV3GNmaSnF8Q5nDachktHFfsKuohVbl7dh9i9g5_mHsj5RITc91g5ap4M/s1600/boletin-biblioteca-digital-en-espa%25C3%25B1ol-e-sword.png) no-repeat scroll center center; border-radius: 55%; bottom: 15px;
55px;
cursor: pointer;
height: 45px;
left: 15px;
position: fixed;
width: 45px;
z-index: 99999;
-webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-moz-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
#popup-wrap .popup-button:hover {
background-color: #bfbfbf;
}
#popup-wrap .popup-bg {
opacity: 0;
visibility: hidden;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0, .8);
transition: opacity .25s ease;
z-index: 999999;
}
/* foulscode.com*/
#popup-wrap .popup-bg-close {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
cursor: pointer;
}
#popup-wrap .popup-trigger {
display: none;
}
#popup-wrap .popup-trigger:checked + .popup-bg {
opacity: 1;
visibility: visible;
}
#popup-wrap .popup-trigger:checked + .popup-bg .popup-form { top: 0; }
#popup-wrap .popup-form {
border: solid 10px #fff;
transition: top .25s ease;
position: absolute;
top: -20%;
right: 0;
bottom: 0;
left: 0;
max-width: 42%;
margin: auto;
overflow: auto;
padding: 2.5em;
max-height: 260px;
background: #4493c4;
text-align: center;
background-image: url(http://cdn.pcwallart.com/images/light-lime-green-wallpaper-3.jpg);
background-position: center center;
background-repeat: repeat;
background-color:#bfbfbf;
}
#popup-wrap .popup-inner {
color: #333;
font-size: 15px;
font-family: "Century Gothic", sans-serif;
font-weight: normal;
line-height: normal;
}
#popup-wrap .popup-title {
display: block;
font-size: 4em;
font-weight: normal;
margin-bottom: 20px;
font-family: 'Great Vibes', cursive;
text-transform: ;
font-weight: 550;
color: #333;
text-shadow: 0 2px 1px #999;
margin-bottom: 0px
}
#popup-wrap .popup-content {
font-size: 16px;
line-height: 26px;
}
#popup-wrap .popup-footer {
font-size: 75%;
font-style: italic;
}
#popup-wrap #mailbox {
background: #fff;
border: none;
border-radius: 3px;
box-sizing: border-box;
color: #7b7b7b;
font-family: "Century Gothic",sans-serif;
font-size: 14px;
font-weight: bold;
line-height: 30px;
padding: 10px 20px;
width: 100%;
}
#popup-wrap #subbutton {
background: #333;
border: none;
border-radius: 3px;
box-sizing: border-box;
color: #fff;
font-family: "Century Gothic",sans-serif;
font-size: 12px;
font-weight: bold;
line-height: 30px;
padding: 10px 20px;
width: 100%;
}
#popup-wrap #mailbox {
margin: 0 0 10px;
text-transform: lowercase;
}
#popup-wrap #subbutton {
cursor: pointer;
margin: 0;
text-transform: uppercase;
}
#popup-wrap #subbutton:hover {
background: #444;
}
#popup-wrap .popup-form-close {
position: absolute;
right: 1em;
top: 1em;
width: 1.1em;
height: 1.1em;
cursor: pointer;
}
/* foulscode.com*/
#popup-wrap .popup-form-close:after,
#popup-wrap .popup-form-close:before {
content: "";
position: absolute;
width: 5px;
height: 1.5em;
background: #333;
display: block;
transform: rotate(45deg);
left: 50%;
margin: -3px 0 0 -1px;
top: 0;
}
#popup-wrap .popup-form-close:hover:after,
#popup-wrap .popup-form-close:hover:before {
background: #777;
}
#popup-wrap .popup-form-close:before {
transform: rotate(-45deg);
}
/* foulscode.com*/
</style>
<div class='header'>
<div id="popup-wrap">
<!-- Activar Formulario de Suscripción -->
<label class='popup-button' for='popup-trigger'></label>
<!-- Contenido del Formulario -->
<input class='popup-trigger' id='popup-trigger' type='checkbox'/>
<div class='popup-bg'>
<label class='popup-bg-close' for='popup-trigger' id='popup-close'></label>
<div class='popup-form'>
<label class='popup-form-close' for='popup-trigger' id='popup-close'></label>
<div class='popup-inner'>
<!-- Opciones de Suscripción -->
<span class="popup-title"> </span>
<span class="popup-content"><b>Εγγραφείτε στο Ενημερωτικό Δελτίο μας. </b> <br />
Καθημερινή ενημέρωση στο email που επιθυμείτε δωρεάν! <br />
*Θα λαμβάνεται μια φορα στο τέλος της ημέρας τους τίτλους με το περιεχόμενο που έχει προστεθεί.</span>
<form action='https://feedburner.google.com/fb/a/mailverify' id='subscribe' method='post' onsubmit='window.open('https://feedburner.google.com/fb/a/mailverify?uri=Foulscode', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input name='uri' type='hidden' value='SU_ID_DE_SUSCRIPCIÓN'/>
<input name='loc' type='hidden' value='es_ES'/>
<input id='mailbox' name='email' onblur='if (this.value == "") {this.value = "Ingresa tu email...";}' onfocus='if (this.value == "Ingresa tu email...") {this.value = ""}' required='' type='text' value='Πληκτρολόγησε το email...'/>
<input id='subbutton' title='' type='submit' value='Εγγραφή'/>
</form>
<br />
<span class="popup-footer">
<br /><script type="text/javascript">
<!-- foulscode.com -->
<!--
document.write(unescape('%3c%61%20%68%72%65%66%3d%22%68%74%74%70%73%3a%2f%2f%66%6f%75%6c%73%63%6f%64%65%2e%63%6f%6d%2f%22%3e%46%6f%75%6c%73%43%6f%64%65%2e%63%6f%6d%3c%2f%61%3e'));
//-->
</script>
</span>
</div>
</div><!-- .popup-form -->
</div><!-- .popup-bg -->
</div><!-- #popup-wrap -->
<!-- Addthis --> <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-586df3749e7789d5"></script>
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
</div>
Σύντομα περισσότερα για το site/blog σας...
Σχόλια