Point de rupture du mode tablette
Summary
TLDRDans cette vidéo, l'hôte présente une astuce pour gérer le point de rupture du mode tablette avec les thèmes FSE. Il remercie Daniel de l'avoir partagée et explique comment utiliser les paramètres réactifs de Spectra One pour masquer ou afficher des blocs en fonction du mode d'affichage. Il suggère également l'utilisation du plugin 'Bloc Visibility' pour un contrôle plus précis. L'objectif est de créer des blocs dédiés au mobile et au bureau, en dupliquant et en ajustant les paramètres de visibilité pour chaque mode. Cette technique permet d'améliorer l'esthétique du site sur les appareils mobiles.
Takeaways
- 🙌 Le tutoriel concerne l'optimisation du mode tablette avec les thèmes FSE.
- 👨🏫 L'astuce a été partagée par Daniel et sera expliquée par l'animateur.
- 🔍 Les thèmes FSE peuvent présenter des différences de comportement selon les menus utilisés en mode tablette.
- 📱 L'option de paramétrage responsive n'est disponible que pour certains thèmes, comme Spectra One.
- 🎨 Le thème par défaut de WordPress 2024 ne permet pas cette option de personnalisation.
- 🔍 Un plugin nommé 'Bloc Visibility' pourrait aider à gérer la visibilité des blocs sur différents appareils.
- 🛠️ L'objectif est de créer deux blocs distincts, l'un pour mobile et l'autre pour desktop.
- 🔄 Pour le menu desktop, il faut dupliquer le bloc existant et désactiver les modes tablette et mobile.
- 📲 Dans le bloc dédié au mobile, inverser les paramètres pour désactiver le mode desktop.
- ✅ Après enregistrement et actualisation du site, le menu hamburger s'active en mode tablette.
- 🌟 L'astuce est appréciée pour son impact esthétique et sa simplicité d'implémentation.
Q & A
Quel est le sujet principal de cette vidéo ?
-Le sujet principal de cette vidéo est la gestion du point de rupture du mode tablette avec les thèmes FSE (Full Site Editing) dans WordPress.
Qui a fourni l'astuce présentée dans la vidéo ?
-L'astuce a été fournie par Daniel, un utilisateur qui a partagé cette solution avec le créateur de la chaîne.
Que signifie le mode tablette dans le contexte de cette vidéo ?
-Dans ce contexte, le mode tablette fait référence à l'apparence et à la disposition du site Web lorsqu'il est affiché sur un appareil de taille intermédiaire comme une tablette.
Quels sont les thèmes FSE mentionnés dans la vidéo ?
-Le thème Spectra One a été mentionné comme étant celui utilisé pour tester la solution, et le thème par défaut de WordPress 2024 a été utilisé pour le comparatif.
Quel est le plugin mentionné pour résoudre le problème de visibilité des blocs ?
-Le plugin mentionné est 'Bloc Visibility', qui permettrait de contrôler l'affichage ou la non-affichage de certains blocs en fonction du dispositif utilisé.
Comment le créateur de la chaîne suggère-t-il de gérer le mode tablette avec les thèmes FSE ?
-Il suggère de créer deux blocs distincts, un pour mobile et un pour desktop, en utilisant les paramètres de réactivité du thème Spectra One pour contrôler l'affichage en fonction du dispositif.
Quels sont les avantages esthétiques mentionnés pour cette méthode de gestion du mode tablette ?
-L'avantage esthétique mentionné est que cette méthode permet d'éviter des menus qui se déroulent sur plusieurs lignes, offrant ainsi une meilleure apparence visuelle.
Quel est l'objectif de la duplication du bloc de navigation dans la vidéo ?
-L'objectif est de créer un bloc dédié au mode desktop et un autre au mode mobile, permettant ainsi une personnalisation spécifique pour chaque type d'appareil.
Comment désactive-t-on le mode tablette et le mode mobile pour le bloc de navigation desktop ?
-On va dans la partie paramètres du bloc de navigation du menu desktop, et on désactive l'option pour le mode tablette et le mode mobile.
Que signifie le terme 'responsive setting' dans le contexte de cette vidéo ?
-Le terme 'responsive setting' fait référence aux paramètres qui permettent aux éléments du site Web de s'adapter à différentes tailles d'écran, comme les appareils mobiles, tablettes et ordinateurs.
Quel est le résultat attendu après avoir appliqué l'astuce présentée dans la vidéo ?
-Le résultat attendu est que le menu hamburger sera automatiquement activé lorsque l'on passe en mode tablette, améliorant ainsi l'expérience utilisateur sur les appareils de taille intermédiaire.
Outlines
😀 Astuce pour les thèmes FSE et mode tablette
Dans ce premier paragraphe, l'animateur de la chaîne présente une astuce pour gérer le point de rupture du mode tablette avec les thèmes FSE. Il remercie Daniel pour l'astuce et explique que selon les menus utilisés, le passage en mode tablette peut être automatique, ce qui peut poser des problèmes. Il mentionne l'option 'responsive setting' qui est disponible uniquement avec le thème Spectra One et non avec le thème par défaut de WordPress 2024. Il suggère également l'utilisation d'un plugin appelé 'bloc visibility' pour gérer l'affichage des blocs en fonction du dispositif. L'objectif est de créer deux blocs distincts, un pour mobile et un pour desktop, en dupliquant le bloc existant et en ajustant les paramètres pour chaque mode d'affichage.
Mindmap
Keywords
💡Bonjour et bienvenue
💡Astuce
💡Thèmes FSE
💡Mode tablette
💡Réponsive setting
💡Thème Spectra One
💡Plugin Bloc Visibility
💡Menu navigation
💡Duplication de bloc
💡Mode bureau et mode mobile
💡Menu hamburger
Highlights
Introduction de la vidéo et remerciement à Daniel pour l'astuce partagée.
Problème rencontré avec les thèmes FSE et le changement de mode en tablette.
Explication de la différence de comportement selon les menus et le passage en mode tablette.
Mise en évidence de la fonctionnalité 'responsive setting' spécifique au thème Spectra One.
Test de la fonctionnalité avec le thème par défaut de WordPress 2024 sans option responsive.
Mention d'un plugin 'Bloc Visibility' pour gérer la visibilité des blocs en fonction du mode d'affichage.
Description de l'objectif de créer des blocs dédiés au mobile et au bureau.
Démonstration de la duplication d'un bloc pour adapter l'affichage sur différents appareils.
Étapes pour désactiver les modes tablette et mobile dans le premier bloc du menu bureau.
Instructions pour activer uniquement le mode bureau dans le deuxième bloc dupliqué.
Enregistrement des modifications et vérification de l'apparence du site après rafraîchissement.
Affichage du menu hamburger lors du passage en mode tablette.
Appréciation de l'astuce pour son impact esthétique sur la présentation du menu.
Conclusion de la vidéo avec une invitation aux prochaines tutorielles.
Merci et au revoir à la fin de la vidéo.
Transcripts
bonjour et bienvenue sur ma chaîne
aujourd'hui une astuce concernant le
point de rupture du mode tablet avec les
thèmes fseux tout d'abord je tiens à
remercier Daniel qui m'a donné cette
astuce et que je vais partager avec vous
si vous utiliseer les thèmes FSE vous
avez pu remarquer selon les menus qu'on
utilise que quand on passe en mode
tablette
queon passe mode le mod
menutomatiement qui passe en mode
classiqueut pass
j donc
pour problème on
composition en tête on va chercher notre
menu on va éditer notre bloc
navigation qui est ici alors dans la
partie paramètres ici on peut constater
qu'on a un responsive setting donc cette
option là n'est active uniquement avec
le thème spectra one j'ai fait le test
avec le thème par défaut de WordPress
2024 cette option n'est pas activée donc
en fonction du thème que vous utilisez
vous pouvez ne avoir ou ne pas avoir ce
type d'option qui vous permet de masquer
les blocs pour info je sais qu'il existe
un plugin qui s'appelle bloc visibility
que je n'ai pas testé qui permettra
apparemment de de pasalier à ce problème
qui permettrait d'afficher ou de ou de
ne pas afficher certains blocs donc d'ù
ce qui va nous intéresser c'est la
partie spectra one puisque c'est le
thème principal que j'utilise et vous
montrer comment jongler sur ce type
d'affichage donc là l'objectif ça va
être de créer un deuxième bloc un qui
sera dédié au mobile et un autre qui
sera dédié au desktop donc là on peut
choisir par exemple avoir trois barres
plutôt qu'une plutôt que deux et ici
l'objectif ça va être de dupliquer notre
bloc
voilà comme ceci on va reprendre le
premier donc on a bien nos deux blocs
dans la partie qu'on va considérer comme
notre menu desktop on va tout simplement
désactiver le mode tablette et le mode
mobile après on se dirige dans la
deuxième
partie menu navigation qu'on a dupliqué
et là on va faire l'inverse on va tout
simplement désactiver le mode Desktop et
là on lui dit
toujours on enregistre
on va sur la partie site on actualise et
là logiquement dès qu'on passe en mode
tablette le menu hamburger est
activé voilà pour cette astuce que je
trve vraiment génial parce que
esthétiquement c'est quand même beaucoup
plus joli que d'avoir un menu qui passe
sur de lignes je vous dis à très bientôt
pour de nouveaux tutos merci au revoir
Voir Plus de Vidéos Connexes
Cette technique de Prompt va te faire gagner beaucoup de temps (ChatGPT, Mistral, Claude, Llama...)
Actuelburo - Démonstration du projecteur interactif Epson EB-685WI - Easy interactive tools.
Comment FILMER une INTERVIEW professionnelle
Fixed price VS Agile (time material) approach
Paramétrer XAMPP pour envoyer des mail en PHP et avec un serveur local
Elementor gratuit réglez vos photos en un clic
5.0 / 5 (0 votes)