Share
Le processus de création de thèmes pour Ghost est incroyablement fluide, simple et très facile à apprendre. Mais avant de commencer à créer un thème Ghost réel, il est important et utile de comprendre le rôle que jouent les thèmes dans l'écologie globale de Ghost afin de pouvoir concevoir de manière optimale..
La meilleure façon de le faire est de ne pas se lancer dans la conception ou le code, mais bien d’acquérir une connaissance approfondie de Ghost en tant que fondement..
Dans cette première partie de notre série de didacticiels, vous acquérez cette base et, une fois que vous le faites, vous serez parfaitement placé pour commencer à créer votre premier thème..
Ghost est une application Open Source dédiée à la publication de contenu..
Au cours des dernières années, les outils de publication de contenu ont évolué pour permettre aux utilisateurs de gérer eux-mêmes à peu près tout type de site dont ils pourraient avoir besoin. Qu'il s'agisse d'un magasin en ligne complexe, d'une présentation professionnelle ou d'un CMS à part entière, les utilisateurs peuvent gérer eux-mêmes tout avec relativement peu d'expérience..
Mais Ghost ne concerne aucune de ces choses complexes. Ghost consiste à remettre l'accent sur une chose simple: l'écriture.
C'est une plate-forme construite sur le principe de la simplicité. Son objectif principal est d’aider les rédacteurs à bloguer davantage et à se concentrer moins sur l’outil de publication de contenu de l’équation de blogage..
Pour les développeurs de thèmes, cela introduit un changement de rythme. Bien que la thématisation pour d'autres plates-formes soit souvent motivée par la demande des utilisateurs d'ajouter des thèmes à toute complexité fonctionnelle sur leur site Web, la plate-forme Ghost repose sur une seule chose. Le slogan de Ghost nous dit ce que c'est:
Juste une plateforme de blogs
Depuis que Ghost se concentre à 100% sur les blogs, Ghost est: Juste pour les blogueurs.
Et dans la même veine, la conception du thème Ghost est également dictée par une chose: Juste des thèmes de blogs.
Celles-ci peuvent sembler évidentes, mais il est important de les souligner, car sur une plate-forme centrée sur l'écriture et utilisée par des personnes concentrées sur l'écriture, les thèmes Ghost doivent également être conçus de manière à être centrés sur l'écriture..
Dans le cadre de sa campagne sur Kickstarter, le fondateur de Ghost, John O'Nolan, a déclaré ce qui suit:
… Il ne s'agit pas seulement de créer quelque chose de beau, mais également de donner aux écrivains des outils pour pousser le blogging et le journalisme à un niveau supérieur.
C'est là que réside la philosophie que les concepteurs de thèmes Ghost doivent adopter pour mieux servir les utilisateurs de Ghost: Veiller avant tout à ce que le contenu d'un utilisateur soit toujours à l'avant-plan.
C'est une approche courante dans la conception Web de se concentrer sur les graphiques et l'apparence générale de la conception, le style de la typographie et le contenu se déroulant en dernier lieu. Mais dans un thème Ghost, le contenu ne doit jamais céder le pas à d’autres aspects de la conception..
En tant que concepteur de thème Ghost, votre toute première considération doit être de savoir comment le contenu apparaîtra, avec un accent particulier mis sur la typographie, et le reste de la conception du thème devrait se dérouler à l'appui..
Vous comprendrez mieux comment cela fonctionne plus tard dans la série de tutoriels lorsque nous commençons à créer un thème réel, mais avant de pouvoir le faire, nous devons en savoir plus sur la plate-forme Ghost elle-même..
Il faut connaître quelques aspects fondamentaux de Ghost qui le rendent différent des autres plates-formes auxquelles vous pouvez être habitué..
Contrairement à la plupart des applications de création de sites Web actuellement populaires basées sur PHP, Ghost est construit sur Node.js.
Node.js est une plate-forme logicielle qui interprète et exécute le code JavaScript dans le back-end. Vous pouvez en apprendre plus à ce sujet sur Nodejs.org mais vous n’avez vraiment pas à le faire. Une connaissance approfondie de Node.js n'est pas nécessaire pour créer un thème Ghost - tout ce que vous devez savoir sera traité dans cette série de didacticiels..
Beaucoup de gens considèrent Node.js comme la voie de l'avenir pour un certain nombre de raisons. la vitesse étant l'un d'entre eux. Il a été démontré que Node.js avait des performances bien plus rapides que PHP dans de nombreux tests d’analyse comparative. C’est un élément clé de la rapidité à laquelle Ghost s'exécute..
Pour travailler sur un thème Ghost dans un environnement local, vous devez installer Node.js localement. Heureusement, cela est un processus très simple et rapide. Nous vous indiquerons comment procéder avant de commencer à créer un thème dans la deuxième partie de cette série de didacticiels..
Remarque: Vous devez savoir qu'à court terme, vous risquez de rencontrer des difficultés grandissantes lors du déploiement de vos sites Ghost. À l'heure actuelle, presque tous les hôtes du monde sont configurés pour prendre en charge les applications PHP. Toutefois, étant donné que Node.js est encore relativement récent, la configuration par "bouton-poussoir" sur les domaines actifs auxquels vous êtes peut-être habitué n'est pas encore prête. Un certain nombre d'hôtes construisent déjà une nouvelle infrastructure spécialement pour faciliter Ghost. Il ne faudra donc que peu de temps avant que le déploiement de Ghost soit aussi simple que toute autre application, sinon plus facile. De plus, à partir de novembre, vous pourrez utiliser le service d'hébergement interne de Ghost..
Un autre aspect de Ghost qui peut différer de celui d’autres plates-formes pour lesquelles vous avez déjà travaillé est lié aux paramètres que les utilisateurs peuvent contrôler en arrière-plan..
Les paramètres définis par l'utilisateur de Ghost déterminent un pourcentage élevé de ce qui peut être imprimé sur le front-end, ce qui influence le type de contenu disponible pour la thématisation..
Il y a encore beaucoup de nouvelles choses prévues pour Ghost, mais l'approche que nous allons adopter dans cette série de tutoriels consiste à utiliser les paramètres utilisables maintenant..
Certains paramètres pour les futures fonctionnalités de Ghost existent actuellement. Par exemple, il existe une interface utilisateur administrateur pour la création de menus de navigation, ainsi que des fonctionnalités préliminaires pour leur sortie dans le noyau de Ghost. Cependant, nous ne savons pas exactement comment ces éléments vont fonctionner (et ne le feront pas avant leur publication), nous ne ferons donc aucune conception pour eux dans cette série de didacticiels. Nous allons laisser cela pour le jour où l'équipe de Ghost les libère réellement.
Cela nous amène à ce que les utilisateurs peuvent contrôler à l’arrière de Ghost en ce moment, à savoir des paramètres qui se décomposent en deux zones;
Regardons maintenant chacun de ces domaines.
Les paramètres d'administration de Ghost sont divisés en deux onglets: Paramètres généraux et Paramètres utilisateur. Les onglets des paramètres généraux et utilisateur contrôlent le contenu que nous pouvons styler dans nos thèmes..
le Paramètres> Général Onglet nous donne les éléments suivants, utilisables n'importe où dans un thème Ghost:
le Paramètres> Utilisateur L'onglet nous donne les éléments suivants, utilisables dans la vue poste unique uniquement:
L’interface de post-édition de Ghost est certainement l’une de ses caractéristiques les plus convaincantes. Conçu par des écrivains pour des écrivains, il offre un environnement fantastique pour la création de contenu..
Son contraste majeur avec les autres environnements de montage réside dans sa propreté et son caractère minimaliste. Il n'y a pas de fouillis avec les barres d'outils de formatage, les boîtes méta ou d'autres champs personnalisés. La grande majorité de l'écran est entièrement consacrée à la zone d'écriture.
L'aspect le plus pertinent de la zone d'édition de publication pour les concepteurs de thème est la colonne vertébrale du formatage de publication Ghost: Markdown.
Plutôt que d'utiliser des boutons de style ou du code HTML brut, le contenu de Ghost est formaté à l'aide de Markdown, une syntaxe simple en ligne qui évite aux rédacteurs de faire une pause lors de la création du contenu. En raison de cette approche simplifiée, il existe une liste relativement courte d'éléments à styliser que l'éditeur de publications contrôle:
Remarque: Markdown acceptera également le code HTML brut, ce qui signifie que les vidéos de services tels que YouTube peuvent facilement être incorporées via du code iframe copié-collé. Pour cette raison, il est également judicieux de prendre en compte le style des iframes dans vos thèmes..
Ghost est conçu autour d'une séparation claire de la présentation et du contenu.
Ghost lui-même gère toute la génération de contenu et toute fonctionnalité supplémentaire requise est gérée par des plugins. Cela laisse le thème Ghost dédié à la présentation pure.
La séparation du contenu et de la présentation est un principe de la conception Web qui n’est pas nouveau. L'idée de base est que si le contenu et la présentation sont séparés en entités indépendantes, il devient possible de modifier l'une sans modifier l'autre. En d'autres termes, un thème peut être remplacé par un autre sans que l'utilisateur ait à modifier son contenu de quelque manière que ce soit..
Lorsque les thèmes contiennent des fonctionnalités qui ne sont pas uniquement de présentation, un utilisateur ne peut plus modifier leur thème sans modifier également l'apparence de leur contenu. Ils deviennent liés à la présentation qu’ils ont et le but fondamental d’un thème est essentiellement perdu..
Avec Ghost, cependant, le but fondamental d’un thème reste intact à tout moment..
Remarque: À l'avenir, lors du déploiement des plugins pour Ghost, il sera possible de créer des thèmes Ghost avec des dépendances de plugins. Ceci est une autre fonctionnalité qui sera rendue possible grâce à Ghost construit sur Node.js. Nous serons toujours en mesure de voir les packages globaux améliorés disponibles pour les utilisateurs, mais cette méthode préservera systématiquement les avantages découlant de la séparation du contenu et de la présentation..
Les deux étapes très clairement définies que vous allez suivre pour créer un thème Ghost sont les suivantes:
Les sections suivantes de cette série de didacticiels vous fourniront des instructions détaillées étape par étape sur la procédure à suivre pour passer à ces étapes afin de créer votre premier thème Ghost. Mais avant cela, il est utile d’en comprendre un peu plus sur le langage de gabarit qui régit les thèmes Ghost..
Les thèmes Ghost utilisent un langage de template fantastique appelé Handlebars.js pour permettre le placement du contenu. Handlebars est un langage de gabarit au sens propre du terme, son rôle étant simplement de produire du contenu pré-récupéré à des emplacements spécifiques dans un fichier de modèle..
Le guidon est caractérisé par l’utilisation de crochets (qui ressemblent au guidon) pour ajouter des balises prédéfinies dans les modèles qui seront remplacés par le contenu lorsque le fichier sera servi..
Exemple de balise de modèle handlebars.js: contenu
Handlbars.js est appelé un sans logique gabarit de langage car il ne peut pas être utilisé pour écrire des fonctions, conserver des variables ou pour préparer le contenu en vue de son affichage. Outre le rendu du contenu dans lequel les balises sont placées, ses seules opérations consistent simplement à:
C'est la fonctionnalité sans logique derrière chaque thème Ghost qui garantit que chaque thème contrôle uniquement les attributs de présentation.
Les thèmes Ghost ne font pas non plus pour déterminer le contenu par lequel les balises de modèle de guidon seront remplacées - tout cela est géré par Ghost lui-même. Le thème est toutefois utilisé pour déterminer comment la sortie sera marqué et stylisé.
Grâce à des modèles sans logique, au marquage et au style, la sortie de Ghost est facilement réalisée et permet de garantir un code très propre dans vos modèles. À son tour, cela facilite l'écriture d'un balisage sémantique mis à jour avec les dernières normes de référencement et d'accessibilité..
Voici une liste rapide de tout ce qui existe et n’est pas incluse dans les deux étapes de la conception d’un thème Ghost..
Quoi est dans un thème Ghost: Templating
Coiffant
Cependant, les suivants n'est pas inclus dans un thème Ghost:
Vous trouverez peut-être utile de penser que le processus de conception en deux étapes est résumé par le "Samwys" principe, ou "Style et balise ce qui vous est servi".
Lors de la conception d'un thème Ghost, nous n'avons pas à travailler avec des requêtes de logique ou de base de données, car Ghost gère tout cela pour nous. SAMWYS nous rappelle que tout ce que nous avons à faire est de placer des balises de modèle, d’écrire un balisage de qualité et de créer un superbe style de thème mettant en valeur le contenu de l’utilisateur..
Tout ce dont nous avons discuté jusqu’à présent vous donne une compréhension fondamentale de Ghost..
À partir de là, nous pouvons passer au processus pas à pas de la création de votre premier thème..
La prochaine partie de notre série de tutoriels commence par la première étape du processus de création de thème; la phase de gabarit. Vous apprendrez exactement comment configurer la structure de fichier de votre thème, comment placer des balises de modèle et comment écrire un squelette de marquage..
Accentsconagua