Il pulsante di condivisione Dib
Come inserire e configurare il pulsante di condivisione di Dibloc!
Il pulsante Dib consente di condividere istantaneamente su Dibloc, qualsiasi pagina web su cui è installato.
Facendo clic sul pulsante Dib viene automaticamente aperta una finestra pop-up per pubblicare il tuo Dib: sarà già completo di titolo, testo ed eventuale foto presente nella pagina da condividere!
Cos'è il pulsante Dib?
Un piccolo widget sviluppato per semplificare la condivisione di contenuti su Dibloc.
Per inserirlo, basta aggiungere una porzione di codice HTML (snippet) in un punto qualsiasi della pagina che si intende condividere, apparirà così il pulsante Dib!
Generatore del pulsante Dib
Inserisci nel campo URL il link alla risorsa che vuoi condividere e clicca su GENERA IL CODICE. Copia poi e incolla lo snippet generato sulla pagina dove vuoi che appaia il pulsante Dib.
Gestione avanzata
Esempio di codice da inserire
Puoi generare lo snippet automaticamente, oppure personalizzarlo seguendo questo esempio completo e settando i singoli parametri.
<a href="https://www.dibloc.com/account/share"
class="dib-btn" data-dib-btype="default">Dib</a>
<script src="https://www.dibloc.com/me/js/dib.js" async></script>Questo è un esempio del codice HTML da copiare ed incollare nel body della pagina web da condividere, ed è costituito da un tag a con classe dib-btn contenente l'attributo href che identifica il link da condividere ed ulteriori attributi data- per i parametri aggiuntivi.
Più il codice JavaScript script che consente il collegamento asincrono del widget alla pagina ed il caricamento del pulsante Dib.
Nell'eventualità che siano presenti nella pagina più pulsanti Dib, è necessario includere il codice JavaScript una volta sola.
Come configurare il pulsante Dib
Il principale parametro da settare è l'URL assoluto (HTTP/HTTPS) della pagina da condividere. Basta semplicemente inserirlo come parametro di query url nell'attributo href del tag a.
<a href="https://www.dibloc.com/account/share?url=http://www.esempio.it"
class="dib-btn" data-dib-btype="default">Dib</a>Altra possibilità è passare attraverso l'attributo data-dib-href l'URL assoluto.
<a href="https://www.dibloc.com/account/share"
class="dib-btn" data-dib-btype="default"
data-dib-href="http://www.esempio.it">Dib</a>Un ulteriore modalità è offerta dall'utilizzo di un elemento <link rel="canonical"> contenente il link canonico della pagina.
<link rel="canonical"
href="http://www.esempio.it" />In ultimo si può lasciare la possibilità di far leggere al widget i meta tag Open Graph presenti nella pagina; verrà controllato il tag con la proprietà og:url ed eventualmente utilizzato.
<meta property="og:url"
content="http://www.esempio.it" />In assenza di un valido link impostato, il widget di Dibloc è in grado di riconoscere l'URL della pagina, ma se ne sconsiglia l'utilizzo per la presenza di eventuali parametri di query non necessari.
Personalizzare il pulsante Dib
Si può utilizzare il formato quadrato del pulsante modificando l'attributo data-dib-btype con il valore round al posto di default.
Pulsante round
Pulsante default
Può essere utilizzata la colorazione scura del pulsante aggiungendo l'attributo data-dib-color con il valore dark al posto di default.
Pulsante round dark
Pulsante default dark
Scopri gli altri strumenti e modalità di condivisione di Dibloc! [+ info]