Rearrange header on mobile - Support | Kriesi.at

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
February 26, 2015 at 12:22 pm #402604

hloft
Participant

Hi,

I refer to the post here: https://kriesi.at/support/topic/full-width-sub-menu-on-mobile/

Since the update I have re-added my search bar as a header widget, but now the CSS Yigit previously applied does not seem to work.

Please can you tell me how to get my mobile header looking like either of these again please?:
https://pro4lifehealth.com/wp-content/uploads/2015/01/Pro4lifemobile-2.jpg
https://pro4lifehealth.com/wp-content/uploads/2015/01/Pro4lifemobile-1.jpg

Thanks.
Harry

February 27, 2015 at 4:34 am #403140

Rikard
Keymaster

Hi hloft!

Where did you add the custom code? Please try to verify that your custom code is still intact.

Best regards,
Rikard

March 1, 2015 at 5:14 pm #404101
hloft
Participant
Hi Rikard,

Yes it is still in tact, it reads:
```
@media only screen and (max-width: 480px) {
#header form#searchform { left: 0px; top: 0; width: 170px; }
.responsive #top .cart_dropdown,#advanced_menu_toggle, #advanced_menu_hide { top: 81%; }
}
```
Thanks,
Harry
March 3, 2015 at 8:33 am #404990
Ismael
Moderator
Hey!

How did you add the widget? If you’re using the filter fro the documentation, please replace it with this:
```
add_action( 'ava_main_header', 'enfold_customization_header_widget_area' );
function enfold_customization_header_widget_area() {
dynamic_sidebar( 'header' );
}
```
Remove the “echo” before the dynamic_sidebar function to remove the number “1”. Use the name of the custom widget area instead of the “header”.

Regards,
Ismael
March 3, 2015 at 4:39 pm #405225

hloft
Participant

Hi Ismael,

Thanks for this it has removed the “1” from my mobile header.

However it still hasn’t solved making my mobile header look like one of these:
https://pro4lifehealth.com/wp-content/uploads/2015/01/Pro4lifemobile-2.jpg
https://pro4lifehealth.com/wp-content/uploads/2015/01/Pro4lifemobile-1.jpg

Yigit managed to log in and do it before (before the update). As you can see here:
https://kriesi.at/support/topic/full-width-sub-menu-on-mobile/

Thanks

March 4, 2015 at 8:57 am #405622
Ismael
Moderator
Hi!

Add this to the Quick CSS field:
```
@media only screen and (max-width: 767px) {
#header_main {
height: 160px !important;
}

#header .widget {
left: 0;
bottom: -50px;
}

.container #advanced_menu_toggle, #advanced_menu_hide {
position: absolute;
bottom: -50px;
right: 0;
top: auto;
}

.responsive #top .cart_dropdown {
top: auto;
right: 7.5%;
bottom: 28px;
}}
```
Might need adjustments but it will get you closer to what you want.

Regards,
Ismael
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.