Tutoriels de Deuxième degré

Les tutoriels de niveau 2 sont accessibles lorsque l’on utilise Elementor régulièrement. Ils concernent l’ajout de fonctionnalités ou l’utilisation avancée de wordPress avec Elementor.

Parmi tous les Widgets d'Elementor, le CTA fait partie des outils essentiels du Web design. Sa puissance est au service de votre design. Découvrez-le ici.
Aujourd'hui c'est travaux pratiques. Nous allons nous inspirer d'un grand site en ligne, celui d'Apple, pour reproduire une des sections de sa page d'accueil.
Le tutoriel de ce jour va vous apprendre à créer vos propres statistiques pour en savoir plus sur vos utilisateurs.
Réalisons ensemble une Boite Image avec un effet au survol. Vous allez voir c'est relativement simple.
Voyons comment faire pour afficher un Titre dans une pastille circulaire à l'aide de quelques instructions CSS et d'Elementor Pro.
Ce tutoriel vous montre comment appliquer un dégradé CSS sur une image mise en place avec Elementor.
L'utilisation des pseudo-éléments combinée à Elementor nous offre des possibilités intéressantes en matière d'animation et de manipulation. C'est ce que nous allons découvrir dans ce tutoriel.
Avec l’aide de deux extensions gratuites (ACF – Advanced Custom Fields et CPT UI – Custom Post Type User Interface), nous allons voir comment ajouter un nouveau type de données.
En travaillant avec Elementor on rajoute une surcouche à WordPress. Pour éviter de multiplier les allers-retours entre les pages et le tableau de bord, apprenez à utiliser les raccourcis Clavier.
Nous allons dans ce tutoriel ajouter la possibilité de gérer des colonnes de largeur supérieure à100% en mode Ordinateur.
Avec l'aide d'un formulaire WordPress et d'Elementor Pro, nous allons transmettre des données entre deux pages différentes. Une méthode qui ouvre un grand champs d'applications.
Affichez des boutons en fonction du Scroll de la page. Un Tutoriel CARBONNEL MEDIA
Dupliquer une page avec Elementor sur le même site est une opération simple. Pour l'effectuer entre deux installations wordPress, c'est plus compliqué. C'est ce que nous allons voir ici.
Animer un objet à l'écran permet de capter l'attention des visiteurs. En terme d'expérience utilisateur c'est un moyen très intéressant pour suggérer une action à effectuer et s'assurer qu'elle ne passera pas inaperçue.
Par défaut, Elementor limite la largeur d'affichage à la largeur de l'écran, ce qui interdit d'avoir des contenus qui scrollent horizontalement. C'est ce comportement que nous allons changer avec ce tutoriel.
Créer un site internet consiste à créer d'une part du contenu et d'autre part des modèles qui seront utilisés pour les afficher. C'est le schéma de fonctionnement de wordPress notamment.
Dans ce tutoriel de troisième degré, nous allons créer une Popup window qui va nous servir pour notre menu principal. C'est une façon originale de personnaliser la navigation d'un site internet.
Ajoutez des ancres à vos boutons, vos liens ou vos éléments de menu pour pouvoir naviguer à un endroit précis sur la même page ou sur n'importe quelle autre page de votre Site Internet.
L'utilisation des boutons en Web Design est très fréquentes. Cependant on ne personnalise pas assez ces composants indispensables. et bien apprenez-à le faire avec Elementor.
Il est parfois intéressant de pouvoir dé-synchroniser le contenu de ses colonnes. C'est le scrolling asynchrone. Il permet de visualiser simultanément des contenus de longeurs différentes. Il vous faudra Elementor Pro pour réaliser ce tutoriel.
Travailler en mode Responsive avec Elementor implique une organisation et une méthodologie claire et structurée. Soit en commençant par le Web design en mode Smartphone (Mobile First), soit en s'accordant plus de possibilités et en commençant par le mode Desktop.
Ce tutoriel vous guide pas à pas vers la réalisation d'une image masquée par un texte. La couleur de fond du texte sera donc l'image elle-même. Un effet bluffant qui mettra vos titres en valeur.
Pour illustrer les tutos précédents relatifs aux unités du Web design et à l’utilisation des Widgets ainsi qu’aux paramètres de positionnements personnalisés, je vais vous expliquer pas à pas la création d’un nouveau Widget que nous appellerons Widget Portfolio.
Chaque élément sous Elementor possède son propre conteneur. Une image est insérée dans un conteneur, un texte aussi, … Par défaut lorsque l’on insère un élément dans une colonne, il occupe 100% de la largeur de la colonne.
Utiliser les outils du Web design, c’est aussi connaître les unités qui serviront à placer, positionner et à dimensionner les différents éléments de votre Web design. Sur Internet deux types d’unités existent. Les unités absolues et les unités relatives.
Comment afficher une image dans un cercle avec WordPress et Elementor? Une méthode simple et efficace.

Pas de compte ?