Freeze T3 Header and MainMenu/Increase template width

kouliga

Hi,

Please is it possible to freeze the T3 Header and MainuMenu of this template? If it is possible how can i do that??

Thanks

aman204

kouliga Probably, this can help 🙂

https://www.joomlart.com/forums/topic/any-way-to-lock-the-top-menu/

kouliga

aman204 Hi, i hope you are going very well,

Please after the modification through the link received, the header and the MainMenu froze, but it move to the left as shown in the picture:

Your help wil be appreciated!

Thanks

aman204

kouliga I am unable to see the code modifications in place due to which menu isnt sticky as of now. Kindly check

kouliga

aman204 you are right! please, now you are able to see the code!!

aman204

kouliga Try change this in custom.css and adjust top value accordingly:

.t3-mainnav.affix {
    position: fixed;
   top: 0;
    z-index: 999;
    float: none;
}

.t3-mainnav.affix {
    position: fixed;
    top: 8rem;
    z-index: 999;
    float: none;
    width: 100%;
}

and change this :

.t3-header.affix {
    position: fixed;
    top: 0px;
    z-index: 999;
    float: none;
}

.t3-header.affix {
    position: fixed;
    top: 0px;
    z-index: 999;
    float: none;
    width: 100%;
}

kouliga

aman204 , Hi
it worked. But in the way, it works does not satisfy me too much, the bar of the main menu hides part of the logo: Would it be possible to avoid that?

In addition, how it is possible to move the off-canvas to the same line of the accueil(home)??

Thanks

aman204

kouliga Your site isnt accessible. Kindly check

kouliga

@aman204#9701 sorry, try with this link http://www.issp.bf/ISSP/administrator/index.php

aman204

kouliga You can change top value accordingly as stated earlier. Ref: Screenshot

Regarding positioning of canvas toggle menu to left of main menu as desired by you in your screenshot, You would need to either disable one of menu item or increase template width as there isnt sufficient space to be seen currently for canvas toggle menu to accomodate in your site where you wish to have it seen

You can let me know when done with the aforesaid step so as to have closer look thereon 🙂

kouliga

aman204 Hi, hope your are going well
I choose to increase the template widht, but there is no effect on the off-canvas!
What next step could i do?

Thanks

aman204

kouliga Increasing global layout width would require you to make other modules and elements in-line with the layout width henceforth, requiring several changes in order to get everything fine in appearence as you have already come quite far with your site

So, Would suggest to either go for this option for adding this to custom.css file as this would solely affect the container width for main-menu along with other css rule-set:

#t3-mainnav .container{width: 1200px !important;}
.navbar-nav{margin-left: 3em !important;}

and adjust values accordingly although, this is still a suggested workaround for which you may require to check rigorously across varied screen sizes and resolutions if it adapts fine and doesnt require further css tweaking

The most viable solution would be to disable one of main menu item in order to accomodate off-canvas toggle with ease

kouliga

aman204 i decided to disable one item of the main menu and it is okay. But this is not a good good solution for me for now. I will continue to look .

Now, my problem of the header and the main menu freezing is not completely fixed as the screenshot shown. I don't know if it is possible to get a solution for that.

Thanks

aman204

kouliga Now, my problem of the header and the main menu freezing is not completely fixed as the screenshot shown. I don't know if it is possible to get a solution for that.

If you wished to refer to logo appearing behind main-nav affix, as suggested earlier, You can change 8rem value accordingly

.t3-mainnav.affix { position: fixed; top: 8rem; /* change value here*/ z-index: 999; float: none; width: 100%; }

kouliga

aman204 This parti okay

paulus1031

Can I just check - do you mean the problem is resolved?

Cheers
Paul