Dans un précédent tutoriel, on vous présentait le plugin Yellow Pencil. Aujourd’hui, nous allons aller en profondeur et vous montrer comment comprendre l’interface de Yellow Pencil.

Presentation de l’interface de Yellow Pencil

L’interface Yellow Pencil est très claire, intuitif et facile à utiliser. La barre sur le côté gauche de la page affiche les outils disponibles.

Le panneau qui plane sur le côté droit de la page est le panel d’édition de Yellow Pencil. Si aucun élément de la page n’est sélectionnée, elle affiche les trois types de personnalisation qu’il est possible d’effectuer.

Lorsque vous cliquez sur un élément de la page, le panel d’édition s’adaptera pour contenir des propriétés de style.

Une boîte bleue apparaît autour d’un élément sélectionné, montrant des options de personnalisation supplémentaires.

Outils importants dont vous aurez besoin

La barre d’outils, sur la gauche, côté affiche de nombreux outils, mais quelques-uns sont immédiatement importants pour vous aider à démarrer.

• Inspecteur Element – Cela vous permet de sélectionner un élément sur la page à personnaliser.
• Annuler et Rétablir – Essayez d’autres designs sur votre page en sachant que vous pouvez annuler ou rétablir vos modifications.
• Fullscreen – Travailler en plein écran, vous donnant une vue claire des personnalisations que vous faites.

Le panel d’édition contient des options que vous utiliserez souvent.

• Live Preview – Aperçu de vos modifications sans de l’interface de Yellow Pencil sur l’écran.
• Réinitialiser les modifications – Vous n’aimez pas vos modifications? Il suffit de réinitialiser les modifications que vous avez apportées.
• Enregistrer – Une fois que vous avez prévisualisé votre travail, appuyez simplement sur le bouton Enregistrer, pour sauvegarder vos réglages.

Sélection d’un type de personnalisation

Avant de sélectionner un élément sur votre page et de commencer à éditer, vous devez d’abord choisir un type de personnalisation. Ceux-ci sont affichés sur le panneau Editor, lorsqu’aucun élément n’est sélectionné. Il existe trois types à choisir; Personnalisation Générale, Personnaliser une page, et personnalisation des modèles.

Chacun des types sont relativement explicites. La sélection de «Global Customize» (Personnalisation Générale) signifie que les modifications apportées seront applicables à chaque page de votre site. Si vous choisissez «Personnaliser une page», alors toutes les modifications n’auront une incidence que sur la page sur laquelle vous travaillez. « Personnaliser des Modèles » s’applique au format de publication actuel, une bonne option si vous souhaitez configurer toutes les pages des produits ou uniquement les articles du blog.

Le type de personnalisation que vous avez choisi sera affiché en haut du panneau de l’éditeur. Assurez-vous de vérifier que vous modifiez dans le bon type avant d’enregistrer votre travail.

C’est tout pour ce tutoriel, nous continuerons avec un tutoriel plus avancé dans les personnalisations que vous pouvez apporter à Yellow Pencil.