Filament des “plugins” de sites Web qui fonctionnent partout

Si vous avez déjà travaillé avec un CMS tel que WordPress, vous connaissez probablement le fonctionnement des plugins. Chaque fois que vous avez besoin de fonctionnalités supplémentaires telles que des boutons de partage social, Google Analytics, des abonnements à des newsletters, etc., vous installez simplement un plugin et la fonctionnalité dont vous avez besoin est ajoutée..

Filament fonctionne pratiquement de la même manière, en vous donnant des «applications» qui vous permettent d’ajouter des boutons de partage social, Google Analytics, des abonnements à des lettres d’information et d’autres fonctionnalités supplémentaires sur votre site Web. Mais il y a une grande différence entre Filament et tout processus comparable:

Les applications de filament fonctionnent partout, des sites HTML statiques à ceux propulsés par n'importe quel CMS

Si vous voyez une application Filament que vous aimez, vous êtes libre de l'utiliser, que vous ayez un site statique, un site WordPress, un site Ghost, un site Drupal, tout type de site. Vous incluez un petit extrait de code JavaScript dans la section principale de votre site. Vous pouvez ensuite faire glisser des applications sur votre site via le tableau de bord Filament pour les ajouter en quelques secondes seulement..

Inscrivez-vous et connectez-vous à Filament.io

La première étape consiste à se rendre sur http://filament.io et à faire défiler l'écran jusqu'en bas, où vous verrez un Inscription gratuite bouton.

Vous serez enregistré pour vous inscrire et vous aurez la possibilité de vous connecter avec Google+ ou Facebook ou de créer un nouveau compte. Une fois connecté, il vous sera demandé d'insérer le domaine de votre site:

Remarque: Sachez que vous ne pouvez pas utiliser une adresse avec un sous-dossier à la fin. Vous devez utiliser un sous-domaine ou un domaine de premier niveau.. 

Après avoir cliqué sur le Suivant bouton, vous recevrez un extrait de code JavaScript à copier et coller dans la section principale de votre site ou avant la balise de fermeture du corps:

Remarque: Si vous utilisez WordPress, vous pouvez faciliter cette étape grâce au plugin officiel Filament.

Après avoir ajouté l'extrait de code sur votre site, vous pouvez revenir et cliquer sur le bouton Testez votre connexion bouton. Si vous avez connecté votre site à Filament.io, vous obtiendrez le feu vert et pourrez cliquer sur le bouton Terminé bouton pour continuer.

Lorsque vous testez la connexion, Filament envoie un ping à votre page d'accueil. Par conséquent, si l'extrait de code a été placé sur des pages autre que la page d'accueil, vous pouvez toujours obtenir un feu rouge. Tant que l'extrait est présent sur les pages où vous en avez besoin, vous serez prêt à partir.

En savoir plus sur pourquoi c'est

Ajout d'applications Filament.io

Dans le tableau de bord Filament.io, vous verrez la collection complète d'applications que vous pouvez utiliser actuellement. À l'heure actuelle, vous avez le choix entre six applications et huit autres sur le chemin..

Pour ajouter une application à votre site, cliquez sur son bouton de lancement, puis sur le domaine du site auquel vous souhaitez l'ajouter..

Cela vous mènera à l'interface de glisser-déposer de Filament, qui vous donnera un aperçu en direct de votre site afin que vous puissiez vous assurer que tout se présente comme vous le souhaitez avant de poursuivre..

Clique le + NOUVEAU bouton pour créer une nouvelle instance de l'application que vous ajoutez:

Vous aurez la possibilité de donner un nom à votre instance d'application et d'indiquer vos préférences pour plusieurs paramètres différents, qui contrôlent tout, de la fonctionnalité de l'application à sa couleur, son style et son emplacement:

Lorsque vous avez terminé, cliquez sur ENREGISTRER LES PARAMÈTRES et vous verrez votre nouvelle instance d'application apparaître dans la barre latérale.

Maintenant, faites glisser votre nouvelle instance d'application de la barre latérale vers l'aperçu de votre site et elle sera automatiquement insérée.

Lorsque vous êtes prêt, cliquez sur le bouton PUBLIER bouton dans le coin en haut à droite.

Vous devriez maintenant voir l'application en place sur votre site en direct. Une note sur l'interface indique que les modifications peuvent prendre quelques minutes, mais pour moi, les modifications sont apparues instantanément..

Vous pouvez ajouter autant d'applications différentes que vous le souhaitez. Jetez un coup d’œil à cette simple démonstration pour voir les applications Flare et Ivy en cours d’exécution.

La gamme de filaments actuelle

Comme mentionné ci-dessus, six applications sont actuellement disponibles via Filament..

Éclater

L'application Flare ajoute une barre de partage sociale flottante sur le côté de votre site. Vous pouvez le configurer pour afficher des liens vers neuf services différents, plus une messagerie électronique. Il tiendra également compte du nombre d’actions qu’il a créées pour chaque service, le nombre total de "flares" étant affiché en haut..

Lierre

Ivy est une petite application très soignée qui permet aux visiteurs de mettre en évidence n'importe quelle portion de texte et de l'envoyer à leurs amis via Facebook, Twitter ou par courrier électronique..

Passeport

L'application Passport vous permet d'afficher un petit avatar de vous-même, entouré de flyouts comportant des liens vers les différents sites de réseaux sociaux sur lesquels vous êtes et les méthodes de contact que vous avez peut-être..

CodeDrop

CodeDrop vous permet d'insérer du code HTML ou JavaScript dans votre site, sans modifier le code du site. Vous avez un champ dans lequel vous pouvez coller du code pour des éléments tels que des formulaires Web, des enquêtes, du contenu supplémentaire, etc. Vous pouvez ensuite choisir la position dans laquelle insérer le code, en haut ou en bas de la section de tête, en haut ou en bas de la section de corps ou dans un emplacement personnalisé..

Mailchimp

Pour de nombreuses personnes qui commencent à travailler avec leur propre site Web, l’intégration des formulaires d’inscription au bulletin d’information peut être un processus très décourageant. L'application Mailchimp fournit un moyen de glisser-déposer d'un formulaire de newsletter sans avoir à perdre son code.

Google Analytics

L'intégration du code Google Analytics est un autre domaine qui a posé de gros problèmes pour de nombreuses personnes qui débutent avec leur propre site. L'application Google Analytics de Filament signifie que les utilisateurs n'ont pas à s'inquiéter d'essayer de trouver le bon endroit pour ajouter leur code. Ils peuvent simplement coller dans leur identifiant de suivi, glisser et déposer l'application et ils sont partis.

Applications de filament sur le chemin

Le site Web de Filament contient huit autres applications en cours de développement..

  • Oeuf fou - Voir le comportement de vos visiteurs avec des cartes de chaleur
  • FlipJack - Mettez plus d'action dans votre appel à l'action
  • Highlite - Une meilleure façon de commenter le contenu Web
  • Side-car - Emportez du contenu associé pour le trajet
  • App SlideDeck - Des curseurs de contenu impressionnants, aucun code requis
  • Mixpanel - Suivez le comportement des utilisateurs et observez les tendances du site Web
  • Olark - Discussion en direct avec des visiteurs de votre site
  • Optimizely - Test A / B et optimisation de votre site sans codage

Si l'une de ces applications semble être quelque chose que vous aimeriez utiliser, vous pouvez vous rendre sur le site Web de Filament et voter en faveur de celui-ci pour aider l'équipe à savoir où elles pourraient préférer leur temps de développement..

Pour qui est le filament?

Qui peut tirer le meilleur parti de l'utilisation de Filament? Cela dépend de l’application que vous regardez, du type de site sur lequel vous comptez utiliser l’application et de l'identité des utilisateurs..

Des applications comme CodeDrop, Mailchimp et Google Analytics seraient fantastiques pour les personnes qui ne sont pas à l'aise avec l'édition directe de code. Pour les concepteurs Web, il s’agit là d’un moyen fantastique d’offrir aux clients la possibilité de s’acquitter de tâches courantes sur lesquelles ils pourraient être coincés.

Je sais que, à mon époque, je travaillais avec plusieurs personnes avec qui je voudrais travailler avec de telles fonctionnalités. L'intégration de l'extrait de filament pourrait s'effectuer dans le cadre d'un projet de création de site. À partir de ce moment, les clients seraient en mesure de prendre en charge des tâches pour lesquelles ils préféreraient ne pas avoir à vous contacter..

Quant aux applications comme Flare, Ivy et Passport, elles sont potentiellement intéressantes pour quiconque, étant donné qu’elles sont uniques et qu’elles fournissent leur propre style et leur propre méthode d’interaction sociale..

Toutes les applications actuelles, ainsi que celles à venir, peuvent également être utiles pour les sites s'exécutant sur des plates-formes qui ne se prêtent pas bien à la personnalisation, ou aux services qui empêchent délibérément d'empêcher une édition en profondeur du code. Avec la petite exigence de pouvoir inclure un extrait de code JavaScript, cela ouvre beaucoup de possibilités qui pourraient autrement ne pas être disponibles.

En savoir plus et essayer le filament

Pour en savoir plus sur Filament, votez sur les applications que vous souhaitez voir le plus tôt et essayez le service, rendez-vous sur http://filament.io