Blog d'aide de Blog4ever

Blog d'aide de Blog4ever

Bloc membres dans la barre de navigation,

1444 appréciations
Hors-ligne
Bonsoir  
Lorsque tu auras du temps ...après la sieste, la pêche et le foot  ...
Tu pourrais me donner le code pour mettre le bloc membres dans ma barre?
Merci à toi, 
...Je l'adapterai pour le placer, je n'ai pas encore décidé, Gauche? Droite?... 
Passe une bonne soirée, 

3618 appréciations
Hors-ligne
le code commence comme ça mais il faut l'adapter.  --> sans étoiles

<*div id="blogmember_menu_container" style="">            
            <*li class="blogmember_menu_notifs">
                <*a href="/notifications">
                    <*i class="icon-exclamation-sign icon-white"><*/i> <*span id="blogmember_menu_nb_notifs">0 notification<*/span>
                <*/a>
            <*/li>
            <*li class="blogmember_menu_profile">
                <*a><*i class="icon-user icon-white"><*/i> Simon <*i class="icon-chevron-down icon-white" style="float:right"><*/i><*/a>
                <*ul style="display: none;">
                    <*li><*a href="/membres/Simon">Voir  profil<*/a><*/li>
                    <*li><*a href="/profil">Modifier profil<*/a><*/li>
                    <*li class="divider"><*/li>
                    <*li><*a href="/messages-prives">Messages privés<*/a><*/li>
                    <*li class="divider"><*/li>
                    <*li><*a href="/favoris">Mes favoris<*/a><*/li>
                    <*li><*a href="/membres">Membres du blog<*/a><*/li>
                    <*li class="divider"><*/li>
                    <*li><*a href="/deconnexion">Déconnexion<*/a><*/li>
                <*/ul>
            <*/li>
        <*/ul>
    <*/div><*/div>


1444 appréciations
Hors-ligne
Merci 
Je vais déjà voir où ça me convient le mieux, Gauche? Droite? Centre? 

1444 appréciations
Hors-ligne
 
Dans un premier temps, pour éviter les conflits, j'ai supprimé le menu déroulant que j'avais placé tout à gauche de ma barre, 
Puis, après avoir fais une sauvegarde, j'ai désinstallé mon bloc membre, 
Ensuite, j'ai testé ton code pour voir, 
Il ne se place pas dans la barre, mais au même endroit où j'ai placé mon bloc ... En haut à gauche de l'image d'entête, 
J'avais mis ton code dans mes bordures basses, Était-ce au bon endroit?
En attendant, je n'ai pas remis mon menu dans la barre, mais j'ai replacé mon bloc dans mon image d'entête, 
Prends ton temps, 

3618 appréciations
Hors-ligne
coucou




J'ai regardé pour placer le menu en haut à gauche.

ligne 197 ---> tu colles ce code!

.blogmember_menu {
  width: auto !important;
height: 236px !important;  
margin-top: 30px!important;
margin-right:auto!important;
max-width: 170px!important;
left: 320px!important;
border-radius: 20px!important;  
}

.blogmember_menu:hover{
 border-radius: 20px!important;
  border:2px solid maroon;  
  width: auto !important;
height: 240px !important;  
margin-top: 30px!important;
margin-right:auto!important;
max-width: 170px!important;
left: 320px!important;
  font-weight: bold;
}
.blogmember_menu li a {
 border:1px solid maroon!important;
 border-radius: 20px!important;
  background: transparent none repeat scroll 0 0 !important;
 display: block;
 outline: 0 none;
 padding: 4px;
 margin: 4px 0 0 15px!important;
 text-align: center;
 color: #1B5161 !important;
 text-decoration: none;
 }

.blogmember_menu li a:hover {
 background: transparent none repeat scroll 0 0 !important;
 display: block;
 outline: 0 none;
 padding: 4px;
 margin-top: 4px !important;
 text-align: center;
 text-decoration: none;
}
.blogmember_menu a:hover{
  color: maroon!important;  
}








1444 appréciations
Hors-ligne
CC 

Je me suis mal exprimée, J'ai déjà le bloc en haut à gauche de mon en-tête ...flèche rose... Ce que je veux, c'est le placer dans la barre de navigation ...flèches vertes... comme tu avais fais ici et sur Entre Amis,  



après, je sais que je vais devoir déplacer mes liens, si je le mets à gauche et je pense que je vais opter pour cet endroit, Donc avant Accueil, 
Prends ton temps, Je m'absente quelques heures, 


3618 appréciations
Hors-ligne
voici un code



Il faut savoir que pour la barre on ne peut pas mettre de code HTML et donc en cas de zoom le bloc se déplacera....
le réglage est fait pour une page réglée à 100%.

Il reste des retouches à faire ....

_____**____

/*menu haut droit connexion*/

nav{
background-image: none!important;
margin-left: 180px;
width: 780px;
box-shadow:2px 5px 20px 2px black;
}
nav ul{
 height: 70px
}
.blogmember_menu{
 box-shadow:2px 0px 20px 0px black;
  border: px solid;
  position: absolute!important;
  font-weight: bold;
  font-size: 18px!important;
  width: 300px !important;
height: 90px !important;  
margin-top: 320px!important;
margin-right:auto!important;
max-width: 170px!important;
left: 310px!important;
display: block;
z-index: 1000 !important;
}
.blogmember_menu:hover{
position: absolute;
  z-index: 1000!important;
  border-radius: 20px!important;
  border:px dashed maroon;  
font-size: 16px!important;
  width:280px !important;
height: 350px !important;  
margin-right:auto!important;
max-width: 180px!important;
font-weight: bold;
}
.blogmember_menu li a {
 border:px solid maroon!important;
 border-radius: 20px!important;
  background: transparent none repeat scroll 0 0 !important;
 display: block;
 outline: 0 none;
 padding: 4px;
 margin: 4px 0 0 -20px!important;
 text-align: center;
 text-decoration: none;
 }
.blogmember_menu li a:hover {
 background: transparent none repeat scroll 0 0 !important;
 display: block;
 outline: 0 none;
 padding: 4px;
 margin-top: 4px !important;
 text-align: center;
 text-decoration: none;
}
.blogmember_menu a{
margin-top: 15px!important;
color: #1B5161!important;
 width: 180px!important;
  padding: 5px!important;
}
.blogmember_menu a:hover{
  color: maroon!important;  
}


1444 appréciations
Hors-ligne
COOL, 

Me reste qu'à l'ajuster, mais ça me convient, 
J'avais fais un truc du même genre lorsque ma barre était fixée tout en haut ...Stef m'y avait aidé... mais bien que placé dans l'alignement de la barre, le bloc se trouvait toujours dans la marge, 
Hors, autant que possible, j'aimerai laisser les marges vides, Et cette proposition que tu m'as faite remplie ce souhait, 
Bonne journée, 

3618 appréciations
Hors-ligne
ok

Il te reste des réglages à faire donc je te laisse travailler.




1444 appréciations
Hors-ligne


Voili, voilou, En attendant de pouvoir vraiment intégrer le bloc de connexion à la barre de navigation, la solution de l'y superposer est déjà bien, 

Par contre, pour pouvoir mettre mon image, je n'ai pas réduit ma barre, J'ai juste ajouté un faux lien fait de _ ...14 en tout... Le bloc se superpose dessus, 

Une petite chose sans grande incidence, Il a tendance à n'apparaître qu'après une à deux secondes lors d'une actualisation ou un changement de page, 
A quoi est-ce du?
Y a-t-il un remède? 
Amitiés,  

3618 appréciations
Hors-ligne
re

Je ne vois pas de temps après rafraichissement.

Le seul hic c'est que la partie barre ne prend pas le html et donc en cas de zoom le bloc se décale.



1444 appréciations
Hors-ligne
C'est dommage, Voilà une demande à faire, 

3618 appréciations
Hors-ligne
Oui ce serai bien d'étudier un bloc à mettre dans la barre .....

Ton bloc est bien placé et normalement les page sont à 100% ...

Bonne soirée





1444 appréciations
Hors-ligne

J'ai supprimé le faux lien que j'avais mis derrière mon bloc de connexion pour que mon premier lien soit placé à côté, cette solution étant provisoire, 
Le temps de retrouver les sujet et lien de pour centrer les liens de la barre, 
IICI et 
C'est du Diz, mais rien n'empêche d'adapter, Je n'ai pas centré mes liens, mais cela m'a permis de les déplacer et de garder ma barre en 960,

Ma modif dans le css

nav ul{   
width : 560px;
margin-left : auto;
margin-right : auto;
height: 60px;
}

Bonne journée, 

Dernière modification le samedi 26 Novembre 2022 à 09:23:17

3618 appréciations
Hors-ligne
re

Tu peux aussi centrer comme ça !

nav ul{
   width : auto;
margin-left : 280px!important;
margin-right : auto;
height: 60px;
}



1444 appréciations
Hors-ligne
Aussi, oui, 
Testé, ça fait deux versions à exploiter, Cool, 
Vous ne disposez pas des permissions nécessaires pour répondre à un sujet de la catégorie Petits conseils.

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 6033 autres membres