Alors ça y est, vous êtes prêt à vous
lancer ? Vous êtes décidé à créer votre
premier site web et en plus vous voulez le
faire avec WordPress ?
Alors déjà bravo, je vous que vous êtes
renseigné.
Que ce soit pour créer un site personnel,
un site d'entreprise, un site d'association,
un portfolio, un CV, une boutique en ligne,
ou même un blog
WordPress est la bonne solution
Dans cette vidéo, nous allons voir comment
faire pour créer un site WordPress professionnel
en 5 étapes.
Alors, avant de commencer, vous vous demandez
peut être qui je suis et pourquoi vous devriez
m'écouter,
alors pour me présenter rapidement, je m'appelle
Alex et depuis 2011, j'aide des dizaines de
milliers de personnes comme Vous
à créer leur site grâce aux articles de
mon blog WP Marmite.
Et aujourd'hui, je vais vous montrer comment
faire, en vidéo.
Alors si tout est bon pour vous, je vous invite
à retrousser vos manches, prendre une grande
inspiration et on va pouvoir commencer
et je vous rassure tout de suite, on va éviter
un maximum de termes techniques.
Allez c'est parti !
[intro]
Alors, juste avant de commencer, je vous invite
à télécharger la fiche récapitulative
des actions que je vais effectuer tout au
long de cette vidéo pour vousou servir de
support visuel et vous verrez que je vous
ai aussi mis pas mal de conseils et d'astuces
pour votre site WordPress.
Rendez-vous sur wpmarmite.com/recap
ou cliquez sur la Marmite juste ici pour la
télécharger.
Indiquez votre nom et votre e-mail et je vous
l'enverrais gratuitement.
Voilà, sur ce on va pouvoir commencer et
passer à la première étape qui est le choix
d'un nom de domaine
Alors le nom de domaine, qu'est-ce que c'est
? C'est tout simplement l'adresse de votre
site sur Internet donc là vous êtes peut
être par exemple sur Youtube.com sur Facebook.com
ou sur wpmarmite.com, tout ça ce sont des
noms de domaine.
Pour votre site, il va falloir en choisir
un, alors quels sont les critères de sélection
d'un bon nom de domaine.
Parce que je vois souvent les gens faire pas
mal d'erreurs et ça m'embête des fois quand
je vais sur leur site.
Alors, pour choisir un nom de domaine, essayez
déjà de prendre quelque chose qui soit
facilement lisible, prononçable et mémorable
c'est vraiment les trois critères importants.
Alors, éviter des tirets au maximum.
Parler de son site à un inconnu et lui donner
l'adresse de son site :
Alors c'est machin tiret machin tiret truc,
on s'en sort plus, donc l'idée c'est de prendre
un nom qui soit percutant, c'est peut être
votre nom, alors moi j'ai un nom un petit
peu à rallonge "Bortolotti" mais j'ai acheté
un nom de domaine qui s'appelle Alex Borto,
c'est beaucoup plus simple : alexborto.com,
les gens s'en rappellent et peuvent le partager.
Donc pour votre site vous pouvez choisir votre
nom, vous pouvez trouver un nom qui n'existe
pas, par exemple Google c'est un nom qui n'existait
pas avant, mais veiller par contre à ne pas
reprendre quelque chose qui existe déjà.
Il y a des outils pour ça, je vous ai mis
un outil dans la fiche recap pour pouvoir
tester si le nom de domaine est déjà pris
ou pas et vous pouvez aussi voir si ce n'est
pas une marque, parce que sinon, vous pourrez
avoir quelques petits problèmes judiciaires
si vous créez un nom de domaine avec une
marque à l'intérieur.
Donc après une fois que vous aurez trouvé
la première partie de votre nom de domaine,
il faut choisir l'extension, le .fr, le .com,
etc.
Il faut rester sur quelque chose d'assez basique
assez populaire ne vous aventurez pas avec
des extensions en .school, .biz, point je
ne sais pas quoi ! Ce n'est pas aisément
mémorable donc après on retombe dans le
premier travers dont je vous parlais, vous
pouvez opter sur le .fr si vous êtes en France,
sur le .ch ou le .be si vous êtes en Suisse
ou en Belgique, l'idée c'est de vraiment
rester sur quelque chose de simple.
Alors une fois que vous aurez cogité tout
ça, ça peut prendre un petit peu de temps.
Par exemple pour moi pour la Marmite, si j'ai
passé la journée à éplucher le dictionnaire
pour trouver le nom, pour trouver quelque
chose qui soit assez intéressant, qui soit
percutant, qui soit vraiment mémorable.
Je ne regrette pas du tout d'avoir passé
ce temps-là pour avoir choisi le nom de domaine.
Une fois que vous aurez votre nom de domaine,
on va pouvoir passer à l'étape 2.
[intro]
Alors l'étape 2, c'est le choix de l'hébergeur.
Alors là, on commence à, un petit peu, mettre
les mains dans le cambouis et ça devient
d'ailleurs même intéressant.
Quel hébergeur choisir et déjà à quoi
ça sert un hébergeur ?
L'hébergeur c'est tout simplement l'entreprise
qui va stocker votre site, qui va le rendre
accessible en ligne 24/24 h, 365 jours par
an pour vos visiteurs.
Vous pourriez l'installer sur votre ordinateur,
mais au moment où vous l'éteindriez, votre
site ne serait plus accessible.
Donc, il faut payer un hébergeur pour ça.
Il existe des hébergeurs gratuits, mais bon,
moi je pars du principe que vous voulez créer
un site WordPress professionnel, donc il faut
un hébergeur professionnel.
Alors personnellement, je vous recommande
o2switch
Je vais vous partager mon écran.
C'est l'hébergeur à qui je fais confiance
depuis maintenant un petit plus d'un an pour
la Marmite et d'ailleurs je regrette de ne
pas y être allé avant et beaucoup de lecteurs
du blog y sont et ils en sont très satisfaits.
Je vais vous mettre à l'écran quelques petits
retours qu'ils ont pu me faire.
Et donc voilà, un hébergeur de qualité
comme c'est écrit sur leur page d'accueil.
Au niveau du tarif on est à 5 € HT par
mois,
c'est vrai que ça peut paraître un petit
peu plus cher que certaines autres offres,
par exemple ce que l'on peut voir sur oVh
ou 1and1, mais par contre, c'est un hébergeur
qui est vraiment très réactif.
D'une part, il n'y a pas beaucoup de problèmes
et d'autre part, si jamais il y a un problème
ou si vous avez des questions, leur support
est, sans aucune commune mesure par rapport
à ce que j'ai pu avoir avant.
Ils ne vous laissent pas en plan trois jours
si vous avez un problème, ils vous répondent
et ils vous solutionnent ça rapidement.
Voilà, c'est l'hébergeur que je vous recommande.
Et d'ailleurs dans la fiche recap, je vous
ai mis un petit bon de réduction de 15 % à
valoir chez o2switch lorsque vous créez votre
site.
Je vous invite encore à le télécharger
sur wpmarmite.com/recap
Je vous remets le lien juste ici.
Donc, je vais procéder à l'inscription.
Une fois que vous serez sur la page d'accueil,
cliquez sur inscrivez-vous, juste ici;
Alors là on est sur la page de souscription
et on va pouvoir s'inscrire.
Je vais mettre mes informations et je vous
invite à faire de même.
Et ensuite vous cliquez sur s'inscrire.
Donc voilà, je suis en train de créer mon
compte, o2switch vous offre un nom de domaine,
je laisse cela coché
et je clique sur poursuivre
maintenant on peut éventuellement donner
un nom de compte et un mot de passe, mais
on peut laisser par défaut et o2switch s'en
chargera automatiquement
donc je clique sur "poursuivre"
maintenant, je peux entrer le nom de domaine
que j'ai choisi.
On a bien réfléchi à l'étape 1 pour pouvoir
trouver notre nom de domaine, donc une fois
que ce sera bon, on va pouvoir l'inscrire.
Moi je vais mettre "monpremiersitepro.com".
Comme je vous l'ai dit, ça ne sert à rien
de mettre un nom de domaine avec une extension
un petit peu exotique, donc on peut laisser
ça, ça sera très bien.
Maintenant on peut cliquer sur poursuivre
pour continuer.
Maintenant voici les conditions générales,
on rend un petit récapitulatif de tout ce
que l'on a dit, là on peut choisir le type
de paiement, moi je vais payer par carte bancaire.
Un bon d'achat, là, et bien vous pouvez le
récupérer sur wpmarmite.com/recap pour avoir
15 % de réduction, et ensuite vous pouvez
cliquer sur "J'accepte les conditions générales
de vente".
On clique ensuite sur "confirmer le paiement"
et on est redirigé pour effectuer notre paiement.
Moi, du coup, j'ai une MasterCard, et je clique
à nouveau sur mon type de carte, donc encore
une fois MasterCard.
J'entre mon numéro de carte, donc je ne vais
pas vous le montrer, ce serait un petit peu
trop sympa de ma part !
Voilà, maintenant la commande est en cours
de paiement.
On a notre petit récapitulatif
et on est redirigé sur la page de confirmation.
Il y a même un petit bonhomme qui nous montre
que tout est bon.
Alors maintenant, il faut attendre un petit
peu que l'équipe d'o2switch mette en place
votre domaine, alors la durée d'attente peut
varier un petit peu.
Après, il faudra se rendre sur notre boîte
mail pour pouvoir récupérer les informations
de connexion.
[intro]
Alors maintenant, me voilà dans ma boîte
de réception et je vais pouvoir disséquer
avec vous un petit peu cet email.
Donc, il y a pas mal de blabla, il n'y a pas
grand chose à retenir ici.
Tout en bas vous avez votre facture,.
Mais surtout, ce qui nous intéresse vraiment,
c'est ce que l'on appelle le CPanel.
Donc c'est une interface qui va nous permettre
d'effectuer pas mal d'actions dont celle d'installer
WordPress.
Donc, on va se rendre sur ce fameux CPanel,
et donc au niveau d'administration générale
du compte web, vous avez un lien et vous avez
vos identifiants pour vous connecter.
Alors si l'identifiant que vous avez choisi
lors de la création de votre compte sur o2switch
était un peu long, ils l'ont raccourci, donc
moi c'était "alexwpmarmite" et là ils ont
mis "alexwpmar"
Ok, le mot de passe et je clique sur "connexion".
Ok ça marche et là j'ai accès à ce fameux
CPanel où on peut effectuer pas mal d'actions,
là il y a vraiment beaucoup de choses.
L'idée c'est de ne pas vous présenter tout
cela en détail.
Ce qui nous intéresse, c'est d'installe WordPress.
Il y a juste à descendre tout en bas et de
cliquer sur WordPress pour pouvoir utiliser
l'installeur automatique.
Tout ce qu'il y a à faire c'est cliquer sur
"install now" ! Là on laisse ça comme ça
"monpremiersitepro.com", c'est bien mon nom
de domaine.
Dans le dossier "wp" ça il faut absolument
le retirer c'est très important.
Veillez bien à ne rien mettre du tout dans
ce champ.
Après "sitename", c'est le nom de votre site,
donc c'est "monpremiersitepro".
Créer avec Alex de WPMarmite.
Moi je mets cela pour l'exemple mais vous
mettez le nom de votre site et éventuellement
une description.
Ensuite cette case à cocher, on n'y touche
pas
Après, il faut définir un nom d'administrateur,
donc c'est ce qui va vous permettre de vous
connecter et de configurer votre site, donc
là ne laissez surtout pas "admin", mettez
quelque chose d'original, mais qu'on ne puisse
pas deviner.
Alex88marmite, moi c'est ma date de naissance,
c'est quelque chose qui n'est pas super évident
à deviner lorsqu'on ne le sait pas.
Pour le mot de passe, je ne vais pas vous
dire de mettre des caractères différents,
etc.
Cliquez simplement sur la petite clé sur
la droite pour en générer un automatiquement.
On peut voir que c'est assez compliqué.
Par contre, notez le bien, parce que sinon
vous ne pourrez pas vous connectez à votre
site.
Prenez un petit peu de temps et notez le bien,
faites un copier/coller, mettez ça dans un
fichier sur votre ordinateur, pour pouvoir
retrouvez ça pour vous connecter ensuite.
Votre email, et bien vous l'indiquez ici.
Moi c'est alex@wpmarmite.com
La langue du site "french", le français c'est
mieux.
Après, "select plugin", on va voir ce qu'est
un plugin un petit peu plus tard, mais je
vous invite à cocher cette case par mesure
de sécurité.
Au niveau des options avancées, vous pouvez
laisser tel quel,
mais je vous invite à cocher cette case,
pour faire des mises à jour automatiques,
comme ça vous n'aurez pas à le faire et
en cas de faille de sécurité, votre site
sera mis à jour automatiquement, sans que
vous ayez à le faire.
Donc ça, c'est très important de le cocher.
Ensuite on nous demande de sélectionner un
thème, donc un thème c'est un design, c'est
ce qui va donner une apparence à votre site,
on ne va pas le choisir maintenant, on va
attendre un petit peu, une fois qu'on aura
installé WordPress.
Donc là, il n'y a plus qu'à cliquer sur
"installation".
Voilà, là ça mouline et ça installe notre
site WordPress.
Et là on peut voir que tout est bon, WordPress
a été installé avec succès sur http://www.monpremiersitepro.com
et là on peut voir que ça fonctionne, j'ai
mon premier site avec le design par défaut
de WordPress, on a une belle petite plante,
c'est sympa mais on va voir comment on va
enrichir ça davantage.
On va pouvoir enchaîner avec l'étape numéro
4 qui est la personnalisation de notre site
WordPress.
[intro]
Donc comme je vous le disais, on va changer
un petit peu le design, ce n'est pas qu'il
est moche, mais on va essayé de personnaliser
ça un petit peu et d'avoir quelque chose
de plus propre.
Donc, au niveau de l'installeur, je peux le
fermer, mon email, je peux le fermer aussi
et je vais me rendre dans l'administration
de WordPress, en ajoutant "wp-admin" à l'adresse
de mon site et je tape sur "entrer".
Donc là j'arrive sur la page de connexion
de WordPress, j'espère que vous vous rappelez
bien de votre identifiant et de votre mot
de passe parce que c'est là que vous allez
en avoir besoin.
Donc moi c'était "alex88marmite" et j'avais
copié mon mot de passe donc je le colle
et je clique sur "se connecter".
Donc là, on ne va pas cliquer sur "personnaliser
votre site" mais on va plutôt cliquer sur
le lien juste en dessous qui nous dit "changer
complètement de thème", parce que on veut
changer de thème, l'apparence ne nous plait
pas.
Alors je clique sur "ajouter", là on peut
voir un petit peu tous les thèmes gratuits
que nous propose WordPress.
Il en existe des payants, mais je pense que
pour votre premier site, on peut commencer
avec du gratuit, c'est très bien.
Donc là il y en a pas mal, je vous laisserai
parcourir pour voir ce qui vous plait,
vous pouvez cliquer pour avoir un aperçu
comme ça.
Celui-là il n'est pas mal.
Mais on va utiliser un thème qui s'appelle
"Sidney" après bien sûr libre à vous de
choisir votre propre thème.
Mais moi pour cette vidéo, je vais partir
sur celui-ci.
Donc voilà à quoi ça ressemble, c'est assez
sympa
Je clique sur "installer" juste ici, voilà,
c'est en cours d'installation, on voit que
ça mouline.
Voilà ça y est, c'est installé.
Il ne reste plus qu'à l'activer pour le mettre
en service, c'est très important.
Sinon on aura toujours l'ancien thème, voilà
c'est bon
Déjà on peut se rendre sur le site pour
voir ce que cela donne, et là on a bien notre
nouveau thème.
Alors maintenant on va le personnaliser un
petit peu, parce que là c'est l'apparence
par défaut.
On clique sur apparence => personnaliser.
Là on a encore pas mal d'options.
On voit qu'on nous propose la version pro
mais la version gratuite sera amplement suffisante,
donc
Là on a dans général : enrober de page,
qu'est ce que ça veut dire ?
Là c'est juste l'espace qu'il y a entre le
texte et la grande image.
On peut laisser tel quel, pas besoin d'y toucher.
Titre - Slogan - Logo : monpremiersitepro,
c'est ce que l'on a indiqué tout à l'heure
lors de l'installation
Envoi de votre logo : si vous avez un logo,
vous pouvez l'envoyer, il apparaîtra ici,
moi je vais garder mon texte
Icône du site : ça c'est ce qu'on appelle
aussi un favicon, c'est la petite image qui
apparaîtra juste ici, dans les onglets.
Je vais envoyer une image, je clique sur "choisir
des fichiers" et je regarde sur mon bureau,
j'ai une petite icône que j'ai appelée parisien.png
parce que j'aime bien les moustaches !
J'envoie mon image, je la sélectionne, là
on me demande de la recadrer, je clique sur
"recadrer l'image" et on peut voir aussi le
petit aperçu là
et là ça y est j'ai ma petite image, mon
petit bonhomme moustachu qui est en place.
Ensuite : zone d'entête : alors là, on a
un type d'entête, on peut choisir le type
de notre entête, là on a un diaporama, comme
on peut le voir à l'écran, mais on peut
éventuellement mettre une image.
Donc là il n'y a pas d'image qui est définie,
mais on peut mettre une image, on peut aussi
mettre une vidéo ou on peut aussi choisir
de ne pas mettre d'entête du tout, ça peut
être un choix.
Après, ça concerne la page d'accueil, mais
là on a l'entête sur tout le site, on a
l'entête sur tout le site, on peut choisir
une image ou aussi une vidéo, un diaporama,
on fait ce que l'on veut.
Personnellement, moi je vous recommande plus
de choisir le diaporama pour la page d'accueil,
mais on verra qu'il y a quelques petites subtilités
à prendre en compte, on y reviendra.
Et sur votre site, vous pouvez éventuellement
mettre une image ou alors ne rien mettre du
tout.
Moi je vais rester sur diaporama et image.
Diaporama d'entête : on va le configurer.
Là on peut voir qu'il y a des photos qui
défilent toutes les 4 secondes exactement
et on a plusieurs images qui sont définies
ici.
Alors, je vous parlais justement des diaporamas.
Les diaporamas, ce n'est pas très bien d'en
mettre en tout cas sur la page d'accueil,
on ne voit pas ce que cela apporte en plus,
donc, je vais juste laisser une seule image.
Je vais retirer celle-là et je vais retirer
le texte ici.
Alors pourquoi je n'ai pas mis une seule image
sur la page d'accueil ? Tout simplement parce
que sinon j'aurais perdu le texte
et là ça je voulais le garder.
Donc, je vais mettre 0 ici pour le défilement,
comme il n'y a plus qu'une seule image, je
ne veux pas de défilement et ensuite je vais
changer d'image, je vais retirer celle-là
et je vais envoyer à nouveau une image en
cliquant sur "choisir des fichiers" et là
j'ai trouvé une belle image de Paris sur
un site, sur lequel on trouve plein d'images.
Je vous l'ai mis sur la fiche recap, ça s'appelle
unsplash.com donc comme le nom est un peu
difficile à prononcer, je vous l'ai mis dans
la fiche, ce sera beaucoup plus simple.
wpmarmite.com/recap pour la télécharger.
Donc là mon image est en cours d'envoi...
Il faut patienter un petit peu...
Mais elle va venir.
Voilà ça y est, elle est arrivée, je clique
sur choisir une image en bas à droite et
là on va voir qu'elle va s'afficher.
Waouh c'est beau ! C'est Paris !
Donc là on va modifier le "Bienvenue sur
Sydney" donc là je vais mettre "Apprenez
à créer un site" Alex de WPMarmite explique
tout.
On peut voir que ça s'actualise en direct
sur l'aperçu,
donc là je vais cliquer sur "stopper le texte
du diaporama"
et donc ici, au niveau de ces diapos, c'est
terminé.
D'ailleurs j'en profite pour vous montrer
quelques petits boutons ici.
On peut voir l'aperçu du site sur une tablette
et sur un téléphone, ça peut être sympa
de voir ce que cela donne en direct.
Là je vais laisser en écran d'ordinateur,
on peut cliquer ici aussi pour avoir vraiment
un aperçu super concret.
Voilà, on continue la configuration,
Entête du média : donc là c'est éventuellement
une vidéo que l'on peut mettre, donc là
je n'en ai pas.
Image d'entête : je vais modifier l'image,
je vais remettre la même, ce sera celle qui
sera mise sur tout le site, je vais la recadrer
un petit peu, je vais plus mettre le ciel
et je clique sur "recadrer"
Voilà,j'ai mon image qui est faite, l'entête
ressemblera à ça et je laisse ça comme
cela.
Ici, on peut laisser la hauteur de 300 pixels
et laisser comme ça c'est très bien.
Ensuite, on va personnaliser le menu.
Donc là le menu est un petit peu moche parce
qu'il n'est pas configuré, on va voir cela
juste après, mais on va laisser ça par défaut,
c'est pas mal.
Après, modifier les options à votre guise,
vous verrez ce que cela donnera et puis voilà...
Puisque c'est votre site après tout
Style du blog : si vous avez un blog, vous
pouvez choisir un style pour ce blog.
Donc là on est en classique,
largeur plein écran,
on retire la barre latérale ici
maçonnerie, donc c'est un petit peu différent,
on a plus des encarts pour les différents
articles.
Moi je vais rester classique.
Ensuite, on a quelques autres options, alors
là contenu - extrait : surtout il ne faut
pas afficher le contenu entier sur la page
qui liste vos articles, c'est très important
pour le référencement ce n'est pas bon du
tout.
Surtout on ne coche pas ça.
La longueur des extraits, par contre on peut
mettre un extrait, il n'y a pas de souci,
on peut laisser 55, c'est pas mal.
Cacher les métas sur les articles, donc les
métas c'est quoi ?
C'est la date et le nombre de commentaires.
On peut éventuellement les cacher, si on
clique ici, voilà ça les retire.
Moi je vous conseille de les laisser.
Image mise en avant : chaque article peut
avoir une image, on laisse ça, il n'y a pas
besoin de les cacher, on laisse tout comme
ça.
Ensuite les polices : les polices qu'est ce
que c'est ? C'est le style de l'écriture
que vous voulez ajouter à votre site, donc
là on en a plusieurs, elles sont prises sur
Google Fonts, c'est un site qui référence
plein de polices d'écriture, donc pour rester
simple, on va garder celle-ci
et puis en plus, je trouve qu'elles ne sont
pas mal, c'est sympa
Par contre, ce que nous intéresse, c'est
plutôt de modifier la taille des polices,
donc là le titre du site, on peut éventuellement
le modifier, on a un petit curseur pour augmenter,
là si je le place à 32, je peux le mettre
à 42 par exemple et on peut voir que ça
va se mettre à jour
voilà
ici on a vu que ça a grossi.
Le menu, il ne faut pas trop le mettre très
gros non plus, donc je vais plus le passer
à 30, voilà c'est pas mal.
La description je la laisse à 16.
Les éléments du menu, comme je vous l'ai
dit, on ne peut pas encore bien les voir,
on va laisser ça en 14, on pourra revenir
éventuellement après pour effectuer d'autres
modifications.
Taille de police H1, H2, H3, H4, qu'est ce
que ça signifie, on ne sait pas trop.
En fait c'est la taille des titres que l'on
a sur le site,
Donc là, titre de premier niveau, deuxième
niveau, troisième niveau, etc. 52, 42, donc
là si je mets plutôt 48 ce serait peut être
plus intéressant, après on ne peut pas forcément
voir tout en direct, si ces titres ne sont
pas là et là je vais peut être mettre 60
pour vraiment que ça ressorte, les gros titres
il faut que ça ressorte !
Voilà là on a fini avec les gestion des
polices.
Le pied, c'est quoi ? C'est plus le pied de
page donc le bas du site,
Zone de widget du pied, alors qu'est ce qu'un
widget ? Un widget c'est un petit encart qui
va pouvoir être inséré un petit peu partout
sur le site,
là on en a quelques-uns sur la droite, donc
là ce sont des widgets.
On va voir comment les agencer tout à l'heure.
Mais on peut aussi en avoir dans le pied de
page, donc à la fin du site.
Moi personnellement je ne suis pas trop fan
des widgets dans le pied de page
donc on va juste mettre une zone de widget,
ça suffira grandement.
Ensuite, les couleurs, là ça devient plus
intéressant, parce qu'on n'a pas encore touché
aux couleurs de notre site général.
Alors, une couleur principale, une couleur
d'arrière-plan et une couleur de texte, de
corps, donc la couleur de texte normal, celle
qu'on voit là
On va commencer par la couleur du texte, on
va la mettre un tout petit peu plus foncée,
on bouge le curseur, il y a juste à choisir
la couleur.
Restez sobre, ne mettez pas des couleurs qui
explosent les yeux.
l faut que vos visiteurs restent sur votre
site, qu'ils puissent lire ce que vous avez
à leur communiquer, ça serait dommage qu'ils
se sauvent à cause de couleurs qui font mal
aux yeux n'est-ce-pas ?
Donc pour choisir une couleur de corps, voilà
ça c'est bon.
Alors, pour la couleur principale, c'est la
couleur qui sera généralement utilisée
pour les liens sur votre site et pour les
boutons, comme on peut le voir ici et dans
votre menu.
Là il y a du rouge, ce n'est pas trop mal,
mais je vais choisir une autre couleur.
Pour choisir des couleurs qui soient vraiment
intéressantes, moi je vous conseille d'aller
sur un site qui s'appelle coolors.co
vous retrouverez le lien dans le recap de
la Marmite, je ne vais pas me répéter.
Toutes les ressources sont dedans.
Donc là ça charge...
C'est un site qui nous donne des couleurs
qui s'agencent particulièrement bien ensemble.
On coche ça et ça
Là j'ai trouvé un petit peu de couleurs
qui s'agencent bien, en couleur principale,
je vais prendre celle-là, je vais la copier
et j'aurais mon code couleur juste ici et
là ça va être un peu plus intéressant.
Là celle-ci "rangée de couvertures", on
ne s'en occupe pas, on laisse cela comme ça.
Header : le header ça correspond à l'entête
du site, c'est à dire toute la zone où il
y a l'entête et le menu.
Donc l'arrière-plan actuellement il est noir,
je vais mettre un petit peu plus clair avec
cette couleur là, je copie le code couleur
et je le colle juste ici et on va voir que
ça va se mettre à jour directement, voilà.
On a même un petit effet de transparence
qui est assez sympa.
Titre du site, je vais laisser en blanc.
Description : blanc également
Eléments de menu de niveau haut : on va laisser
ça comme ça c'est très bien
Et arrière-plan de sous-menu, je vais mettre
également la même couleur que mon entête.
Texte du diaporama : on va laisser du blanc,
c'est pas mal, ça rend quand même bien.
Ensuite la barre, qu'est ce que c'est que
la barre ? C'est la barre latérale en fait,
c'est ce qui va être sur le côté de votre
site.
Là on voit que c'est en gris, on va peut
être mettre un petit peu plus foncé, voilà,
on va partir sur ça, du 595959
Arrière-plan de la barre, on laisse en blanc
et ensuite le pied de page, là il est aussi
noir, je vais remettre mon beau bleu et là,
voilà, on voit que ça a changé de couleur
Donc là, la couleur des widgets, on va mettre
ça un petit peu plus clair, donc là on n'en
a pas, donc on ne peut pas voir ce que cela
donne et là je vais mettre aussi un petit
peu plus clair pour que ça ressorte un peu
plus.
Donc voilà, là ça commence à ressembler
à quelque chose avec des couleurs qui s'agencent
plutôt bien.
Ensuite, image d'arrière-plan : ça c'est
pour mettre une image d'arrière-plan au niveau
du site ici.
Je ne vais pas le faire parce qu'on a déjà
une image ici, si on en fait trop, ça va
être vraiment moche.
Ensuite, ces fameux menus, on va pouvoir les
configurer, donc là je vais ajouter un menu
nouveau menu, je vais l'appeler menu principal
et je clique sur créer le menu.
On l'ajoute au menu "menu principal", c'est
un petit peu contre intuitif, mais bon, il
faut cocher cette case, faites-moi confiance
et maintenant je vais pouvoir ajouter des
éléments
donc là je vais ajouter l'élément Accueil,
tout simplement, et là nous n'avons pas encore
créé de pages et d'articles donc on va en
créer une à partir d'ici
Donc, entrer une nouvelle page, je vais mettre
une page à propos, voilà je fais ajouter,
ça va me la mettre ici.
Pourquoi pas aussi une page contact et admettons
que vous soyez une entreprise, c'est vraiment
un exemple, je vais mettre services.
C'est une page sur laquelle vous décrirez
vos services
Et donc on peut aussi les réorganiser en
glisser/déposer, là je peux mettre services
un petit peu décalé par rapport au reste
pour que ce soit un sous-menu, mais là je
vais le laisser en menu principal, comme ça
et je vais mettre dans l'ordre : accueil - services
- à propos et contact et ça sera bon
Je retourne ici et là on voit que ça vient
de s'afficher ici : accueil - services - à
propos et contact
on est bons
ensuite ces fameux widgets, là on a les widgets
de la barre, juste ici, là on a beaucoup
de widgets qui ne servent à rien
Rechercher : pour l'instant il n'y a rien
du tout sur notre site, ça ne sert à rien
de rechercher
Articles récents : on n'a pas écrit d'articles,
on retire
Commentaires récents : on n'en a pas non
plus
Archives : je vous conseille aussi de le retirer
Catégories : ça on va pouvoir le laisser,
ça pourra nous servir un petit peu plus tard
Et META : on peut le retirer aussi, on voit
que ça correspond à ça et ça n'est pas
utile aux visiteurs donc on le retire.
Après on peut essayer d'ajouter d'autres
widgets, on va voir ce qu'il y a
Articles récents on l'a retiré,
calendrier ça sert strictement à rien,
menu personnalisé, éventuellement on peut
mettre un autre menu, si vous avez d'autres
choses à communiquer à vos visiteurs.
Nuage d'étiquettes : ça ne sert à rien
Pages : on peut présenter d'autres pages
et là on a un widget texte que je vais ajouter
et là on peut mettre éventuellement une
petite présentation ; là je vais mettre
présentation et après là on peut mettre
du blabla, ça ne veut rien dire, mais vous
pouvez voir ce que cela donne.
Et là c'est tout de suite plus sympa pour
savoir un petit peu à qui on a affaire.
Alors, les widgets du pied de page, là je
vous ai dis que moi je n'étais pas trop fan,
on peut en ajouter, il suffit de cliquer sur
ajouter un widget, mais je ne vais pas le
faire.
Je reviens en arrière.
Page d'accueil statique : donc là pour l'instant,
on voit que sur notre page d'accueil, on a
le seul article de notre site qui a été
créé lors de l'installation de WordPress,
je ne pense pas que ce soit très utile.
Je vous rappelle que l'on est sur un site
d'entreprise dans ce cas là, dans cet exemple.
Donc, ce que l'on va faire sur page d'entête
statique, au lieu d'afficher les derniers
articles sur la page d'accueil,
on va mettre une page et là on va mettre
une page service tout simplement sur laquelle
on va afficher nos services
et là, comme on n'a rien écrit dans la page...
et pour la page des articles, en fait je n'ai
pas de blog, je n'ai pas de page d'actualités,
donc je vais laisser sample page, c'est une
page qui a été créée automatiquement,
on va voir comment la transformer en page
blog tout à l'heure.
Infos du thème : rien du tout, ça ne nous
intéresse pas.
CSS additionnel : là c'est vraiment pour
ceux qui veulent mettre les mains dans le
code donc, on ne va pas s'en occuper.
Ok, on est tout bon, je vérifie et une fois
que vous aurez terminé votre configuration,
il ne vous restera plus qu'à cliquer sur
enregistrer et publier
Voilà c'est fait, c'est tout bon, je peux
quitter la prévisualisation.
Maintenant je vous disais tout à l'heure
que l'on a pas de page blog
On va la créer tout de suite en cliquant
sur modifier la page des articles
et elle je vais la renommer tout simplement
blog
et ici je peux mettre blog pour l'adresse
de la page comme ça ce sera accessible sur
blog.
Par contre le texte ne sera pas affiché,
puisqu'on verra uniquement les derniers articles.
Voilà j'ai mis à jour pour pouvoir sauvegarder
tout ça, et maintenant on peut aller voir
ce que ça donne sur notre site.
On a notre bon menu et on a notre page services
dans laquelle on a encore rien mis du tout,
je clique sur modifier
et là après j'ai une interface, c'est comme
Word, on peut cliquer ici pour une seconde
rangée de boutons et on peut taper tout notre
texte, taper toutes nos infos, blablabla...
Voilà ce que je fais dans mon entreprise,
etc... et on peut mettre tout ce que l'on
veut !
Si vous voulez ajouter une image, vous cliquez
sur ajouter un média et vous pouvez ajouter
ça assez facilement, voilà... une image
et boom c'est fait !
Donc là, voilà, c'est l'utilisation de WordPress,
c'est encore autre chose, mais l'idée là
c'est vraiment vous montrer comment installer
WordPress et configurer rapidement.
On sauvegarde pour mettre à jour et on peut
cliquer sur voir la page pour voir ce que
cela donne ici, on a bien notre texte et ça
c'est top !
Voilà, alors après, si vous voulez éventuellement
ajouter des articles à votre blog,
Vous pouvez aller dans articles => ajouter,
c'est vraiment très simple
Vous mettez le nom de votre article : mon
bel article
Après votre texte, vos boutons, etc.
Et là on voit qu'il y a une petite modification
à faire puisqu'il y a quelque chose qui ne
me plait pas !
On voit que l'adresse de l'article est sur
monpremiersitepro.com/2017 avec le mois et
le jour et ça je ne veux pas du tout l'avoir
donc j'enregistre mon article
et je vais dans réglages => permaliens
et je clique sur nom de l'article pour avoir
une bonne structure d'adresse pour mes articles.
Voilà, qu'est ce que je peux vous montrer
d'autre dans les options en général
il n'y a rien à faire, tout a été configuré
auparavant.
Éventuellement, vous pouvez choisir votre
fuseau horaire, en choisissant la ville qui
correspond le mieux à votre localisation,
nous c'est Paris.
Je ne sais pas si on va réussir à la trouver...
Paris, c'est là, voilà ! et bien sûr on
sauvegarde.
Je vous laisserai parcourir les options pour
voir un petit peu, tout ça, à quoi ça correspond
et avant de terminer cette vidéo, je tenais
à vous montrer ce que sont les extensions
[intro]
Une extension, c'est quelque chose qui vient
rajouter de nouvelles fonctionnalités à
votre site WordPress, là on peut en ajouter
pas mal
On retrouve celles qui ont été ajoutées
par l'installation du CPanel :
Loginizer : ça sert à rejeter les gens qui
essayent de se connecter à votre site et
qui ne sont pas les bienvenus.
On a également une extension d'anti spam
qui s'appelle Akismet et donc pour mettre
une extension en service, il suffit de l'activer
Après il existe d'autres extensions, on peut
cliquer sur ajouter pour
ajouter une nouvelle extension et une qui
est assez connue, elle s'appelle Yoast SEO,
ça sert à optimiser votre référencement
Donc voilà, une fois que vous avez trouvé
une extension, vous cliquez sur installer
voilà c'est installé et après on clique
sur activer pour la mettre en service et de
nouvelles choses apparaîtront dans l'administration
de WordPress
et donc là ce qui apparaît c'est ça SEO
: qui veut dire référencement en anglais,
donc après, voilà il faut la configurer,
ce n'est pas le sujet de cette vidéo
ici le but c'est de vous montrer comment installer
et configurer un site WordPress professionnel,
donc là, ce n'est pas super pro parce qu'il
n'y a pas de contenu
mais ça après c'est votre boulot, d'aller
dans les pages, les articles et créer du
contenu pour pouvoir enrichir votre site et
diffuser ce que vous avez à dire aux internautes.
Donc voilà, merci beaucoup d'avoir suivi
cette vidéo, j'espère que ça vous a plu,
bien sûr j'ai essayé de rester le plus succinct
possible pour ne pas trop vous en mettre plein
la tête.
Voilà vous avez déjà les bases pour créer
un site WordPress, après il faudra continuer
à travailler pour l'optimiser, l'arranger,
c'est quelque chose qui vit un site.
On ne crée pas et on ne le laisse pas à
l'abandon, c'est quelque chose qui doit vivre...
Je vous invite à télécharger encore la
fiche récapitulative pour retrouver toutes
les étapes de la création d'un site WordPress,
je vous ai mis aussi d'autres ressources pour
pouvoir effectuer d'autres choses donc par
exemple la configuration de Yoast SEO, j'ai
des ressources pour ça.
Je peux vous envoyer ça gratuitement si vous
téléchargez sur wpmarmite.com/recap,ou vous
l'avez aussi en cliquant sur la Marmite juste
ici
et aussi j'en profite pour vous dire qu'il
y a 15 % de réduction chez o2switch, donc
c'est toujours bon à prendre.
Voilà, merci d'avoir suivi cette vidéo,
je compte sur vous pour mettre un pouce en
l'air si elle vous a plu.
Abonnez-vous à la chaîne Youtube de la Marmite
pour recevoir d'autres vidéos, je vais en
mettre une par semaine, donc vous pourrez
continuer à vous former à WordPress
Je vous dis à très vite et mettez-moi un
commentaire si vous avez des questions, ça
me donnera des idées pour faire de nouvelles
vidéos.
Merci à vous, à très vite et bon courage
avec votre site
Tchao
