Modifier le "Burger Menu" version AwesomeBB

[lleflohic]

Détails techniques

Version du forum : AwesomeBB
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome, Internet Explorer, Opera, Safari
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://apeml.forumactif.com

Description du problème

Bonjour,

Ce problème est relatif à la version AwesomeBB principalement.

Je souhaiterais pouvoir modifier le "burger menu" depuis le panneau d'administration. En effet, il n'est pas possible de le faire avec cette version AwesomeBB, l'option "En-tête & navigation" n'existant pas avec cette version en raison "de contraintes techniques qui empêchent de faire fonctionner cette option correctement" (réponse d'un admin sur ce post ici https://forum.forumactif.com/t398380-disparition-de-l-en-tete-navigation-version-awesomebb?nid=1#3327463).

Il m'a également recommandé de demander l'avis à la communauté, ce que je fais dans ce post.

En attendant d'avoir éventuellement cette option active via le panneau d'administration, auriez-vous une solution temporaire (via css) à me suggérer ?

Je vous remercie de m'avoir lu jusqu'ici.

[*Splash*]

Hi,

Une simple question, qu'entends-tu par le "burger menu" ?

[lleflohic]

C’est le menu déroulant en haut à gauche de la page d’accueil représenté par un icone avec 3 traits horizontaux qui permet d’accéder aux différentes pages du forum (Accueil, Publications, Contact, Connexion, etc).

[Adam_sfp]

Bonsoir

Je ne connais pas trop Awesomebb mais au vue de la réponse  "de contraintes techniques qui empêchent de faire fonctionner cette option correctement" peut être trouver une solution temporaire...

En ce qui concerne le menu burger
Pour le modifier il faudrait y avoir accès et je ne sais pas si c'est possible ..

il fonctionne au niveau icone avec material icon https://material.io/tools/icons/?style=baseline

Vous pouvez d'ailleurs en profiter pour utiliser tous les icones disponibles sur votre forum.
Après je ne sais pas quelle modification vous voulez apporter... couleurs ? ordre ? ajouter des liens supplémentaires ?

Une solution serait peut être de cacher le burger actuel de chez M. d.... et le remplacer par un burger de B..... K...  

et créer votre propre menu..selon votre gout..et vos couleurs ..

De mon coté je n'est pas d'autres solution pour le modifier..

Par contre si vous voulez ajouter des icones sur votre forum et les personnaliser
Vous pouvez comme expliqué sur le guide du site ajouter une partie html

Code:

<i class="material-icons orange600">face</i>

et du coup pouvoir modifier la class
et ensuite mettre la partie CSS ( pour changer la couleur )

Code:

.material-icons.orange600 { color: #FB8C00; }

Cdt.

[lleflohic]

Après je ne sais pas quelle modification vous voulez apporter... couleurs ? ordre ? ajouter des liens supplémentaires ?

Merci de votre réponse et de votre aide. La couleur et les icônes m'importent peu pour le moment, même si ça pourrait être utile à terme de pouvoir les modifier.

Je souhaiterais en priorité pouvoir modifier le nom des items du burger menu, ainsi que leur ordre d'apparence, mais surtout pouvoir rajouter des items supplémentaires qui renvoient vers des pages html de mon forum que j'ai créées.

C'est pourtant quelque chose qui devrait être basique pour ce type de fonction, j'ai du mal à comprendre ce qui serait techniquement compliqué de pouvoir passer en paramètre le nom des items et leur ordre dans un menu.
J'ai fait un peu de code dans un passé pas si lointain mais je n'ai juste pas les compétences pour aller modifier le code du css par moi-même.

[Adam_sfp]

Bonjour

Si FA à procéder de cette manière il y surement une raison sinon je pense qu'il aurait mis la possibilité de modifier ce menu à votre guise.. Et ce menu n'est pas si basique que ça et parfois on ne se rend pas compte de tout ce qui est derrière pour le faire fonctionner... ( En Général FA essaie quand même de vous simplifiez les choses tout en ajoutant de nouvelles options en fonction de l'évolution du Web... )

Pour votre demande via CSS on peut modifier l'apparence de ce menu couleurs tailles etc...
Pour ce qui est de changer les noms ou l'ordre et d'ajouter des liens peut être une solution via script mais comme dit plus haut je ne connais pas cette nouvelle version..

Si rajouter des liens vers des pages HTML est votre priorité à votre place j'ajouterai un petit menu supplémentaire destiné à cette fonction... et on pourra vous aider à le mettre en place si nécessaire  

Cdt.

[Chacha]

Bonjour, Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[lleflohic]

Bonjour,

Merci @Adam_sfp de votre réponse et de votre proposition d'aide par rapport à mon problème de burger !
Rajouter un menu supplémentaire pour surcharger le menu existant n'est pas forcément une bonne option pour mon forum. Cela risque de perturber les utilisateurs et de surcharger l'interface pour pas grand chose.
Mes utilisateurs ne sont pas forcément des habitués des forums de discussion et plus je leur rajoute des choses sur l'interface, plus ça complique leur navigation et ils finissent souvent par s'y perdre. C'est l'une des raison pour laquelle j'ai décidé de passer sur la version AwesomeBB qui me semble un peu plus épurée et un peu plus adaptée pour ce type d'utilisateurs non avertis.

A la limite, cacher ce burger menu pour en mettre un autre à la place, ça peut éventuellement se tenter si ça ne casse pas trop le côté esthétique de cette version.
Vous sauriez m'indiquer comment procéder étape par étape pour faire ça ?

Merci d'avance.

[Invité]

Hello lleflohic,

si c'est le burger en haut à gauche ce style fonctionnera:

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:


#main-menu-btn i.material-icons{font-size:0px;}
#main-menu-btn i.material-icons:after
{
content:'';
/*LE LIEN DE L IMAGE*/
background:url(https://i.servimg.com/u/f87/11/26/21/37/zoom-i11.png);
/*LA LARGEUR DE L IMAGE*/
width:48px;
/*LA HAUTEUR DE L IMAGE*/
height:48px;
position:absolute;
/*ON POSITIONNE L IMAGE*/
margin:-24px 0px 0px -24px;
}



Penses à cliquer sur le bouton


a++

[Chacha]

Bonjour, Attention, cela fait 7 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[Chacha]

Bonjour, Nous n'avons plus de nouvelle de l'auteur de ce sujet depuis plus de 8 jours. Nous considérons donc ce problème comme résolu ou abandonné. La prochaine fois, merci de nous tenir au courant de l'évolution de votre problème, ou pensez à faire un UP régulièrement ! Ce sujet est archivé afin de ne pas perdre les réponses apportées.