Generatepress Mobile Menu Disappear

Resolved

(@youtube32)

My website quynhan.vn
My mobile menu disappear , some code i use:

Function.php

// Move Menu to left and create sidebar
add_filter( 'generate_navigation_location', function() {
    return 'custom';
} );

add_action( 'generate_after_header', function() {
    ?>
    <div class="navigation-slider-area grid-container grid-parent">
        <div class="gen-sidebar-nav">
            <?php generate_navigation_position(); ?>
        </div>

	<div class="slider-area">
    	<div class="slider-1">
        	<?php echo do_shortcode( '[metaslider id="851"]' ); ?>
    	</div>
	</div>
		
    </div>
    <?php
} );

Custom CSS


/* Move mainpage to below */
.navigation-slider-area {
    display: flex;
}

.navigation-slider-area .gen-sidebar-nav {
    width: 16%;
}

.slider-area {
    width: 84%;
}

/*  main menu drop to right */
.dropdown-hover .main-navigation:not(.toggled) ul li:hover>ul, 
.dropdown-hover .main-navigation:not(.toggled) ul li.sfHover>ul {
    left: 100%;
    top: 0;
}

1 My Menu Mobile not show up https://i.imgur.com/Zlj5Pm2.png

How to get menu like image 2, dropdown like image 3 ?
2 https://i.imgur.com/6omxiz3.png
3 https://i.imgur.com/z3Ukbtf.png

And if you have a litte time can you fix slideshow not full width .

This topic was modified 6 years, 3 months ago by youtube32.
This topic was modified 6 years, 3 months ago by youtube32.
This topic was modified 6 years, 3 months ago by youtube32.
This topic was modified 6 years, 3 months ago by youtube32.

Viewing 9 replies - 1 through 9 (of 9 total)

Theme Author Tom
(@edge22)

6 years, 3 months ago

Hi there,

Can you link me to your site so I can take a look?

mark l chaves
(@mlchaves)

6 years, 3 months ago

Hi @edge22,

He’s got it at the very top of his post.

https://quynhan.vn/

Thanks.
Theme Author Tom
(@edge22)

6 years, 3 months ago
Thanks for the heads up!

This CSS should help:
```
@media (max-width: 768px) {
    .gen-sidebar-nav {
        display: block;
    }

    .navigation-slider-area {
        flex-direction: column;
    }

    .navigation-slider-area > * {
        width: 100%;
    }

    .main-navigation ul {
        position: absolute;
        top: auto;
        z-index: 999;
        background: #1e73be;
        width: 200px;
    }
}
```
Thread Starter youtube32
(@youtube32)

6 years, 3 months ago
Thanks a lot Tom . I like to change Menu Title to “Danh Muc San Pham”. I found on google ( Customizer > Layout > Primary Navigation > Mobile Menu Label).

But unfortunately i don’t have GP Premium.I can inspect at chrome change code
<span class="mobile-menu">Menu</span>
to
<span class="mobile-menu">Danh Muc San Pham</span>
but i don’t how to convert it to Custom CSS. And when i make this change menu text show vertical like image 4. How to change it show up like image 5 make this text full width blue.

4 https://i.imgur.com/Qc9TJKm.png
5 https://i.imgur.com/SzQWqEr.png
- This reply was modified 6 years, 3 months ago by youtube32.
Theme Author Tom
(@edge22)

6 years, 3 months ago
To change the text without GP Premium, you should do this:
```
add_filter( 'generate_mobile_menu_label', function() {
    return 'Your new label';
} );
```
To show some menu items horizontally like that would be a complex solution, unfortunately. You will likely need custom javascript.
Thread Starter youtube32
(@youtube32)

6 years, 3 months ago

So sad it look so bad =.= So don’t have any solution for this.(horizontally only text Menu) Ex https://imgur.com/SzQWqEr
Someone go through this topic please help me 🙁

Theme Author Tom
(@edge22)

6 years, 3 months ago

Where do the horizontal menu items come from? What happens when there isn’t enough space for them on smaller devices?
Thread Starter youtube32
(@youtube32)

6 years, 3 months ago
I understand my problem now. At my country other store only show icon (three dashes) when go to mobile interface . They don’t show any text behind that icon. I think i just hide that text show it will perfect.
Anyone want hide “menu” on mobile interface like me . Just add this to function.php like Tom share.
```
add_filter( 'generate_mobile_menu_label', function() {
    return '';
} );
```
- This reply was modified 6 years, 3 months ago by youtube32.
- This reply was modified 6 years, 3 months ago by youtube32.
Theme Author Tom
(@edge22)

6 years, 3 months ago

Glad you got it sorted 🙂

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Generatepress Mobile Menu Disappear’ is closed to new replies.