Page 1 sur 1

[tuto] Design - menu pour mobile/tablette

Publié : 24 févr. 2019, 00:09
par noodom
Bonsoir,

Je vous propose un menu simple pour mobile ou tablette facilement adaptable à ses besoins.
Il permet de se créer un menu rapidement et de le faire évoluer facilement.

Le rendu donne ceci :
menu.png
menu.png (872.06 Kio) Consulté 5706 fois
Pour l'adapter à son propre menu, il suffit de respecter les étapes suivantes :
- Copier menu.css dans /html/montheme (depuis le plugin "Outil de développement" par exemple)
- Si utilisation d'icônes perso.
-- Copier les images des icônes perso. dans /montheme/images
-- Créer la liste des icônes perso. en css /montheme/menu.css
-- Modifier les liens vers les icônes (ex : <i class="icon-design-jeedom"></i>)
- Si utilisation des icônes fontawesome standards
-- Modifier les liens vers les icônes (ex : <i class="fas fa-igloo"></i>)
(Liste des icônes disponibles ici : https://fontawesome.com/icons?d=gallery)
- Si pas d'utilisation des icônes fontawesome standards
-- Supprimer le lien vers font-awesome.min.css (pour alléger le chargement de la page)
- Dans le code HTML inséré dans le design :
-- Modifier l'arborescence du menu pour adapter le contenu à ses besoins
-- Pour chaque appel à "gotoPlan(XXX);", modifier XXX par l'identifiant de votre page Design cible.
-- Dans le mode Design, pour chaque page du menu, passer en mode édition, puis ajouter "Texte/html" puis copier/coller ce code HTML

Je n'ai pas mis les images pour chaque lien du menu pour ne pas alourdir le zip (mais elles doivent être récupérables depuis le post du menu F$B33)
menu.zip
(3.23 Kio) Téléchargé 232 fois

Re: [tuto] Design - menu pour mobile/tablette

Publié : 24 févr. 2019, 12:49
par romanais
Merci pour le partage, je mets ça de côté !

Re: [tuto] Design - menu pour mobile/tablette

Publié : 03 mars 2019, 11:28
par Nitroks
Bonjour Noodom,

Je n’ai pas réussi à intégrer le menu malgré les explications sur ton poste. J’ai indiqué les liens des icônes dans menu.css puis indiqué le lien de menu.css dans le html de la page design.
J’ai pourtant réussi avec celui de FB333!
Je n’arrive pas à voir ce qui ne va pas!


Envoyé de mon iPhone en utilisant Tapatalk

Re: [tuto] Design - menu pour mobile/tablette

Publié : 03 mars 2019, 15:54
par noodom
Nitroks a écrit :
03 mars 2019, 11:28
Bonjour Noodom,

Je n’ai pas réussi à intégrer le menu malgré les explications sur ton poste. J’ai indiqué les liens des icônes dans menu.css puis indiqué le lien de menu.css dans le html de la page design.
J’ai pourtant réussi avec celui de FB333!
Je n’arrive pas à voir ce qui ne va pas!


Envoyé de mon iPhone en utilisant Tapatalk
Salut Nitroks,

Peux-tu me donner plus de détails sur ce qui ne fonctionne pas pour comprendre plus précisément à quel endroit tu bloques pour l'intégration du menu ?

- Tu as bien créé un élément Design html/texte et recopié le contenu du html de mon design
- Tu as bien dans l'arborescence /html existante de Jeedom le fichier /montheme/menu.css et un répertoire /html/montheme/images (avec les images du menu)
- Tes fichiers ont les droits nécessaires (un glisser déposer par le plugin Outil de développement est suffisant)

Normalement, ces copier-coller devraient suffire à voir le menu (même avec des images manquantes)

Re: [tuto] Design - menu pour mobile/tablette

Publié : 10 mai 2019, 20:19
par neoloop
bonsoir

@noodom ce menu 'adapte tout seul en fonction d'un portable ou d'une tablette?
il ne faut pas faire deux design?

Re: [tuto] Design - menu pour mobile/tablette

Publié : 11 mai 2019, 02:40
par noodom
neoloop a écrit :bonsoir

@noodom ce menu 'adapte tout seul en fonction d'un portable ou d'une tablette?
il ne faut pas faire deux design?
Salut,

Une fois bien positionné en haut à gauche, le menu s'adapte normalement bien sur un mobile ou une tablette.
Il faut bien sûr que le nombre de cases (verticales ou horizontales) soit adapté à la taille de l'écran sinon ça risque de dépasser

tuto Design menu pour mobile/tablette

Publié : 29 oct. 2019, 07:05
par Stepanpus
Merci pour la réponse.
Jai installé un téléporteur sur mon TL cependant, le problème reste le même sauf que mes TS passent inactif une fois leurs soutes déchargées.
Je me contenterai donc de les relancer en manuel .
Si quelquun a une idée pour exploiter mon TL de meilleure manière je suis preneur.


<a href=https://prom-electric.ru/articles/1/1/>ремонт частотных преобразователей</a>