Thèmes Shopify, Liquid, logos et autres sujets similaires
Bonjour
j'utilise actuellement le thème gratuit Venture, et je voulais savoir si il était possible de mettre le menu du haut "collant" pour mobile
si quelqu'un sais comment faire ?
merci d'avance
Hello,
Je vous propose une solution en CSS.
Cependant je vous invite à faire une copie de votre thème avant toute intervention - Boutique en ligne - Actions - Dupliquer le thème - comme cela en cas de soucis vous pourrez revenir à cette version non modifiée.
Rendez-vous dans Boutique en ligne - Actions - Modifier le code - Ouvrez le dossier Assets et trouvez le fichier theme.scss.liquid
Mettez vous tout en bas du fichier et copiez/collez le code suivant:
@media only screen and (max-width: 750px) {
body {
padding-top:62px !important;
}
.site-header {
position:fixed;
top:0;
z-index:1;
}
}
Adaptez le 62px à la hauteur en pixel de votre header en mobile. Si vous ne la connaissez pas adaptez au pif jusqu'à trouver le bon décalage.
Je rappelle que de passer le menu en fixed va mettre vos header par dessus les éléments il faut donc mettre ce padding-top sur le body pour reproduire cet espacement.
Cela pourrait être calculé automatiquement en Javascript mais cette solution serait plus complexe.
Bon courage et bonne année 🙂
Hello,
Je vous propose une solution en CSS.
Cependant je vous invite à faire une copie de votre thème avant toute intervention - Boutique en ligne - Actions - Dupliquer le thème - comme cela en cas de soucis vous pourrez revenir à cette version non modifiée.
Rendez-vous dans Boutique en ligne - Actions - Modifier le code - Ouvrez le dossier Assets et trouvez le fichier theme.scss.liquid
Mettez vous tout en bas du fichier et copiez/collez le code suivant:
@media only screen and (max-width: 750px) {
body {
padding-top:62px !important;
}
.site-header {
position:fixed;
top:0;
z-index:1;
}
}
Adaptez le 62px à la hauteur en pixel de votre header en mobile. Si vous ne la connaissez pas adaptez au pif jusqu'à trouver le bon décalage.
Je rappelle que de passer le menu en fixed va mettre vos header par dessus les éléments il faut donc mettre ce padding-top sur le body pour reproduire cet espacement.
Cela pourrait être calculé automatiquement en Javascript mais cette solution serait plus complexe.
Bon courage et bonne année 🙂
Hello,
Je vous propose une solution en CSS.
Cependant je vous invite à faire une copie de votre thème avant toute intervention - Boutique en ligne - Actions - Dupliquer le thème - comme cela en cas de soucis vous pourrez revenir à cette version non modifiée.
Rendez-vous dans Boutique en ligne - Actions - Modifier le code - Ouvrez le dossier Assets et trouvez le fichier theme.scss.liquid
Mettez vous tout en bas du fichier et copiez/collez le code suivant:
@media only screen and (max-width: 750px) {
body {
padding-top:62px !important;
}
.site-header {
position:fixed;
top:0;
z-index:1;
}
}
Adaptez le 62px à la hauteur en pixel de votre header en mobile. Si vous ne la connaissez pas adaptez au pif jusqu'à trouver le bon décalage.
Je rappelle que de passer le menu en fixed va mettre vos header par dessus les éléments il faut donc mettre ce padding-top sur le body pour reproduire cet espacement.
Cela pourrait être calculé automatiquement en Javascript mais cette solution serait plus complexe.
Bon courage et bonne année 🙂
Utilisateur | CLASSEMENT |
---|---|
3 | |
2 | |
2 | |
2 | |
2 |
La création d'une entreprise peut s'avérer difficile. Il y a beaucoup de choses à mettre e...
By Océanne Nov 29, 2023Le Black Friday Cyber Monday (BFCM), ou Vendredi Fou et Cyber Lundi, 2023 se profile à l'h...
By Océanne Oct 18, 2023Cet article de blog est un récapitulatif du webinaire Se préparer à BFCM : Comment lanc...
By Jacqui Oct 11, 2023