Menu fixed at bottom

Hello, can you help me ?
How do i can put the GKheader fixed at bottom of the page ? (Logo, menu, search & cart)

And a second question, i want to show the sidebar in the left of content in the tablet view too, but only in horizontal mode. A pic of help for me ?

Thx for all.

Ed

Please edit: /templates/gk_storefront/css/override.css and add at its end:

Code: Select all

#gkHeaderTop {bottom: 0px;}
#gkHeaderNav {bototm: 38px;}
.frontpage #gkHeader {margin-top: 0px;}


Remember to enable "CSS override" in template settings - advanced section.

Thx!!! I'm very impressed with your speed

The first thing it's ok, but i need to modify some more files.

In Override:

Code: Select all

#gkHeaderTop {bottom: 0px;}
#gkHeaderNav {bottom: 38px;}
.frontpage #gkHeader {margin-top: 0px; padding: 0 0 101px 0!important;}

And in the template.css need to comment "top: 0;" because i don't know how to make it in override:

Code: Select all

#gkHeaderTop {
   height: 38px;
   position: fixed;
/*   COMENTANDO ESTO EL HEADER BAJA AL BOTTOM CON EL OVERRIDE   
top: 0; */
   width: 100%;
   z-index: 10001;
}
#gkHeaderNav {
   background: #1b1d1f;
   position: fixed;
   -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06);
   -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06);
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06);
/*   COMENTANDO ESTO EL HEADER BAJA AL BOTTOM CON EL OVERRIDE
top: 38px;
*/   width: 100%;
   z-index: 10000;
}


Only a big problem... The cart slide to bottom and disappear, can we make to change to slide up ?

Ok, and how do i need to modify for make the second thing? left sidebar too in tablet view

Lot of thanks & Un saludo amigo,

Ed

Could you please post an url to your site?
Do not modify original template files, I'll provide you with info about changing the top.

Could you please post an url to your site?
Do not modify original template files, I'll provide you with info about changing the top.

Not jet in production, but can to send you the url in private msg.

Ed

Hmm... Strange:

Code: Select all

Unable to load the webpage because the server sent no data.
Error code: ERR_EMPTY_RESPONSE


Sorry i shutdown the local server the weekend. Now on al the time!

Thx

Code: Select all

#gkHeaderTop {bottom: 0px; top: auto;}


this will override top: 0px;

Thx Cyberek,

i use your code but in the frontpage have problems with #gkHeaderNav.

i test a lot and discover that auto save my life!!!

Another question.

I use this code:

Code: Select all


    #gkMainMenu {
        display: none !important;
    }
    #gkMobileMenu {
        display: block !important;
    }

#gkMobileMenu i {
color: #676358!important;}

And all is ok, but in pc resolution shows me diferent. I want to see like a mobile in mobile, tablet and pc. It's possible?

A lot of thanks !!!!

Could you please create a simple mockup how should it look on devices with higher screen width than mobile?

Could you please create a simple mockup how should it look on devices with higher screen width than mobile?

Can i send you the images by private msg ?

Or you can attach them to the thread. But if this is an issue, please use pm.

Sorry for late response.
I cannot open images attached to the pm. Could you please check if they are still available?

Ps. Also page itself isn't working anymore.

Test now, and sorry (the images too)

Ps. Also page itself isn't working anymore.

If I understood you right, this code in override.css should make the requested look:

Code: Select all

#gkTopMenu {display: none !important;}
#gkMobileMenu {
float: right;
}
#gkMobileMenu select {
width: 44px !important;
height: 44px  !important;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"  !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
position: absolute !important;
left: 0 !important;
top: 0 !important;
}