Inserire PopUp like pagina Facebook su Blogger

Se hai un blog su Blogger e vuoi incrementare i fan della pagina Facebook collegata sei nel posto giusto. Tramite il codice che segue e che potrai facilmente implementare sul tuo blog potrai far crescere la tua Pagina Fan!

La prima cosa da fare è controllare l’URL della pagina Facebook. Ad esempio la nostra si trova all’indirizzo https://www.facebook.com/ComeGuadagnareConUnBlog.

Una volta effettuato l’accesso su Blogger devi andare alla voce Layout e successivamente aggiungere un nuovo gadget nel footer o nella sidebar tramite la voce Aggiungi un Gadget. Dal menu bisogna selezionere HTML/JavaScript ed incollare il seguente codice:

<script src=’http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js’ type=’text/javascript’></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url(https://3.bp.blogspot.com/-NRmqfyLwBHY/T4nwHOrPSzI/AAAAAAAAAdQ/8b9O7O1q3c8/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
</style>

<script type=’text/javascript’>
//<![CDATA[
jQuery.cookie = function (key, value, options) {

// key and at least value given, set cookie…
if (arguments.length > 1 && String(value) !== “[object Object]”) {
options = jQuery.extend({}, options);

if (value === null || value === undefined) {
options.expires = -1;
}

if (typeof options.expires === ‘number’) {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}

value = String(value);

return (document.cookie = [
encodeURIComponent(key), ‘=’,
options.raw ? value : encodeURIComponent(value),
options.expires ? ‘; expires=’ + options.expires.toUTCString() : ”, // use expires attribute, max-age is not supported by IE
options.path ? ‘; path=’ + options.path : ”,
options.domain ? ‘; domain=’ + options.domain : ”,
options.secure ? ‘; secure’ : ”
].join(”));
}

// key and possibly options given, get cookie…
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp(‘(?:^|; )’ + encodeURIComponent(key) + ‘=([^;]*)’).exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type=’text/javascript’>
jQuery(document).ready(function($){
if($.cookie(‘popup_user_login’) != ‘yes’){
$(‘#fanback’).delay(30000).fadeIn(‘medium’);
$(‘#fanclose, #fan-exit’).click(function(){
$(‘#fanback’).stop().fadeOut(‘medium’);
});
}
$.cookie(‘popup_user_login’, ‘yes’, { path: ‘/’, expires: 7 });
});
</script>

<div id=’fanback’>
<div id=’fan-exit’>
</div>
<div id=’fanbox’>
<div id=’fanclose’>
</div>
<div class=’remove-borda’>
</div>
<iframe allowtransparency=’true’ frameborder=’0′ scrolling=’no’ src=’//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/ComeGuadagnareConUnBlog&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false’

style=’border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;’></iframe>
</div>
</div>

Chiaramente dovrai sostituire l’URL della nostra pagina con la tua (si trova verso la fine)

Per settare il ritardo col quale si deve aprire rispetto al caricamento della pagina bisogna modificare la vove delay, di default settato a 30 secondi (1 secondo = 1000).

Puoi settare e personalizzare ogni aspetto di questo codice se hai delle conoscenze di base, in alternativa lascia tutto così e non avrai problemi!

Il titolo dovrà rimanere vuoto, in maniera che l’intero gadget sia del tutto invisibile.

Ti basterà cliccare su Salve per attivare immediatamente il PopUp con all’interno il plugin sociale di Facebbok per aumentare i fan della tua pagina.

Ricorda che il Pop Up può risultare fastidioso, per questo è consigliabile inserirlo a periodi per conciliare l’esigenza di incrementare i followers via Facebbok alla voglia di non disturbare gli utenti del nostro blog ospitato da Blogger.

Se non riesci ad inserire il codice o questo non funziona, se hai dubbi o semplicemente vuo dire la tua non esitare a commentare!

Articoli Correlati:

2 Comments
  1. ciao a me non funziona, inserisco il codice in un gadget ma non appare nessun popup

    Leave a reply

    Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.

    Come Guadagnare con un Blog
    Logo