Avant de vous lancer, vous aurez besoin de l’extension Make Section & Column Clickable Elementor.
Créer un Header et un Footer personnalisés avec Elementor Header & Footer Builder
Un entête personnalisé avec l’extension Elementor Header, Footer & Blocks
Afficher un carrousel d’Articles sur la page d’accueil avec Livemesh for Elementor
Pour rendre la page d’accueil plus dynamique, on peut appeler des Articles dessus, les dernières actualités par exemple. Ici, un carrousel fait défiler les 9 derniers articles classés dans la catégorie Programmation. Pour filtrer les contenus à afficher, on doit définir la « taxonomie » : ce terme regroupe les catégories et les étiquettes.
Afficher une grille d’Articles dans une Page avec Livemesh for Elementor
Les Catégories de thèmes affichent souvent en titre « Archive de la catégorie : … ». Pas très esthétique ! Avec l’extension Livemesh Addons for Elementor, on peut appeler des listes d’articles dans le contenu d’une Page, et ainsi afficher du contenu en plus (texte d’introduction, sous-titres, images…). Pour filtrer les articles à afficher, on sélectionne la […]
Classe CSS dans Elementor
Apparence > Personnaliser > CSS Additionnels On peut ajouter une classe CSS à n’importe quel élément dans Elementor (section, colonne, outil), puis lui donner des instructions en CSS personnalisé. Ainsi, plutôt que de customiser à chaque fois l’apparence d’un élément récurrent, on lui ajoute simplement une classe.
Image en arrière-plan / Modifier un modèle – Elementor
2 étapes dans cette vidéo :• Modifier un modèle créé avec Elementor.• Mettre une image en arrière-plan d’une colonne. À noter : lorsqu’on modifie un modèle Elementor, la mise à jour ne se fait pas automatiquement sur les articles/pages dans lequel il a déjà été inséré. Il faudra aller les modifier « manuellement » ou insérer à […]
Article & Modèle – Elementor
3 étapes dans cette vidéo :• créer un Article en spécifiant catégorie, image mise en avant, extrait…• créer une mise en page avec Elementor et l’enregistrer en Modèle• appliquer ce Modèle à un nouvel Article
Forme de découpe / Séparation – Elementor
Dynamiser vos sections en créant des formes de découpes. À noter : cette option de Style est disponible uniquement pour les Sections.
Animation des éléments – Elementor
Chaque élément peut être animé par section entière, colonne entière, ou individuellement. Attention quand même à ne pas en faire trop, ici c’est pour l’exemple 😉
Les boutons – Elementor
Dans les options du lien (la petite roue à droite du champ Lien), on peut choisir : • d’ouvrir le lien dans une nouvelle fenêtre, si on envoie vers un autre site.• d’appliquer un No Follow sur le bouton : dans Google Analytics, tous les clics sur les boutons du site sont comptabilisés. Si ce […]
Les images – Elementor
Pense-bête sur les images :• nommer son fichier sans accents ni espace.• optimiser la taille et le poids du fichier dans Photoshop ou Photopea• renseigner le Texte alternatif/Alt pour rendre votre image accessible et améliorer son référencement.
Ajouter une vidéo en pleine largeur – Elementor
Dans les réglages d’affichage de la vidéo :• Si on choisit la lecture automatique, mettre le son en Muet.• Penser que sur Youtube, une liste de vidéos suggérées sont proposées à la fin.
Modifier le titre de la page – Elementor
Ici on modifie le titre de la page, ou de l’article, qui est normalement géré par le thème. Il faut donc le masquer dans les réglages, et penser à le remplacer par un titre H1.
Créer une section de 2 colonnes – Elementor
Premiers pas avec Elementor : créer une section en 2 colonnes avec titre et texte.