Responsive menu icon

[RonaldParticipant]

Hi,

I followed all the steps to replicate Symbiostock Express but I can not figure out how to make the little menu icon for small screens appear.

Any suggestions on this?

Thanks

[RobinKeymaster]

Hi Ronald,

As far as I know, this is something that another member mentioned that is being looked into by Dawn. We’ll try to get an update on it as soon as we can.

[DawnKeymaster]

Hi Ronald, did you enable a mobile menu through your Symbiostock Express settings?  Go to Symbiostock Express > Menu Settings > scroll down to Mobile Menu Options.

Then choose these settings:

Mobile Menu only show button: select ‘On’

Submenu items collapse until opened: select ‘On’

Then you need to create your mobile menu through the WordPress Dashboard. Go to Appearance > Menus

You can either create a custom menu for your mobile menu, or you can use an existing menu if you have already created one. Select the menu you that want then under it’s Menu Settings > Theme Locations > select Mobile Navigation. Click Save Menu

Let me know if you need more help with this.

Symzio - Charging customers less, paying contributors more!

[RonaldParticipant]

Hello Dawn, Robin,

Thanks, I already have the responsive icon.

This part of the tutorial should be included in “Replicating the Symbiostock Express Demo Site” docs.

I have just a weird scroll that appears and disappears when the menu drops down. Could you help me fix this, please?

Could you tell me how to implement a shortcut icon .ico?

Thanks

BR

Ronald

[RonaldParticipant]

http://illustratoons.symbiostock.com/

[RonaldParticipant]

http://illustratoons.com/Responsive-menu-weird-scroll.jpg

 

[RobinKeymaster]

Hi Ronald,

We can’t provide tutorials, docs, and instructions on every aspect of such a large (and mostly free) system. Lots of the stuff you will want to personalize and tweak will have to be done independently or through the assistance of your peers.

That being said, the easiest way to deal with little things like these is as follows:

1) You right click on the problematic part and click on ‘inspect element’. This may vary depending on your browser.

2) You find the class name it is associated to. In most modern browsers, you can even add custom CSS in real time to see if it will elicit the changes you want.

3) You then add it as custom CSS to your theme via the theme itself, or another area where custom CSS is implemented.

In this specific case, I did exactly as I outlined above, and discovered that if I add:

overflow-y: hidden!important;

to the

.mobile-stickyheader.kad-header-style-three .kad-nav-collapse

Class, it successfully removes the scroll bar from that location. The scroll bar is purposely there in the case that you have many categories so visitors can see them all.

You can try it out to see if it works for you:

.mobile-stickyheader.kad-header-style-three .kad-nav-collapse {

overflow-y: hidden!important;

}

If this does not work for you, try to research why, as I would have to as well.

[RonaldParticipant]

I’m sorry, I’m not asking for tutorials, I’m not asking for minor details and I’m not asking for complicated customization of my site.

It seems that this aspect of how to have the responsive menu icon working is enough important to be included in the “Replicating the Symbiostock Express Demo Site” docs. If not, this is not exactly replicating the the Symbiostock Express site and to obtain the solution can be a real headache for you and your Symbiostockers.

The trouble with the ghost scroll is that it is not present (same conditions, same browser) in the Symbiostock demo site and seems more like a bug in your implementation, because I have not done anything different than following your docs and instructions.

Could you help me with the shortcut icon .ico please?

Thanks for your support.

Sincerely

RR

[RobinKeymaster]

Symbiostock Express > Misc Settings

[Author]

Posts