Umberto

Tecnico applicazioni web

I Like mi piace dinamico

I LIKE I-Like Mi Piace: con url dinamica  nel nostro sito.

Ormai tutti abbiamo il Mi Piace I Like di Facebook nel nostro sito/blog. Il simpatico bottoncino ci aiuta nel farci conoscere e apprezzare attraverso il famoso social network.

Ma, se abbiamo un sito dinamico che genera le pagine, url, in automatico ogni volta che pubblichiamo un nuovo articolo o una nuova pagina, come possiamo fare affinché nel codice che ci fornisce Facebook, possa essere riportata, dinamicamente, l’url relativa a quella pagina  (senza intervento manuale)? considerando che da  luglio 2013, il tasto I Like – Mi Piace richiederà un url assoluto nel parametro < href >.

Beh, chi usa i CMS, gratuiti, e già pronti, non ha di questi problemi, deve solamente cercare un plug-in, adattarlo con poche righe di codice, e caricarlo nel sito  (questi plug-in per inserire dinamicamente, nel Mi Piace di Facebook, l’url della pagina, ci sono gratuiti o a pagamento a secondo delle esigenze richieste).

Molti programmatori/sviluppatori web, sono soliti creare i siti (CMS e/o BLOG o altro) scrivendo il codice di propria mano. In questo caso dobbiamo creare noi il codice per inserire dinamicamente la nostra URL.

In questo tutorial vi spiegherò come fare a risolvere il problema con poche e semplici righe di codice in Php.

Per prima cosa dovete andare nella pagina di Facebook dove potrete ottenere il codice del Mi Piace.  clicca qui per aprire la pagina codice – Facebook. << link >>

Vi apparirà questa pagina nella quale attraverso un configuratore potrete ottenere il codice direttamente da Facebook.

configuratore-mi-piace

Una breve spiegazione delle varie opzioni:

URL per mettere mi piace: nel nostro caso specifico vi consiglio di inserire un url a piacere per avere un riferimento quando andremo ad inserire il codice Php.

Layout: è il tipo di layout che verrà visualizzato, può essere standard, button_count e box_count. Clicca su ognuno di essi per vedere come cambia nell’anteprima.

Mostra i volti degli amici: mostra sotto il pulsante le immagini del profilo degli amici che hanno già cliccato su mi piace, dell’utente che sta visualizzando la pagina.

Dimensione pulsante: è la larghezza del contenitore del pulsante in pixel.

Tipo di azione: può essere Mi piace oppure Raccomanda.

Scorrendo nella pagina trovate una spiegazione dettagliata di queste e di tutte le varie opzioni, qui vi mostro alcuni screenshot:

impostazioni-opzioni

impostazioni-opzioni

impostazioni-layout

 

Bene vediamo uno screenshot del codice, dal sito ufficiale, pronto per essere inserito nel nostro sito.

codice

Questo è il codice da inserire dove vogliamo far apparire I LIKE – MI PIACE. L’esempio ha dei parametri indicativi, voi potete usare quelli che ritenete più adatti al vostro sito.

Adesso, basta scrivere poche righe in Php ed il gioco è fatto!!! Ecco lo snippet di codice da usare:

<div class="fb-like" data-href="<?php $url = "https://".$_SERVER['HTTP_HOST'].$_SERVER['SCRIPT_NAME']; if(!empty($_SERVER["QUERY_STRING"])) $url .-"?".$_SERVER["QUERY_STRING"]; echo $url; ?>"
     data-layout="standard" 
     data-action="like" 
     data-size="small" 
     data-show-faces="true" 
     data-share="true">
</div>

 

Con queste poche righe di codice diciamo con Php che:

$url è uguale a $_SERVER  che è un array che contiene informazioni quali intestazioni, percorsi e luoghi di script. Le voci di questo array vengono creati dal server web. 

‘ SCRIPT_NAME ‘ Contiene il percorso dello script corrente. Ciò è utile per le pagine che devono puntare a se stessi. Il __FILE__ costante contiene il percorso completo e il nome del file corrente (cioè compreso).

Dunque: abbiamo che if = se, abbiamo che !empty = se non è vuoto (se esiste la variabile racchiusa tra parentesi) e $url è uguale alla query richiamata dal link della pagina richiesta al database o al server allora stampa $url . 

Semplice e funzionale.

Una volta che avrete pubblicato le pagine andate a controllare il codice sorgente della pagina così vedrete che, al posto dello snippet di codice in Php, troverete l’url della pagina in questione.

Esempio:

<<quellochetipare.com/nome-file.php?id=2>>

così ogni singola pagina avrà il suo url assoluto in conformità con quelle che saranno le specifiche di Facebook e generato dinamicamente.

Ovviamente questo script, come sopra riportato, inserisce l’url nel suo aspetto naturale, con la quale si richiama la QUERY STRING.

Usando l’URL rewrite (cioè riscrivere la nostra url in modo più “amichevole – umano”: ne parleremo in un prossimo articolo in modo più approfondito) vogliamo che anche lo snippet di Facebook inserisca la nuova url.

Vogliamo questo:

<<quellochetipare.com/nome-file.php>>

Perciò cambiamo il codice php e lo snippet di Facebook per generare dinamicamente l’url riscritta.

Nuovo Codice:

<?php $share_url = 'https://' . $_SERVER['SERVER_NAME'].htmlspecialchars($_SERVER['REQUEST_URI']); ?>
<div class="fb-like" data-href="<?php print $share_url ?>" 
                     data-layout="button_count" 
                     data-show-faces="false" 
                     data-action="like" 
                     data-send="true" 
                     data-share="true">
</div>

 

Spiegazione.

Cosa fa il nuovo codice:

  • definiamo la variabile share_url e ricaviamo l’url e il nome della pagina riscritta in modo più amichevole con l’URL Rewrite di Apache.

Adesso avremo lo snippet di Facebook che richiama la nostra pagina web con l’Url riscritta…

Alla prossima

UmMaWebdesign