Retranscription vidéo
salut c’est alex j’espère que vous allez
bien lors du dernier épisode j’ai eu
l’occasion de vous montrer ma maquette
de sites
maintenant que c’est fait maintenant que
c’est validé je vais passer concrètement
à l’action sur wordpress est donc la
première étape que je vais entamer
c’est notamment la création d’un menu
c’est exactement ce que je vais vous
montrer maintenant
alors ce que je vais faire simplement
maintenant vous le savez j’ai eu
l’occasion donc de créer ce contenu ici
sur illustrator et bien évidemment ce
qui m’intéresse maintenant c’est que
dans la mesure où j’essaie de projection
maintenant il est temps de passer à
l’action
donc ce que je vais faire c’est que donc
je tape twingo points comme et je vais
aller sur ma commande sur la partie
administration
ensuite ce que je vais faire sur ada
vous allez allez vous rendre sur thème
option
la manière dont j’ai procédé en fait ça
va être la suivante dans un premier
temps je vais changer le logo ici dans
cette vidéo les différents types de logo
d’ailleurs parce qu’en fonction de la
taille de l’écran
le logo peut être différent ensuite je
vais changer le menu qui ici ok donc
allons-y tac
donc on va sur dont cavada thème options
et ensuite on se rend sur logo et la
voyez à deux types de logo il ya le logo
qui s’appelle logo classique et le
favicon file recon vous voyez en eau
lorsque le site n’est pas forcément
visible et ben là par exemple il n’ya
pas de files icônes et donc c’est
quelque chose qui va falloir qu’on
intègre
c’est une petite image tout en tout
temps l’anglais alors donc là le logo
par défaut c’est celui ci
donc ce que je veux simplement faire si
je regardais la taille de ce logo pour
intégrer exactement le même dans des
world press donc là vous voyez par
exemple la taille du logo le voit ici
sur sur wordpress l’hôtellerie maj ses
165 sur 41 lorsque je vais faire hop je
me rends ici
cent soixante cinq 65 sur 41 oups sur 41
au clae donc vous voyez c’est quand même
relativement petit et donc dans la
mesure où dans les projections que j’ai
pu faire
ici vous voyez on a quelque chose qui
est qui et blanc le logo et blanc donc
je vais faire la même chose
je vais prendre mon logo celui ci par
exemple je veux venir le col est bien
évidemment il faut que je réduise et
ensuite j’essaie de le mettre le taille
maximum une fois que ça c’est fait je
vais centre et mon logo et ensuite je
vais changer la couleur up
donc je vais m en blanc ok donc une fois
que
effet on fait fichiers exporte alors
sauvegarder pour le web
j’aurai l’occasion de faire une vidéo
pour vous expliquer et donc là on ne
voit pas beaucoup parce que c’est
transparent ce qu’effectivement j’ai
coché ici transparent mais effectivement
le logo est bien présent donc ce que je
vais faire avec les bonnes dimensions
donc ça c’est bon donc je vais
sauvegarder sauvegarder alors logo
traîneau 1 x et je vais m enregistrés
notamment je vais retourner ici
toi non
autour no logo un donc c’est celui là et
je m ok vous pouvez souhaiter les
versets soit le fait de cette manière là
donc une fois que c’est fait on va
mettre ici tout est no logo 1 x
sélectionnez ensuite alors celui-ci up
claude seul est celui-là donc 324 sur
quatre heures par 82
324 324 par 82 donc on a effectivement
maintenant ça ça ça m’a fait bouger mon
texte ici donc je le ressens très de
nouveau et génère le copier là
et même principe on va centrer tac pour
être sûr on va faire ficher exporté safe
for legal legacy 320 480 de ces bons
sauvegarde et hop
et ici on va mettre tous nos logos dû
enregistrer
on va se rendre obs on reste rendent sur
le site téléverser sélectionné up to no
logo 2 c’est bien ça hop lyon
hop alors on va sauvegarder dans un
premier temps on va voir ce que ça donne
qu’est donc vous voyez maintenant mon
logo il a bien été modifiées nous
maintenant on retrouve tout en haut ici
donc c’est parfait
alors ensuite on va continuer on va
finir les logos parce qu’en fait la
s’est passé pas suffisant par exemple il
ya certains alors je ne sais pas si
c’est quelque chose que je vais asti que
je vais activée mais effectivement il
plaira des stickers un sticker le
plastique assez simplement lorsque vous
regardez sur votre site
quand on descend parfois le menu devient
plus petit bon là c’est pas activés pour
le moment sur celui ci
mais c’est ce que je vais d’ailleurs je
vais l’activer parce que c’est quelque
chose qui est intéressant à faire alors
sticky et d’heures logo
ok
l’impression que c’est le même qui est
que la tech donc on va mettre
sélectionner celui ci est ensuite ch’ti
que leaders locaux
celui là aussi quelques hoquets donc on
va sauvegarder ces changements ici est
ce qu’on va faire c’est qu’on va tu
t’occupais du five icône aussi alors
vous voyez là c’est les détails qui sont
proposés par défaut ce que je vais faire
c’est que je vais créer les différentes
icônes pour ses différents supports
donc encore une fois le favicon c’est
simplement le petit logo que vous pouvez
vous pouvez voir ici
d’accord donc par exemple si vous vous
rendez sur un de mes autres sites donc
et elle parie hop
bon alors là sa charge voyait et dans
quelques secondes
normalement voilà on voit le saas est un
c’est typiquement a failli beacon donc
c’est exactement ce qu’on va rajouter
pour pour tous et nous aussi donc là
pour faire ça donc les taxes et donc 32
57 72 alors tac 32
ensuite hop 57 up et ensuite 72
ok donc là on a nos trois formats de
file icônes sont donc ce que je vais
faire je pense qu’au niveau de la
couleur de ça je vais faire un truc qui
va être un peu un peu plus coloré
donc j’ai peut-être sans doute faire
quelque chose quelque chose comme ça
donc hop réduire sa pop en teck
ok donc ensuite j’ai prendre hop ça
c’est ça qui deviendra le mini logo
disons up hula hoop
et on va mettre ça en blanc hop
donc ça va donner
chose comme ça tout ce qui dépasse du
bord là vous inquiétez pas c’est quelque
chose qui veut qu’on ne verra pas en
europe
donc voilà ça c’est bien donc ce que je
vais faire maintenant c’est que je les
sauvegardes et exporter alors c’est
vraiment tout petit saint faye beacon et
je vais marquer côté 30 de la taille
ap hockey enregistré ensuite hop sas
avait donc 57 et ça c’est donc 72
72 ok donc là on aime le logo maintenant
qu’ils sont prêts donc ce qu’on va faire
c’est qu’on va les huttes claude et donc
32
attaque du du poil imaginer sur quelque
chose qui est extrêmement petit donc
c’est vraiment bien parce que dans tous
les cas la mesure où c’est un petit
icône
il n’y a pas besoin ça sert à rien de
mettre des images qu’ils soient énormes
parce que dans tous les cas elles
n’apparaîtront pas de manière plus gros
centre est un donc hop
1 je suis passé à côté de cela la forge
encore un nouveau tech
up sélectionnées
ils m’ont en rajouter encore bon 114 144
mois je vous conseille de tout faire
d’un coup comme ça moi après ça on n’en
parle plus alors qu’est ce que je dis
114 g 10 sont 14èmes sa hotte 114
ouais
et ensuite le dernier 144 voilà
ok
il s’agit comme leur centre était qu
aligner un pont n’est pas mal et ensuite
au lapin même principe on aligne ok je
sauvegarde ça ok au nord de 10 114 et
ici on a dit 144
pape la voilà donc ça c’est bon on va le
plot dès maintenant ça sera fait tu as
quand même prendre les 214 sassus à ses
144 d’ailleurs 144 et celui-ci 714 ok
donc c’est cela qu’on veut 114 et enfin
144 eelv est juste ici on va se regarder
ça maintenant
ok maintenant si on sauvegarde et donc
qu’on se rend sur le site
normalement la petite iq
apparaître ici ça devrait être
effectivement bah voilà voyez maintenant
donc on a un petit icône ici donc c’est
exactement ce que j’ai fait les autres
en fait c’est toujours de voir d’autres
types de supports donc bon faites-le
comme ça vous êtes sûrs d’être dette
propre
voilà donc c’est quand même beaucoup
mieux et surtout ça permet en fait
directement aux utilisateurs de voir sur
quelle page
ils sont et et ça et sur quelle si ici
on voit un logo comme ça plutôt que
quelque chose qui soit qu’ils soient
vite comme ça c’est quand même beaucoup
plus beaucoup plus sympa ok donc au
niveau des logos on est bien tout est
tout à fait correctement c’est parfait
donc maintenant ce qu’on va faire c’est
qu’on va aller au niveau du menu
alors le menu j’essaie de vous présenter
simplement alors le menu il ya deux
façons de faire en fait
soit vous allez directement ici sur la
partie personnalisée
et vous voyez sympathie
analyser si vous cliquez ici sur menu et
ensuite sur ainsi au menu donc saas avec
le nom du menu parce qu’on peut avoir
plusieurs noms de menu hélas avec les
différentes sections que vous allez
retrouver dans votre menu donc à
l’émission cliquer ici
voyez comme c’est là et là typiquement
tout va être il ya une page d’accord
donc vous pouvez ajouter des éléments
directement ici ou réorganiser
comme vous le souhaitez pour mettre par
exemple celui là en premier ou
inversement
moi ça c’est une navigation alors c’est
la navigation qui proposé par défaut sur
wordpress moi à titre personnel c’est
pas forcément quelque chose dont je me
sers je me sers directement ben je vais
directement sur eux alors soit sur havas
da mais aussi je vous montrer la manière
dont je procède donc si vous allez sur
typiquement dont cavada et vous avez sur
dashboard ou si vous avez même
directement sur menu vous allez tomber
directement seul endroit où le dont je
vous parle donc par exemple si vous
aviez appuyé sur dashboard
il suffit d’aller dans ensuite apparence
et ensuite menu et vous allez tomber sur
cette même sur cette même page
ça c’est un seul endroit que je préfère
pour pourrait effectivement faire des
changements au niveau du menu simplement
parce qu’en fait vous allez pouvoir
effectivement gérer de manière beaucoup
plus précise
le menu que vous allez faire apparaître
donc c’est beaucoup plus intéressant
de mon point de vue hockey nous ce qu’on
va faire c’est que je vais faire créer
un nouveau menu donc je vais taper tac
traîneau
je mets tous nos journaux tout court
créer un menu
ok donc ce menu typiquement là vous vous
voyez on peut le sélectionner et ici
vous avez ces crimes and navigation
donc c’est à dire principal la
navigation principal donc typiquement
moi je veux que ce menu que je vais
créer ça ça devienne le menu principal
le menu principal ça veut simplement
dire que il va s’afficher ici en fait
d’accord les menus il va y en avoir
plusieurs jours l’occasion de vous
montrer mais il peut y avoir par exemple
des menus donc qui vont être sur la page
principale
mais vous pouvez aussi avoir un menu top
navigation donc ça je vais vous montrer
de quoi il s’agit mais typiquement là
dans mon sur mon site
c’est quoi ça là vous voyez par exemple
à tout en haut ça c’est un menu top
navigation ok donc c’est aussi quelque
chose qui va falloir que je crée aussi
et puis y avoir aussi leurs doutes menu
par exemple pour le téléphone portable
parce qu’effectivement on on navigue pas
de la même façon quand on est sur
ordinateur ou quand on est sur téléphone
par conséquent c’est intéressant en fait
d’avoir un menu spécifique pour la
navigation
il peut y avoir aussi des choses au
niveau du 404 je vais pas rentrer dans
les détails et aussi au niveau du sticky
et d’heures navigation donc ça
typiquement c’est l’élément dont je vous
ai parlé tout à l’heure c’est quand vous
allez scrollé votre site web donc
descendre et ben typiquement il ya un
menu qui peut rester qui peut rester en
haut comme ça mais c’est pas encore le
cas puisque c’est pas encore paramétrer
mais c’est quelque chose que je vais
faire
ok alors ce qu’on va faire c’est que ça
va donc devenir mes navigations et ça va
devenir aussi sticky et de navigation
ok donc une fois que ça c’est fait je
fais simplement reprendre
balboni le menu que j’avais créé donc
ici donc ça va être donc être agencée
see you ensuite servi six formations et
blogs up alors ce qui serait plus
pratique en fait je réfléchis en même
temps je sais pas ce qui c’est ce qui
paraît le plus simple en fait
ok bon je vais je vais rester sur un son
quelque chose de simple dans un premier
temps donc je vais reprendre les il fait
simplement changer le texte du menu sans
vraiment changer les pages qui sont
derrière donc je n’étais là a ajouté au
menu par exemple et si room
c’est donc cette page principale qui est
par défaut donc typiquement donc j’ai
appuyé sur les yeux ou ajouté au menu
ensuite ce qu’on peut faire ici alors
[Musique]
1
[Musique]
c’est peut-être pas vraiment la
meilleure méthode que j’utilise
[Musique]
ok donc ce que je vais faire je marque
et donc je vais rajouter ici donc liens
personnalisés
de quoi marquer donc tous et nos points
comme est donc cette première
ce premier sa première chose ça sera ici
agences c’était l’agencé si haut que
j’ai marqué up alors l’agencé see you
effectivement et c’est en majuscules
menu up ensuite nokia services et
ensuite formation service
formation ensuite blog et enfin audit
gratuit ok donc je vais enregistrer et
vous allez voir ce que ça donne
donc là maintenant tu avec jules ferry
tout ça si je vais sur le site
voyez agence aici au service formation
blog audit gratuit
donc là maintenant on a effectivement un
menu qui est cohérent avec ce que j’ai
ici
ok donc ce que je vais faire c’est que
je souhaite que ce menu soit d’une autre
couleur donc pour ça je vais aller sur
havas d’année notamment sur thème option
mais vous allez vous voyez ici s’écrie
menu c’est ici en fait que vous allez
pouvoir gérer l’ensemble des
informations liées au design de votre
de votre menu ok alors tac même menu
donc ici l’art ya plusieurs choses que
vous pouvez faire vous pouvez changer
l’heure le padding c’est la distance ça
c’est pas très important ici mais le
menu chuck hayes corps non radius alors
donc ce qu’on va faire ici c’est quand
helm et en blanc comme comme ici est
donc ici au niveau des batailles pour
moi la taille je n’ai pas la modifier
seita donc voilà maintenant ça y est on
a quelque chose ici qui est en blanc
donc ce que je voudrais faire maintenant
c’est revenir changé ici met un bouton
de couleur donc pour cela faire que je
revienne sur apparence sur menu
et ensuite
ici sur leurs liens personnalisés
ensuite on va aller sur bada menu
options et là c’est différent options
que vous allez pouvoir rajouter donc là
par exemple ce qu’on va faire c’est que
vous pouvez rajouter effectivement alors
la taille du bouton dans la m par
exemple une taille bouton médium peut
aussi rajouter un petit icône ici et
ensuite alors là effectivement on peut
changer la couleur
donc cette couleur là c’est celle là hop
et on va mettre enregistré
hop donc voilà là maintenant on a
quelque chose qui ressemble à ça mais
d’ailleurs cette couleur me paraît un
peu un peu lives
un puffin des changements ici
ça
tant qu’il va fort que je change alors
c’est peut-être dans avatar thème option
alors couleurs tac on va changer ça et
on va mettre ça à la place
alors et d’heures leader contente c’est
parfait qu’on tombe dessus
donc là effectivement depuis le menu
donc comme j’ai eu l’occasion de vous
l’indiquer
vous avez la possibilité de choisir
différents types de menus qui vont
s’afficher
ok donc là par exemple pouvait avoir ce
pas là bas c’est celui ci pouvait avoir
ça celui là bref il y en a plusieurs et
donc en fonction de votre vos envies
bien évidemment vous allez pouvoir
choisir donc typiquement ça va
ressembler à celui ci ok alors bill au
contact info sochaux ding alors
navigation 2 alors téléphone up contact
twin au point comme on sauvegarde
ensuite background images de napa hideur
styling tac
sticky et d’heures hop là typiquement ça
c’est quelque chose qu’on va donc activé
qu’on va sauvegarder pour voir ce que ça
donne hop
donc vous voyez maintenant ici on a
cette partie là voilà alors
tu es souche holding voilà donc par
défaut take on a quelque chose comme ça
alors on est pas encore on n’a pas
encore la même chose mais on n’est pas
si loin
tech
alors tac et dub
remake de styling donc celui ci et dirt
à byron color donc on va rajouter ces
deux là hop et donc on va mettre ça ici
maintenant
ensuite pour celui là alors on va voir
si ça fonctionne bien
dac c’est ce col ici alors il doit
background color mollement c’est
celui-là sauvegarder ok on commence à
avoir quelque chose de mieux
la qui ressemble un peu plus de dix ans
là ce qui était prévu au départ
hop
alors ce que je cherche ce que je
cherche c’est au niveau des boutons
thème fitur 2010 non performance quasi
nation qui extra précis sochaux médias
[Musique]
typographie même menu
non c’est pas dans forme styling blafard
que je vérifie au niveau des le
changement de la couleur des du bouton
je sais plus où est ce que ça se trouve
dans la vie d’un background sidebar
footer sliding bar parc title longo et
de responsive bon c’est pas grave dans
l’immédiat c’est pas forcément le sait
pas forcément la priorité mais c’est un
élément qui a far que j’ai juste ici
voyons voir
et d’ailleurs c’est la même chose d’un
haut niveau de la taille hop
alors voyons voir
taquin menu menu
seconde étape menu contrôle take off
alors on va respecter exactement les
couleurs de mariana pour ne pas avoir du
souci tech
et donc au niveau de la taille là c’est
un peu petit alors la taille se font
fort peu tâtonné
enfin peu tâtonné donc là on est à 12
ça c’est vraiment petit donc on va
mettre ça et on remet ça à 15 10 ans
pour voir ce que ça donne
ok ce sens un peu mieux quand même
ok donc ça c’est pas mal
c’est pas mal donc là on a vraiment fait
la première partie de la fare faire 2-3
et justement au niveau des auteurs etc
mais là on déjà quelque chose qui est
quand même beaucoup plus beaucoup plus
ressemblants ce que je voudrais vérifié
par aktay tolba siding bas footer je
pense pas que ce soit un peu sa gym est
un je vais mettre cette couleur si
voilà c’est donc dans plusieurs builder
et lemond des fois c’est un peu cachée
dans la vanne a donc effectivement faut
chercher alors à l’animation blague
éléments bouton oil bouton alors
d’ailleurs la typo des boutons n’est pas
la bonne
par défaut donc ça c’est typiquement un
truc qui a fort que je change
alors donc on va mettre
ok c’est goudé a au niveau des boutons
attaque goûter à hockey et au niveau de
la couleur
on va faire les changements ici
hop maintenant si on fait sauvegarder
donc là ça
bien changer la couleur ici donc ça
c’est bien
[Musique]
parentis et ça change la couleur ça se
met en blanc c’est un élément aussi qui
a faim on corrige
mais avant ça je voudrais retourner sur
le menu
atteint
alors celui là à la dame venue
[Musique]
en voyant va peut-être qu’il faut je
retourne de nouveau sur à valdes à thème
option ensuite nous vous diffusions une
bulle terre
effectivement lorsque je veux la vidéo à
chaque fois ça ralentit vraiment
énormément le site
balleux manavit gassion alors bouton
[Musique]
les changements de couleurs bouton x en
colère non non alors c’est pas ici
hop
c’est peut-être dans fonte donc ça aide
à conthey nom et de dayron nom et de
style
alors c’est en tous les cas il faut que
je change
tec est d’abord de color ok ça lui fait
sauvegarder gens profitaient aussi pour
changer mon stick et odeurs hideur
hawking background tac et ça je vais le
mettre en blanc font size sixtine ça
c’est bien
renoir
qui
voyez le logo doré réduit un petit peu
je pense que c’est quelque chose qui est
pas forcément nécessaire alors sticky
and her
[Musique]
je mets ça off
ces bassins
logo mais me logo logo background
avec un mal
il faut faire des tests
ok bon je vais pas m’attarder là-dessus
peu longtemps maintenant ce que je vais
faire effectivement ça va être de ce
fait faire cette partie en dessous le
truc c’est que l’art vous est peut-être
l’occasion de le voir mais cette page
d’un trop en fait elle est bien le seul
truc que je lui reproche je suivais mon
point de vue ça ralentit un peu le
système voire beaucoup le système donc
pour ça ce que je vais faire c’est que
j’ai fait des modifications en fait donc
typiquement pour ça je me rende sur donc
modifier la page
non je vais pas faire ça en fait je vais
pas faire ça parce que ça m c’est ça va
être l’occasion de 500 dans une autre
vidéo
je sais pas si c’est ça gère le test
non pas du tout
donc ça c’est blanc c’était très bien en
blanc
ok mais pete docte telugu et de edel
sticky et de sticks et deurne tablettes
j’ai donc terminé
cette présentation alors comme vous avez
pu le voir effectivement créé un menu
sur wordpress techniquement c’est pas
quelque chose qui est extrêmement
compliqué moi ce que je vous recommande
vraiment c’est d’essayer d’avoir au
maximum une architecture en tête au
niveau de l’ensemble de votre site et
ensuite de faire en sorte de mettre en
place cette architecture au sein même de
votre menu
pourquoi simplement parce qu’en fait au
niveau de la navigation ça va vraiment
facilité les choses pour vos
utilisateurs pour vos visiteurs d’autant
plus que plus votre site finalement
redevenir gros et plus va y avoir du
contenu plus finalement ça va être
quelque chose d’essentiel d’avoir un
menu qui soit propre clean fluide
d’un point de vue de ce qu’on appelle
l’expérience utilisateur c’est un
élément qui est essentielle
allez à bientôt
