Support Forums

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Sticky Menu in Corporex

Featured Lock Resolved Task
Hi there,
I would like to add a sticky header feature to my Corporex template for the Header/Menu positions.

I would like to have the Header and Menu positions stay in view then the user scrolls down the page.
I would also like it to be slightly transparent once the scrolling starts - see Joomshaper website header at the top of this page :)

Can anyone please help me as soon as possible - your help will be much appreciated!
Thanks,
Sarah

8 Answers

Alex Smirnov

More than a month ago #Permalink
Hi Sarah,

Please create an empty /templates/shaper_corporex/css/custom.css file and enter in there the following code:

#sp-header-wrapper {
position: fixed;
top: 0px;
height: auto;
width: 100%;
z-index: 100;
}


#menu #sp-menu {

position: fixed;
top: 40px;
height: auto;
width: 100%;
z-index: 100;

}

You most likely will have to set your own value for the "top" rule for the #menu #sp-menu class. See how it goes.

Regards,

alex

Alex Smirnov

More than a month ago #Permalink
Hi Sarah,

Sorry, but meeting your request will involve moderate coding and hence is outside of the scope of our support. Our Helix-3 and based on it Startup Biz have this setting (please see my screenshot attached below)

Regards,

Alex

Attachments (1)

  • sticky_header_in_startup_biz.png
    sticky_header_in_startup_biz.png 35.4 KB

Sarah Morris

More than a month ago #Permalink
Hi Alex,
Thanks for your reply!
Could you at least tell me if I might be able to locate the code in Helix3 and copy it over to Corporex...
I don't have to have the feature available in the backend as your screenshot demonstrates above...
Would it be possible to create some code and place it into my custom.css file??
I am very desperate to get this feature for Corporex!

I have already put too much work into the Corporex template I am currently using to go back and set up the Helix 3 template.
If I were to use the Helix 3 template, I would need to copy over the Module Variations from Corporex - and I don't know how to do that either - then I would need to spend weeks redesigning the template and css files so the site looks as I have it now.

Thanks,
Sarah

Sarah Morris

More than a month ago #Permalink
That's just excellent Alex! Thankyou so very much!
Usually all I need is a bit of a helping hand (or start on the code in this case) and I can then usually figure the rest out myself.
I used a combination of your code and my own from my fixed footer.
Here it is for your reference:
#sp-header-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
margin: 0;
padding: 10px 0px 10px 0px;
z-index: 100;
}

#sp-subheader-wrapper {
position: fixed;
top: 0;
left: 0;
right: 0;
margin: 0;
padding: 10px 0px 10px 0px;
z-index: 100;
}

#sp-menu-wrapper {
position: fixed;
top: 70px;
left: 0;
right: 0;
margin: 1px 0px 5px 0px;
height: auto;
z-index: 100;
}


Thankyou so very, very much for your help! I have finally been able to tick off a pretty major feature and I am one step closer to finishing my site! :D
Thanks again,
Sarah

Alex Smirnov

More than a month ago #Permalink
You are welcome, Sarah! All the best. :)

Regards,

Alex

Maneesh Sharma

More than a month ago #Permalink
How can I do the same with awetive template?

Alex Smirnov

More than a month ago #Permalink
@Maneesh Sharma,

Please create your own separate thread in Awetive forum category with request to help you fix your Awetive main menu, not forgetting to provide your web site URL address, and we will happily take it from there for you. This forum category is to help with Corporex template only. Thank you in advance for your understanding.

Regards,

Alex


There are no replies made for this post yet.
However, you are not allowed to reply to this post.

Leaderboard (30 days)

Sifat

Sifat

Total Accepted Answers: 122
Paul Frankowski

Paul Frankowski

Total Accepted Answers: 115
Toufiq

Toufiq

Total Accepted Answers: 62
Pavel

Pavel

Total Accepted Answers: 4
N

Nikolayts

Total Accepted Answers: 2

100+

Templates

200,000+

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us