[Débutant] Série wordpress - Découverte de l'interface

Bienvenue dans ce tuto Worpress qui s'inscrit dans une série.
Dont voici sans plus attendre la structure :
1. Créer un blog sur Wordpress.com
2. Découverte de l'interface
3. Remplir son blog : page, articles et catégories

A présent situons nous dans le processus :


Une fois que vous avez validé la création de votre blog, vous voici propulsé
dans l'interface d'administration appelé Tableau de bord. Celle-ci diffère de l'interface d'un wordpress hébergé sur son propre nom de domaine. Car ici vous avez des menus liés

Spoiler:

Je ne vais pas traiter de la partie Tableau de bord (menu latéral) car cela traite des statistiques du blog et de ton activité en tant que bloggeuse. tes interactions sur les autres blogs et commentaires. Idem pour la partie store.

Les menus qui vont servir à paramétrer le blog, le customiser et le personnaliser :
- Apparence
- Utilisateurs
- Outils
- Réglages

Les menus qui vont servir a ajouter et modifier du contenu sur le blog :
- Article
- Média
- Lien
- Page

Je vais tâcher d'indiquer pour chaque menu ce qui sert à quoi pour ce qui est des paramètres. Je ne donnerai pas le détail de tous par l'image car cela risque de vous perdre sous la masse d'information non pertinentes.
Donc pour certains juste une description de ce à quoi ils servent, Wordpress détaille les fonctionnalités car son public d'utilisateur est éclectique. Si un point mérite des précisions, vous pourrez en faire la demande via la partie question ou aide personnalisée si c'est pour un accompagnement plus long dans un processus.

Pour les menus de contenu nous les verrons en detail et en pratique dans la partie 3 de cette série qui traite de comment remplir son blog

1. Menu Apparence :



A. Thèmes :

Alors au niveau des thèmes vous verrez qu'il y en a des gratuits et des payants. On va se concentrer sur les gratuits, ça ne sert à rien d'investir dans un thème tant que votre blog n'a pas un peu d'ancienneté.



La bonne chose de la présentation des thèmes c'est qu'en cliquant sur Aperçu il vous permet de visualiser votre blog avec ce design. Aussi pour mieux vous représenter l'apparence futur de votre blog, je vous suggère de créer quelques articles avant de passer au changement de design. Cela vous permettra de mieux vous projeter !

Donc une fois qu'on a notre thème on va tout simplement cliquer sur Activer
On attend sagement le temps que cela s'installe.
Pour ma part d'un coup là où on visualisait les thèmes jusqu'à présent j'ai eu la page blanche...
J'ai donc re-cliqué sur Thème pour voir que cela avait fonctionné. Étrange mais bon tant que ça marche  



On va faire preuve de curiosité et cliquer sur le lien Read more about Liquorice →
Ça nous amène sur la page du thème et nous fourni quelques infos

Ici ce qui est précieux ce sont les indications sur la taille des éléments :

Citation :

Quick Specs (all measurements in pixels):

   The main column width is 610 except in the full-width layout where it’s 788.
   The header image is 900 in width by 235 in height.
   The sidebar is 178 in width.

Ces éléments nous serviront notamment dans la personnalisation de l'en tête !

B. Widgets :

Pour des raisons à 50% de flemme et à 50% de ne pas vouloir le la jouer spécialiste, je ne vais pas vous détailler les widgets. Mais comme je suis mignonne (et que j'ai peur des gardiennes) je vais vous expliquer ce qu'est un widget.

les widgets se sont des petits modules que vous allez pouvoir ajouter à votre barre latéral. Ils sont déjà programmé pour vous permettre d'afficher différentes choses.
cela peut être un sommaire (catégorie, page ou lien) ou alors un nuage de mots clef ou encore un calendrier. Comme vous pouvez le constater sur l'image ci dessous, il y en a  une multitude !

C. Menus :

Vous pouvez créer vos propres menus. Pour ce faire on vous propose différents nature de lien  que j'ai entouré en rouge. la partie verte correspond au menus que vous avez crées et enregistré.


Dans la partie verte vous allez donc créer un menu. Une fois que la chose est faite il vous reste à y mettre les liens.
Ces liens peuvent être de différentes "nature", le cadre rouge vous donne un eventail; Vous pouvez ainsi ajouter des liens vers d'autres site, des liens vers un page en particulier ou vers une catégorie.
Vous vous servez donc de l'encart rouge pour ajouter des liens à votre menu.

D. Options du thème :

Les options sont différentes selon le thème car les créateurs décident des paramètres configurables.
Sur mon thème, je peux paramétrer les icônes présentent en haut de ta page pour faire un lien vers ta page facebook ton compte tweeter et décider de masque ou pas le fil RSS.

Comme chaque option est spécifique, si vous veniez à avoir besoin d'aide sur ce thème précis, je vous suggére d'effectuer une demande d'aide personnalisée.

E. Arrière-plan:

Ici on va pouvoir changer l'image de l'arrière plan OU choisi une couleur uni pour celui-ci



Ici l'image est utilisée pour habiller le fond en se répétant sur l'axe des abscisses et l'axe des ordonnées.

Information sur les options :
- position : le point de démarrage de l'image
- répéter : la répétition de l'image
---> juxtaposition : se répète selon l'abscisse et l'ordonnée (axe x et axe y)
- fichier : si tu choisi défilement ton fond bouge en même temps que le texte. Si tu choisi fixe, seul le texte bouge, le fond reste statique
- couleur d'arrière-plan : une couleur pour l'arrière plan

A savoir si tu met en ligne une image, l'effet qui existe par défaut vont disparaitre. Donc pour revenir en arrière il vous suffit de supprimer l'image de fond. Autrement enregistrez les modifications.
Pendant ce temps et pour être sûr que cela convient on peux visualiser ce que ça donne en ouvrant dans un nouvel onglet le blog.

F. En-tête:

Avec les modifications l'image de l'en tête a disparu, l'en tête c'est l'image qui apparait tout en haut de la page. Elle n'est pas obmigatoire pour ma part, j'ai décidé d'en mettre une autre.

Donc pour l'en tête vu que je veux avoir une effet de transparence je vais utiliser le format .png
On a bien un rappel des dimensions : 900 pixels par 235pixels

Donc encore une fois parcourir et envoyer, alors on a ces possibilités :



J'ai choisi de masquer le texte correspondant au nom du blog car cela ne rendait pas avec mon bandeau. Le rendu ne permet pas de se rendre compte de ce que cela donne avec l'arrière plan donc regarde la tête de ton blog dans un nouvel onglet.
Je vous conseille lors de la création de votre bandeau pour bien visualiser de créer un arrière plan similaire à celui de votre site. Pensez bien à le masquer au moment de l'enregistrement du png.

G. Design personnalisé:

C'est ici que l'on va pouvoir toucher à la feuille de style du blog (.css)

Tout en haut tu as des onglets on va laisser tomber celui de Custom Design et Font car c'est payant

Donc l'onglet css va te permettre de modifier les CSS de ton blog.
Attention chez wordpress si vous voulez accéder à ta feuille de style original c'est là aussi payant. Heureusement dans le monde merveilleux des CSS on peut écrire des contre ordre à condition de savoir exactement ce que l'on doit bouger.
Donc pour s'y retrouver il faut utiliser un outil merveilleux qui est une extension disponible sous firefox : le module Firebug.

H. Mobile:

Vous pouvez optez ici pour la mise en place d'un design spécial lorsque l'on navigue sur votre blog depuis un appareil mobile. Par défaut il est configuré sur Oui (donc un thème spécial).

En dessous ou vous propose de ne montrer que des version tronqué de vos articles. Par défaut on voit l'article en entier (configuré sur Non)

Une petite piqûre de rappel pour vous rappeler qu'il existe des application Wordpress pour différents smartphone et tablette. Un peu de pub gratos en somme.

I. Ipad:

Wordpress vous offre la possibilité d'adapter votre site à la lecture sur Ipad. La configuration de celui-ci sera automatiquement modifié pour s'adapter à une navigation sur une tablette.
Cela n'a rien d'obligatoire, votre site sera parfaitement lu sur une tablette par le navigateur. Mais si cela vous amuse alors vous avez différents éléments à préparer à chaque fois vous est indiqué un format spécial, veillez à le respecter.
Voyons brièvement quelques uns de ces différents éléments :
Launch screen image : On peut mettre votre site en raccourci directement sur l'ipad et y accéder via une icône. Ici vous indiquez l'image qui va servir d'icône pour votre site.
Display font : choix de la police
Accent color : choix de la couleur

2. Menu Utilisateurs :



A. Tous les utilisateurs:

Wordpress est une plateforme de blog pensée pour être multi utilisateur. Aisi vous pouvez génrer un blog à plusieurs en créant de nouvel accès à des personnes. Ceux-ci peuvent rejoindre le blog en tant que :
- Administrateur : Accède à toutes les fonctionnalités d'administration
- Editeur : Peut publier et gérer articles et pages, les siens ainsi que ceux des autres utilisateurs.
- Auteur : Peut publier et gérer ses propres articles.
- Contributeur : Peut écrire et gérer ses articles, mais ne peut les publier.
Ce sont des droits pré crées par Wordpress. Vous ne pouvez les modifier ou en créer d'autres.
Tous les utilisateur vous permet d'avoir un perçu comme son nom l'indique de toutes les personnes qui peuvent intervenir sur le blog.

B. Inviter:

Vous pouvez convier des personnes à participer à votre blog. Pour cela on vous demande d'indiquer leur mail, le rôle que vous leur proposé et de saisir un message. Le moment où jamais d'être éloquent pour convaincre quelqu'un de rejoindre votre blog.

Un nouveau rôle apparait dans le menu déroulant celui de lecteur. Tout simplement inviter quelqu'un a découvrir votre blog, de quoi le faire connaitre en somme.

C. Mon profil:

Comme son nom l'indique c'est ici que vous remplissez votre profil. l'occasion d'en dire plus sur vous, là où vous habitez, vos centres d'intérêts, vos différentes adresses internet ou moyen de vous contacter
Vous pouvez également ajouter Photos, liens et des services externes en l'occurrence les différents réseaux sociaux et site de partage (facebook, blogger, you tube...)

Worpdress l'indique bien mais je préfère vous le dire de manière bien visible :
Attention toutes les informations renseignées dans votre page profil seront publiquement affichées sur le site si on clique sur votre pseudo !
On est sur internet, n'importe qui peut trouver ces informations via une recherche une fois qu'elles sont en ligne, soyez en conscient !

D. Paramètres personnels:

C'est ici que vous allez définir vos préférences quand à Wordpress, l'occasion pour nous de commencer à changer quelques éléments.

Nous allons modifier la langue de l'interface en français, c'est toujours plus pratique


Différents paramètres vous sont demandés, ils sont bien entendu optionnel. Wordpress permet de lier votre compte twitter à votre blog. Il vous propose aussi des données de géolocalisation, ce qui a un intérêt si vous compter blogger à droite à gauche de puis votre smartphone.

Ici on peut améliorer le correcteur orthographique. J'ai rajouté Fuyaya car curieusement cela n'existe pas dans le dictionnaire.

1. Menu Outils :



A. Outils disponibles:

Publier un article

Alors concernant ce premier outil ja vais passer vite. Une petite citation de wordpress :

Citation :

Utilisez-le pour récupérer du texte, des images et des vidéos depuis n’importe quelle page Web.

Si vous deviez agir ainsi, PENSEZ à indiquer vos sources, ne faites pas de plagiat.
Et pour vous sensibiliser à tout cela et prendre conscience de choses, ej vous suggere de visiter ce site : C.A.S.A

Convertisseur de Tags et Catégories

Cet outil va convertir le nom donné à vos catégories en tag. Les tags ce sont des mots clefs que vous pourrez associer à chaque article et que l'on retrouve ensuite dans les fameux nuage de mot clefs dont la taille des mots et fonction du nombre de fois où ces tags ont été attribués.

Publier par Email

Des fois que vous ne pourriez attendre pur publier un article et que vous n'ayez que la possibilité d'envoyer un mail, cet outils sans doute indispensable existe.
Vous devrez au préalable créer une adresse secrète via l'interface.

Vérification des Outils pour Webmaster

Goolgle et bling ont crées des modules pour les webmaster afin d'étudier le comportement des internautes. mais également la bonne santé du site à savoir les liens rompus ou autre. Tout un panel de fonctionnalité.
Cet outil va vous permettre de lier votre blog à votre compte google ou Bling

B. Importer:

Si vous avez du contenu sur d'autres supports ou blog, vous pouvez l'importer dans Wordpress. Vous trouverez dans cette rubrique les types supportées. Il ne vous reste plus qu'à cliquer et suivre els instructions.

C. Exportation:

Vous pouvez exporter la totalité de votre blog ou seulement une catégorie de contenu (article, pages, commentaires). C'est un format spécial qui vous permet l'export vers un autre site de type Wordpress. C'est aussi un bon moyen pour faire des sauvegardes régulières de votre site.

D. Supprimer mon site:

Car rien n'est éternel, peut être déciderez vous un jour que la vie de blogger n'est pas faite pour vous. Plutôt que de laisser trainer sur la toile un blog qui ne sera que l'ombre de lui-même vous avez décidé de le supprimer.
Bingo c'est ici que ça se passe !

Mais vous pourrez également choisir d'autre voie que l'éradiciton totale : voici les options qui vous sont proposées :

3. Menu Réglages :




A. Général:
C'est ici que vous allez pouvoir modifier différentes choses relatives à votre site :
- titre
- slogan
- adresse e-mail
- fuseau horaire
- format de la date
- format de l'heure
- jour qui commence la semaine
- langue

Ainsi que l'image associé à votre blog pour sa promotion sur le réseau wordpress.com

B. Ecriture:

Différentes options quand à l'affichage de votre contenu vous sont proposées, nous allons les voir plus en détails. Concernant la publication d'article, il vous est proposé d'ajouter un lien pour aisément pomper du contenu d'autres sites, ils insistent décidement ! Il manque cependant la grosse phrase en rouge vous prévenant de bien penser à mettre des guillemets et à citer vos sources !!! Et si ce genre de problématique vous intéresse ou vous échappe dans tous les cas je vous suggère de consulter ce site : C.A.S.A

A présent voyons les options d'écriture, qui vont influer sur la présentation des éléments.



Taille du champ de saisie : taille du champ ou vous écrivez vos textes
Mise en forme : optez pour la conversion automatique en émoticône si vous le souhaitez. Également une correction automatique des balises. Si vous ne comptez pas insérer de ode alors choisissez cette option.
Catégorie par défaut : Si lorsque vous créez un articles vous oubliez de spécifier une catégorie, celui-ci sera automatiquement envoyé dans la catégorie par défaut de Wordpress qui porte le doux nom de «Uncategorized ». Vous pouvez via le menu déroulant décider vous même de la catégorie par défaut en sélectionnant une des catégories que vous aurez créé.
Format par défaut des articles : il y a différents type de présentation des articles qui sont préformaté. Vous choisissez celui qui sera le format par defaut pour votre blog. A chaque nouvel artcile à moins que vous ne changiez le format au moment de la création, il adoptera le format que vous choisissez ici. (Présentation ds différents format dans la partie 3 de la série : Remplir son blog)
Catégorie par défaut des liens : Vous pouvez créer différentes catégories de liens. Vous décidez ici de la catégorie par defaut

C. Lecture:

On modifie aux options liées à la lecture du blog par les visiteurs.

La page d'accueil de votre blog consiste en la visualisation des derniers posts, c'est le réglage par défaut. En cela la page d'accueil est automatique car on voit toujours les derniers contenus. On peux cependant décider d'avoir page d'accueil fixe, à ce moment là tu vas déterminer quel page préalablement crée est ta page d'accueil. On va donc modifier les options de lecture :



On peut donc décider que notre page d'accueil par défaut est une page statique. Là deux choix une page que l'on a créé (menu déroulant en face de page d'accueil) ou alors la page d'accueil d'une catégorie qui consiste en la liste les articles que celle-ci contient (menu déroulant en face de page des articles)

Tant que l'on y est on peut jouer sur d'autres options comme le nombre d'article par page.
Tout ce qui est relatif au flux est lié au flux RSS du site.

D. Option de discussion:

Vous régissez ici les différents paramètres relatif à l'interaction avec vos visiteurs. au sens large bien sûr car cela va concerner les conditons au cours esquels vous souhaitez recevoir des mail de notifications. Mais egalement l'autorisation de commentaires et les informations à donner pour en publier un.
Tout ce qui est relatif aux commentaires donc au fait que les gens publient sur votre site : voulez vous modérer, ces commentaires, y a t'il une date limite, etc...
Toutes ses questions à vous poser et selon vos désir vous cocher les cases ou les décochez.

E. Média:

Gestion des formats (au sens de taille) des différents médias que vous pouvez incorporer sur votre site.
Egalement les options d'intégration des vidéos.

F. Vie privée:

Vie privée est à comprendre au sens de référencement de vos contenus. Souhaitez vous que les robots passent sur votre site pour apparaitre dans les moteurs de recherche.

Une option qui est intéressante lorsque vous préparez votre blog :

Citation :

Je voudrais que mon site soit privé, visible uniquement des utilisateurs que je choisis

Vous pouvez ensuite choisir les personnes à inviter.

Pour ma part j'ai choisi cette option pur ce blog de test, car il n'y a aucun intérêt à le référencer.

G. Partager:

Annoncer

Vous allez pouvoir lier votre blog à différents réseaux sociaux. Pour citer ceux qui sont le plus susceptibles de vous interresser :
- facebook
- twitter
- messenger

Sharing Buttons

Il s'agit de bouton de partage par defaut vous avez Email et Imprimer; Mais le module vous ermet d'ajouter d'autres boutons, à condition de renseigner le code pour que le partage existe... La manipulation ne parait pas des plus limpide.

plus facile, vous pouvez choisir la présentation des ces boutons et à quel type de contenu les associer

Bouton J'aime WordPress.com

Par defaut un bouton j'aime apparaît à la fin de vos articles. Vous pouvez choisir ici de le masquer en décochant la checkbox.

H. Sondages et Cotes:

Bon on va passer Polldaddy, visiblement c'est la même société que wordpress, un site orienté vers sondage. Donc ils vous propose de lier vos comptes...

Dans les options générales vous configurez ainsi le fonctionnement par defaut de vos sondages.
Je traduis au cas où :
- result voting: concerne l'affichage des résultats du sondage
- Repeat voting : permettre ou pas à une personne de voter plusieurs fois
I. Domaines:

Si vous possédez plusieurs domaine, ce module permet de les ajouter.

Petit HS, mais si vous en venez à vouloir avoir votre nom de domaine et hébergement, regardez les prix de wordpress. Si c'est plus de 35 euros par an, laissez tombé et envoyer moi un MP; mieux vaut prendre un hébergement indépendant, et mettre en place la version gratuite de worpdress que vous pourrez vraiment personnaliser au niveau du design !!!

J. Avertir si modifiés...:

Alors cette section n'a un intérêt que si vous laissez d'autres personnes participer à la rédaction du contenu de votre site. Différents statuts existent, le créateur du blog est l'administrateur.
Donc dans le cas d'auteurs multiples, vous pouvez mettre en place différentes alertes pour être informé par e-mail de modification apportées.

K. Messagerie Texto:

Vous pouvez interagir avec votre blog via texto. Visiblement il faut au préalable donner vote tel et recevoir un code d'activation. Pour en savoir plus vous êtes inviter à suivre un lien.

Je ne sais pas trop si mon avis vous passionne, mais entre les smartphone et les ordis, vous avez suffisamment de moyen d'interagir avec votre blog. Alors évitez de filer votre téléphone...

L. Open Id:

Il semblerait que Wordpress fasse partie d'un réseau, votre OpenId vous permettant de vous connecter à ces différents sites vous est donné. Vous pouvez créer une liste de ces sites que vous considérez de confiance. Cela accélérera le processus de connexion.
Chercher plus d'info !

M. Webnhooks:

Bon ça m'a l'air assez complexe. En gros c'est pour les developpeurs afin de déterminer des ecoutes sur certains éléments. Vous avez pas tout compris, bien j'aurai tendance à dire que ça ne vous servira pas.

Je garde ce post pour d’éventuels ajout ou astuces de la part des membres. En espérant que cela vous aura été utile.

Merci Ô Fu