Hey Rikard again :)

I don’t have any example in mind, I just wonder if it’s possible to a menu display like a regular or megamenu in the header at the top of the page and once the header shrink and get sticky transform it in a burger menu ?

It’s just cause I really like the burger menu but I also want that my visitors can see the entire menu when they land on the home page ?

and when you scroll

Best regards,

Clement

I’m sorry i didn’t explain myself correctly. I don’t want a color preset mode, I just want a sidebar wich can be hide or reveal by a click from my visitor. Inside this side bar I will put several thing but nothing like a color preset mode :)

Me again,

As I have to present the website to my client I’ll restore the old version of enfold for fews hours. I’ll put back the new one as soon as I end the presentation.

Best regards,

Clement

Thanks,

I’ll give you the acces in private section.

Example of page concerned :
http://www.bijouterie-valer.fr/lesmarques/horlogerie/
http://www.bijouterie-valer.fr/lesmarques/bijouterie/#degrisogono
http://www.bijouterie-valer.fr/entretien/garantis-et-accidents/
etc.

Hi Ismael,

I use this html code for the left column :

<br />
<center>
<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#creationsvalerbijoux">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Img-crea-valer-menu-01.png" div class="intro2"; alt="Les Créations Valer"; style="width:128px; height:64px" />
</center>
</a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#dinvanh">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Dinh-Van-logo-noir-WEB.png" div class="intro2"; alt="Dinh Van"; style="width:86px; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#degrisogono">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/De-Grisogono-logo-WEB.png" div class="intro2"; alt="De Grisogono"; style="width:86px; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#jaegerlecoultre">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Logo-Jaegger-LecoultreWEB.png" div class="intro2"; alt="Jaegger Lecoultre"; style="width:86px; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#chaumet">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/chaumet_logo-bijouterie-WEB.png" div class="intro2"; alt="Chaumet"; style="width:86px; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#hublot">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Logo-Hublot-WEB.png" div class="intro2"; alt="Hublot"; style="width:86px; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#messika">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Messika-Logo-WEB.png" div class="intro2"; alt="Messika"; style="width:86x; height:64px" /></a>

<a href="http://www.bijouterie-valer.fr/lesmarques/bijouterie/#chopard">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/chopard-vector-logoNB-WEB.png" div class="intro2"; alt="Chopard"; style="width:86px; height:64px" />
</a>

This code for the right column :

<br />
<center>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#creationsvalerhorlogerie">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Img-crea-valer-menu-02.png" div class="intro"; alt="Les Créations Valer"; style="width:128px; height:64px" />
</center>
</a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#zenith">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Logo_Zenith-WEB.png" div class="intro"; alt="Zenith"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#chaumet">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/chaumet_logo-horlogerieWEB.png" div class="intro"; alt="Chaumet"; style="width:86px; height:64px" /></a>  
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#jaegerlecoultre">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/Jaeger-lecoultre-logoWEB.png" div class="intro"; alt="Jaeger Lecoultre"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#chopard">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/chopard-vector-logo_WEB.png" div class="intro"; alt="Chopard"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#breitling">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/breitling-vectorWEB.png" div class="intro"; alt="Breitling"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#omega">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/omega-logo-WEB.png" div class="intro"; alt="Omega"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#hermes">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/logo-hermes-2-WEB.png" div class="intro"; alt="Hermes"; style="width:86px; height:64px" /></a>
<a href="http://www.bijouterie-valer.fr/lesmarques/horlogerie/#tagheuer">
<img src="http://www.bijouterie-valer.fr/wp-content/uploads/2016/06/logo-tag-heuer-WEB.png" div class="intro"; alt="Tag Heuer"; style="width:86px; height:64px" /></a>

And I’ve put this CSS code in my style.css child theme to make a class (I still hesitate between the class “intro” or “intro2”:) :

.intro {
    opacity:0.3;
}
.intro:hover {
   opacity:1;
}

.intro2 {
    opacity:0.3;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.intro2:hover {
   opacity:1;
   -webkit-transform: scale(1.1);
   -moz-transform: scale(1.1);
   -o-transform: scale(1.1);
   transform: scale(1.1);
}

Do you need more information ?

Thanks !

Best regards,

Clement

• This reply was modified 8 years, 5 months ago by Blue_Bear.

Hi again,

Just to say that I’ve found a solution, not an elegant one but it’s working :)

I’ve just put my html code into the “description” area and check “Use the description to create a Text Block.”.

If you don’t have other solution more “elegant” please consider that the topic can be close.

Thanks a lot, cheers,

Blue_bear

Just to let you know I fixed the error message about the get_currentuserinfo thanks to this : https://wpchannel.com/bloquer-acces-utilisateurs-wordpress/

Hi,

Unfortunetly it’s not working. I switch theme and it’s working with default wordpress theme but when I come back to enfold I still have the problem.
To be sure I try to re-install worpress two time and nothing works…

I have no clue…

Thanks,

Clement

Hi,

I did the update but unfortunetly nothing change…

Best regards,

Clement

Hi,

It’s not excatly what I wanted but it will do :)

Thanks,

clement

Hi Ismael,

All the menu is transparent now but still not just when the header is transparent. When you scroll to the bottom and the header become non transparent the submenu remain transparent.

Clement