[Réglé] Ajouter des boutons de navigation

Pour les recherches et les demandes de modifications de styles concernant votre forum phpBB 3.2

Modérateur: Equipe

Règles du forum
A lire impérativement : Règlement de phpBB-fr.com - Conditions générales de support graphique

Attention : pour éviter les bogues, votre style doit être mis à jour en même temps que votre forum, et ce, dans la dernière version disponible de phpBB !

[Réglé] Ajouter des boutons de navigation

Messagepar redway » 05 Juil 2017 à 04:57

Bonjour à tous

Je souhaiterais ajouter des boutons de navigation sous la bannière.

Si vous avez une idée...Elle sera la bienvenue :mrgreen:

Merci beaucoup

@+

François

P.S : J'ai hésité à poster ici ou dans la rubrique Graphisme :roll:
Modifié en dernier par redway le 11 Juil 2017 à 05:13, modifié 1 fois.
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar cabot » 05 Juil 2017 à 09:01

Hello,

Tu peux installer cette extension.
Si tu veux quelque chose de plus personnalisé, donne-moi un exemple pour que je te donne la marche à suivre directement dans le style.
Avatar de l’utilisateur
cabot
Equipe site
Equipe site
 
Messages: 26843
Enregistré le: 13 Fév 2011 à 19:42
Localisation: Rarement sur la plaque

Re: Ajouter des boutons de navigation

Messagepar redway » 05 Juil 2017 à 16:44

Bonjour Cabot,

Oui en effet, car je suis en train de mettre le style de mon forum à jour(3.2.0). Et je souhaiterais conserver ces boutons de navigations. Ceux qui sont situé sous la bannière en haut de page (Site, profil etc...)

C'est ici : http://www.techsmith-info.com/forum/

Merci beaucoup pour l'aide

@+

Redway :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar cabot » 06 Juil 2017 à 12:07

Et quelque chose comme ça, histoire de changer un peu tout en gardant l'esprit du menu ?

Image
Avatar de l’utilisateur
cabot
Equipe site
Equipe site
 
Messages: 26843
Enregistré le: 13 Fév 2011 à 19:42
Localisation: Rarement sur la plaque

Re: Ajouter des boutons de navigation

Messagepar redway » 06 Juil 2017 à 12:20

Bonjour Cabot

Oui, cela me va aussi :D

Merci beaucoup à toi

@+

François :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar cabot » 06 Juil 2017 à 18:45

C'est parti ! :P

Ouvre navbar_header.html

Trouve :
Code: Tout sélectionner
							<li>
								<a href="{U_SEARCH_SELF}" role="menuitem">

Remplace par :
Code: Tout sélectionner
							<li class="responsive-show-inline" style="display: none;">
								<a href="{U_SEARCH_SELF}" role="menuitem">

Trouve :
Code: Tout sélectionner
							<li>
								<a href="{U_MEMBERLIST}" role="menuitem">

Remplace par :
Code: Tout sélectionner
							<li class="responsive-show-inline" style="display: none;">
								<a href="{U_MEMBERLIST}" role="menuitem">

Trouve :
Code: Tout sélectionner
		<li <!-- IF not S_USER_LOGGED_IN -->data-skip-responsive="true"<!-- ELSE -->data-last-responsive="true"<!-- ENDIF -->>
			<a href="{U_FAQ}" rel="help" title="{L_FAQ_EXPLAIN}" role="menuitem">

Remplace par :
Code: Tout sélectionner
		<li class="responsive-show-inline" style="display: none;"<!-- IF S_USER_LOGGED_IN -->data-skip-responsive="true"<!-- ELSE -->data-last-responsive="true"<!-- ENDIF -->>
			<a href="{U_FAQ}" rel="help" title="{L_FAQ_EXPLAIN}" role="menuitem">

Trouve :
Code: Tout sélectionner
						<li>
							<a href="{U_PROFILE}" title="{L_PROFILE}" role="menuitem">

Remplace par :
Code: Tout sélectionner
						<li class="responsive-show-inline" style="display: none;">
							<a href="{U_PROFILE}" title="{L_PROFILE}" role="menuitem">

Trouve :
Code: Tout sélectionner
						<li>
							<a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x" role="menuitem">

Remplace par :
Code: Tout sélectionner
						<li class="responsive-show-inline" style="display: none;">
							<a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x" role="menuitem">

Trouve :
Code: Tout sélectionner
		<!-- IF S_DISPLAY_PM -->
			<li class="rightside" data-skip-responsive="true">

Remplace par :
Code: Tout sélectionner
			<li class="rightside responsive-show-inline" style="display: none;" data-skip-responsive="true">
				<a href="{U_PRIVATEMSGS}" role="menuitem">

Trouve :
Code: Tout sélectionner
		<li class="rightside"  data-skip-responsive="true">
			<a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x" role="menuitem">

Remplace par :
Code: Tout sélectionner
		<li class="rightside responsive-show-inline" style="display: none;" data-skip-responsive="true">
			<a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="x" role="menuitem">

Trouve :
Code: Tout sélectionner
			<li class="rightside" data-skip-responsive="true">
				<a href="{U_REGISTER}" role="menuitem">

Remplace par :
Code: Tout sélectionner
			<li class="rightside responsive-show-inline" style="display: none;" data-skip-responsive="true">
				<a href="{U_REGISTER}" role="menuitem">

Ajoute à la fin du fichier :
Code: Tout sélectionner
<div class="menuboutons responsive-hide">	
	<ul class="forabg ul-menu">
		<li class="menu-site"><a href="#"><i class="icon fa-home fa-fw"></i>Site</a></li>
		<li class="menu-aide"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}"><i class="icon fa-question-circle fa-fw" aria-hidden="true"></i>{L_FAQ}</a></li>
		<!-- IF not S_IS_BOT and S_DISPLAY_MEMBERLIST --><li class="menu-membres"><a href="{U_MEMBERLIST}"><i class="icon fa-group fa-fw" aria-hidden="true"></i>{L_MEMBERLIST}</a></li><!-- ENDIF -->
		<!-- IF S_REGISTERED_USER -->
			<li class="menu-profil"><a href="{U_PROFILE}" title="{L_PROFILE}"><i class="icon fa-sliders fa-fw" aria-hidden="true"></i>{L_PROFILE}</a></li>
			<!-- IF S_DISPLAY_PM --><li class="menu-mp"><a<!-- IF S_USER_NEW_PRIVMSG --> class="nouveauxmp"<!-- ENDIF --> href="{U_PRIVATEMSGS}"><i class="icon fa-inbox fa-fw" aria-hidden="true"></i>MP<!-- IF S_USER_UNREAD_PRIVMSG --><span>{PRIVATE_MESSAGE_COUNT}</span><!-- ENDIF --></a></li><!-- ENDIF -->
			<!-- IF S_DISPLAY_SEARCH --><li class="menu-searchself"><a class="search_self" href="{U_SEARCH_SELF}" title="{L_SEARCH_SELF}"><i class="icon fa-file-o fa-fw" aria-hidden="true"></i>{L_SEARCH_SELF}</a></li><!-- ENDIF -->			
			<li class="menu-connexion"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}"><i class="icon fa-power-off fa-fw" aria-hidden="true"></i>{L_LOGIN_LOGOUT}</a></li>
		<!-- ELSE -->
			<!-- IF S_REGISTER_ENABLED and not (S_SHOW_COPPA or S_REGISTRATION) --><li class="menu-inscription"><a href="{U_REGISTER}"><i class="icon fa-pencil-square-o fa-fw" aria-hidden="true"></i>{L_REGISTER}</a></li><!-- ENDIF -->
			<li class="menu-connexion"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}"><i class="icon fa-power-off fa-fw" aria-hidden="true"></i>{L_LOGIN_LOGOUT}</a></li>
		<!-- ENDIF -->
	</ul>
</div>

Ajoute dans ton fichier CSS perso :
Code: Tout sélectionner
/* Barre de navigation sous la navbar
--------------------------------------------------- */
.menuboutons {
	text-align: center;
	margin-top: 10px;
}

.ul-menu {
	border: 3px solid #fff;
	border-radius: 10px;
	box-shadow: 0 0 4px 1px rgba(128, 128, 128, 0.44);
	display: inline-block;
	padding: 0;
}

.ul-menu li {
	float: left;
	list-style: none;
}

.ul-menu a {
	font-weight: bold;
	font-family: arial, sans-serif;
	color: #fff;
	text-decoration: none;
	position: relative;
	border-left: 1px solid rgba(182, 182, 182, 0.4);
	border-right: 1px solid rgba(87, 87, 87, 0.25);
	display: block;
	font-size: 1.1em;
	padding: .6em;
	text-shadow: 0 1px 1px #696969;
}

.ul-menu .icon:before {
	padding-right: 6px;
}

.ul-menu li:first-child a {
	border-left: 0;
}
.ul-menu li:last-child a {
	border-right: 0;
}

.ul-menu a:hover {
	text-shadow: -1px -1px rgba(94, 94, 94, 0.75);
}

.menu-mp span {
	font-size: 9px;
	position: absolute;
	right: 2px;
	top: -1px;
}

a.nouveauxmp {
	color: #9e0909;
}
Avatar de l’utilisateur
cabot
Equipe site
Equipe site
 
Messages: 26843
Enregistré le: 13 Fév 2011 à 19:42
Localisation: Rarement sur la plaque

Re: Ajouter des boutons de navigation

Messagepar redway » 10 Juil 2017 à 15:22

Bonjour Cabot

Un grand merci pour ton aide avec mes excuses pour ma réponse tardive, mais cela fait toujours du bien de lever le pied :mrgreen:

Par contre, il n'y a pas un lien pour telecharger les boutons?

Je m'en vais tester cela dans la semaine et je te fais un retour si besoin :D

@+

François :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar cabot » 10 Juil 2017 à 16:28

Pas besoin d'images, le menu est créé en CSS et s'affiche automatiquement dans la couleur dominante utilisée sur la liste des forums.
Avatar de l’utilisateur
cabot
Equipe site
Equipe site
 
Messages: 26843
Enregistré le: 13 Fév 2011 à 19:42
Localisation: Rarement sur la plaque

Re: Ajouter des boutons de navigation

Messagepar redway » 10 Juil 2017 à 17:13

Re bonjour

Merci beaucoup Cabot,

Je vais tester cela :mrgreen:

Je te souhaite une bonne fin de journée

@+

François :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar redway » 12 Juil 2017 à 04:59

Hello Cabot

Cela commence mal, j'ai du louper quelque chose car je ne trouve pas navbar_header.html (Je suis bien en version 3.2.0)

Petite question, tu veux dire quoi par "Css perso"?

Dans l'attente de te lire

@+

François :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17

Re: Ajouter des boutons de navigation

Messagepar cabot » 12 Juil 2017 à 08:23

Tu dois avoir un style utilisant l'héritage, il faut faire une copie du fichier navbar_header.html du style parent.

redway a écrit:Petite question, tu veux dire quoi par "Css perso"?

=> Créer un style phpBB 3.1. ou phpBB 3.2
Avatar de l’utilisateur
cabot
Equipe site
Equipe site
 
Messages: 26843
Enregistré le: 13 Fév 2011 à 19:42
Localisation: Rarement sur la plaque

Re: Ajouter des boutons de navigation

Messagepar Mazeltof » 12 Juil 2017 à 08:25

'jour ici,

Si tu as créé ton propre style pour apporté toutes tes modification ?

  • Copie le fichier navbar_header.html de prosilver/template/ vers ton_style/template/ (s'il n'y est pas) et apporte tes modifications sur cette copie.

  • Ta CSS perso est le fichier.css du style que tu as créé. (generalement style_perso.css)

Si non, vérifie que tu es bein sur la version 3.2 de phpBB, le fichier navbar_header.html n'existe pas sur la version 3.0 :wink:
Avatar de l’utilisateur
Mazeltof
Resp. des graphistes
Resp. des graphistes
 
Messages: 3369
Enregistré le: 09 Mar 2009 à 22:02
Localisation: Arras

Re: Ajouter des boutons de navigation

Messagepar redway » 12 Juil 2017 à 13:19

Hello Mazeltof

Merci beaucoup pour ces précisions :mrgreen:

Bonne journée à toi

@+

François :wink:
redway
Posteur habitué
Posteur habitué
 
Messages: 252
Enregistré le: 23 Juil 2010 à 07:17


Retourner vers [3.2.x] Modifications et recherche de styles

 


  • Articles en relation
    Réponses
    Vues
    Dernier message

Qui est en ligne

Utilisateurs parcourant ce forum : Aucun utilisateur enregistré et 2 invités