Filamento sito Web Plugin che funzionano ovunque

Se hai mai lavorato con un CMS come WordPress, è probabile che tu abbia familiarità con il funzionamento dei plugin. Ogni volta che hai bisogno di funzionalità extra come pulsanti di condivisione social, Google Analytics, iscrizioni alle newsletter e così via, devi solo installare un plug-in e aggiungere la funzionalità richiesta.

Filament funziona allo stesso modo, offrendoti "app" che ti consentono di aggiungere pulsanti di condivisione social, Google Analytics, iscrizioni alle newsletter e altre funzionalità extra al tuo sito web. Ma c'è una grande differenza tra Filament e qualsiasi processo comparabile:

Le app di filamento funzionano ovunque, da siti HTML statici a quelli alimentati da qualsiasi CMS

Se vedi un'app Filament che ti piace, sei libero di utilizzarla sia che tu abbia un sito statico, un sito WordPress, un sito Ghost, un sito Drupal, qualsiasi tipo di sito. Includete un piccolo frammento di JavaScript nella sezione principale del vostro sito, quindi potete trascinare le app nel vostro sito attraverso il dashboard Filament per aggiungerle in pochi secondi.

Registrati e Connetti a Filament.io

Il primo passo è andare su http://filament.io e scorrere fino in fondo dove vedrai a Iscriviti gratis pulsante.

Ti verrà mostrato per registrarti dove avrai la possibilità di accedere con Google+ o Facebook o per creare un nuovo account. Una volta effettuato l'accesso, ti verrà chiesto di inserire il dominio del tuo sito:

Nota: Tieni presente che non è possibile utilizzare un indirizzo con una sottocartella alla fine. Devi utilizzare un sottodominio o un dominio di primo livello. 

Dopo aver cliccato su Il prossimo ti verrà fornito uno snippet di JavaScript da copiare e incollare nella sezione head del tuo sito o prima del tag body di chiusura:

Nota: Se stai usando WordPress puoi semplificare questo passaggio attraverso il plugin ufficiale di Filament.

Dopo aver aggiunto lo snippet al tuo sito puoi tornare indietro e fare clic su Metti alla prova la tua connessione pulsante. Se hai collegato correttamente il tuo sito a Filament.io riceverai una luce verde e sarai in grado di colpire il Fatto pulsante per procedere.

Quando esegui il test della connessione, Filament esegue il ping della tua home page, quindi se lo snippet è stato inserito nelle pagine altro della pagina iniziale è ancora possibile ricevere un semaforo rosso. Finché lo snippet è presente nelle pagine in cui è necessario, sarai pronto per partire.

Leggi di più sul perché questo è

Aggiunta di app Filament.io

Da Dashboard Filament.io vedrai la raccolta completa di app che puoi utilizzare al momento. Al momento ci sono sei app tra cui scegliere, con altre otto in arrivo.

Per aggiungere un'app al tuo sito fai clic sul pulsante di avvio, quindi fai clic sul dominio del sito a cui desideri aggiungerlo.

Questo ti porterà all'interfaccia drag and drop di Filament, che ti dà un'anteprima dal vivo del tuo sito in modo da assicurarti che tutto appaia come vuoi prima di andare avanti.

Clicca il + NUOVO per creare una nuova istanza dell'app che stai aggiungendo:

Avrai l'opportunità di dare un nome alla tua istanza dell'app e inserire le tue preferenze per diverse impostazioni che controllano tutto, dalla funzionalità dell'app al colore, stile e posizione:

Quando hai finito, fai clic SALVA LE IMPOSTAZIONI e vedrai la tua nuova istanza di app apparire nella barra laterale.

Ora trascina la nuova istanza di app dalla barra laterale sull'anteprima del tuo sito e verrà automaticamente inserita.

Quando sei pronto, fai clic su PUBBLICARE pulsante nell'angolo in alto a destra.

Ora dovresti vedere l'app sul tuo sito live. Una nota sull'interfaccia dice che potrebbero essere necessari alcuni minuti prima che appaiano le modifiche, ma per me le modifiche sono apparse all'istante.

Puoi aggiungere tutte le app che vuoi. Dai un'occhiata a questa semplice demo per vedere le app Flare ed Ivy in esecuzione.

La formazione corrente del filamento

Come accennato in precedenza, al momento sono disponibili sei app tramite Filament.

bagliore

L'app Flare aggiunge una barra di condivisione sociale mobile sul lato del tuo sito. Puoi configurarlo per mostrare i collegamenti a nove diversi servizi, oltre a e-mail. Inoltre, terrà traccia del numero di azioni che sono state fatte attraverso di esso per ciascun servizio, con un numero totale di "razzi" visualizzati in alto.

Edera

Ivy è una piccola e graziosa app che consente ai visitatori di evidenziare qualsiasi porzione di testo e di inviarlo ai propri amici tramite Facebook, Twitter o Email.

Passaporto

L'app Passport ti consente di visualizzare un piccolo avatar di te stesso, circondato da volantini che portano collegamenti ai vari siti di social network su cui ti trovi e ai metodi di contatto che potresti avere.

CodeDrop

CodeDrop ti dà un modo per inserire HTML o JavaScript nel tuo sito, senza realmente modificare il codice del sito. Ti viene assegnato un campo in cui puoi incollare il codice per cose come moduli web, sondaggi, contenuti extra e così via. Puoi quindi scegliere in quale posizione inserire il codice, nella parte superiore o inferiore della sezione della testa, nella parte superiore o inferiore della sezione del corpo o in una posizione personalizzata.

Mailchimp

Per molte persone nuove a lavorare con il proprio sito Web, l'integrazione di moduli di iscrizione alla newsletter può essere un processo molto scoraggiante. L'app Mailchimp fornisce un modo per trascinare e rilasciare un modulo di newsletter senza dover scherzare con il codice.

statistiche di Google

L'integrazione del codice di Google Analytics è un'altra area che è stata un grosso problema per molte persone che iniziano con i propri siti. L'app Google Analytics di Filament indica che le persone non devono preoccuparsi di cercare il punto giusto per aggiungere il proprio codice. Possono semplicemente incollare il loro ID di tracciamento, trascinare e rilasciare l'app e sono lontani.

App Filament sulla strada

Ci sono altre otto app elencate sul sito Web di Filament in fase di sviluppo.

  • Crazy Egg - Guarda il comportamento dei tuoi visitatori con le mappe di calore
  • FlipJack - Metti più azione nel tuo invito all'azione
  • Highlite - Un modo migliore per commentare i contenuti Web
  • Sidecar - Prendi i contenuti correlati per la corsa
  • App SlideDeck - Cursori di contenuti fantastici, nessun codice richiesto
  • Mixpanel - Monitora il comportamento degli utenti e osserva le tendenze del sito web
  • Olark - Live chat con i visitatori all'interno del tuo sito
  • Optimizely - Test A / B e ottimizza il tuo sito senza codifica

Se alcune di queste app saltano fuori come qualcosa che ti piacerebbe usare, puoi andare al sito web di Filament e votare per far sapere al team dove preferirebbe il loro tempo di sviluppo.

Chi è Filament For?

Chi può beneficiare maggiormente dell'uso di Filament? Dipende da quale delle app guardi, dal tipo di sito su cui intendi utilizzare l'app e da chi saranno gli utenti.

App come CodeDrop, Mailchimp e Google Analytics sarebbero fantastici per le persone che non si sentono a proprio agio nel modificare direttamente il codice. Per i web designer questo è potenzialmente un modo fantastico per offrire ai clienti la possibilità di occuparsi delle attività comuni su cui altrimenti potrebbero rimanere bloccati.

So che nel mio tempo libero sono state diverse le persone con cui ho lavorato e che avrebbero voluto mettere le mani su funzionalità come questa. L'integrazione dello snippet di Filament potrebbe essere eseguita come parte di un progetto di creazione di un sito e da quel momento i clienti sarebbero in grado di assumere il controllo di cose a cui preferirebbero non dover tornare.

Per quanto riguarda app come Flare, Ivy e Passport, quelle sono potenzialmente per chiunque sia dato che sono piuttosto uniche e forniscono il proprio stile e il proprio metodo di interazione sociale.

Tutte le app attuali, così come quelle che verranno in futuro, possono essere utili anche per i siti che eseguono piattaforme che non si prestano bene alla personalizzazione o per servizi che impediscono deliberatamente la modifica estesa del codice. Con il piccolo requisito di poter includere uno snippet JavaScript, questo apre molte possibilità che altrimenti potrebbero non essere disponibili.

Scopri di più e prova Filament

Per ulteriori informazioni su Filament, vota le app che vorresti vedere al più presto e prova il servizio direttamente a http://filament.io