Non toccare mai più il codice Filament.io, per i non sviluppatori ovunque

Se hai mai provato a incollare manualmente uno snippet di codice come il codice di monitoraggio di Google Analytics sul tuo sito web scavando nei file modello PHP, saprai quanto scoraggiante può essere. Filament.io lo rende semplice come trascinare e rilasciare. Almeno, questa è la promessa.

Iniziare

Andate su filament.io e premete il pulsante di registrazione. Dovrai creare un accesso, ma gli account Facebook e Google possono essere utilizzati per un accesso rapido con un solo pulsante. Successivamente dovrai inserire il dominio su cui lo utilizzerai - puoi aggiungerne altri più tardi.

Se stai usando WordPress, questo verrà rilevato quando analizzerà il sito, e ti suggeriamo di installare il plugin in dotazione in quanto ti consente un controllo più preciso su quale tipo di pagine ha la funzionalità del filamento contenuta (come solo post e non static pagine).

Nel prossimo passaggio, la schermata di registrazione di Filament ti fornirà un breve snippet di codice JavaScript: incollalo nella pagina delle impostazioni del plug-in. Potrebbe essere l'ultimo bit del codice JavaScript di cui avrai mai bisogno! Puoi utilizzare Filament senza il plug-in, ma non avrai tante opzioni per filtrare gli script in cui vengono visualizzati.

Aggiunta di app

Lo strumento Filamento fornisce un'anteprima in tempo reale del tuo sito in modo da poter progettare visivamente dove vuoi che le app vadano. Inizia aggiungendo un bel set di pulsanti social chiamato Flare. Nell'anteprima del sito, vai a un post.

Dalla barra laterale, colpisci Nuovo per aprire le opzioni Flare. Flare è un delizioso set personalizzato di pulsanti di condivisione che sembra molto più bello dei pulsanti forniti dalla rete standard che probabilmente vedi sul lato di questo articolo. È incluso un logo con marchio che può essere rimosso acquistando una licenza premium per il plug-in.

Salva le impostazioni, quindi trascina e rilascia il nuovo modulo Flare sul tuo sito. Apparirà quindi un primo set di opzioni di filtro. Vai avanti e aggiungilo a Tutti i miei messaggi.

Avrai quindi un altro set di filtri da personalizzare; questi sono abilitati dal plugin WordPress. Come sviluppatore sono abituato agli script circostanti in varie clausole PHP if (non sono sicuro di cosa si tratta? Leggi la nostra Guida per principianti di PHP), ma posso davvero apprezzare la potenza di questi filtri per coloro che non conoscono il rilevamento del tipo di pagina di WordPress.

A livello tecnico, il plugin WordPress aggiunge una serie di meta tag all'output della pagina che dice a Filament che tipo di pagina è; l'inizializzatore di Filament Javascript quindi lo rileva e inietta gli script che si desidera su quella particolare pagina in base ai filtri stabiliti. Non manipola gli script in alcun altro modo - li inietta semplicemente sulla pagina.

Dovrai fare clic Pubblicare prima che le modifiche vengano inviate al tuo sito e potrebbero essere necessari alcuni minuti per apparire, quindi non farti prendere dal panico se non è immediatamente visibile.

Clicca sul Cruscotto link per aggiungere altre app, oppure puoi creare unità Flare aggiuntive (se, ad esempio, desideri un design specifico o più pulsanti sulla home page).

Al momento della scrittura, ci sono 6 app in totale disponibili:

• bagliore, un plug-in di social bookmarking.
• Edera, che consente agli utenti di condividere facilmente le citazioni che evidenziano dai tuoi articoli.
• Passaporto, un modo interessante per evidenziare tutto il tuo profilo sociale personale (sì, mi rendo conto che questo suona un po 'social-centrico al momento)
• MailChimp è un abbonamento per l'eccellente servizio di mailing list (che tra l'altro è gratuito per un massimo di 12.000 email al mese e 2.000 abbonati)
• statistiche di Google dovrebbe essere familiare a chiunque abbia un sito web; Ryan ha creato questa fantastica guida per principianti per comprendere i tuoi dati di analisi.
• Finalmente, CodeDrop ti consente di gestire qualsiasi altro frammento di codice che ti è stato fornito altrove.

Dalla dashboard, fare clic Lanciare. Notare il menu a discesa per selezionare i siti: è possibile gestire più siti Web da un singolo account.

Va bene??

Lo strumento di layout visivo è sorprendentemente efficace, evitando il fastidio di cercare di determinare esattamente il posizionamento corretto manualmente. Se non sei sicuro di modificare i file del tema, è un salvataggi. Ma può funzionare solo entro i confini del tuo tema esistente. Si aggancia automaticamente agli elementi che trova nella pagina, ma non può ad esempio creare una nuova colonna per un widget se il tema ha solo una colonna.

A volte anche le cose vanno male, perché inevitabilmente la tua pagina avrà anche elementi dinamici come i cursori; o il tuo tema CSS potrebbe interferire con il widget. Potrebbe essere necessario giocare - ma per la maggior parte, funziona bene.

Anche come sviluppatore web, apprezzo la facilità d'uso e la gestione centralizzata degli script. I miei file footer sono in genere pieni di codice per l'output degli script solo su una determinata pagina - questo rende ridicolo facile, ripulire i file dei temi.

La selezione di app è al momento piuttosto limitata, anche se ovviamente puoi sempre aggiungere le tue semplici aggiunte al codice attraverso il modulo CodeDrop - e ci sono altre app promesse. Mi trovo a desiderare che questa funzionalità sia stata inclusa di default con WordPress - per tutti i progressi nella personalizzazione del tema, ci rimane ancora l'uso dell'architettura arcana del modello PHP per aggiungere snippet di JavaScript. Per ora, Filament.io riempie un buco di funzionalità tanto necessario che molti di noi non sapevano nemmeno esistessero. Hai provato? Diteci i vostri pensieri.

Scopri di più su: JavaScript, Wordpress.