Hello everyone,

I was wondering if someone might be able to help me.

We have the OMG Menu installed on a site but we would like to change the settings so that it changes to the mobile version of the menu (burger icon) at a different screen size than it currently does.

Is this possible? How would I do it?

Kind regards


James

Hi,
You can change it by change style css
you can test in firefox with Responsive Design Mode (Ctr + Shift + M) and test with screen width < 768px

Hi hapt,

Thank you for getting back to me.

Would you be able to tell me which file exactly I need to change? I don't have a style.css file in the template folder.

Kind regards


James

Hi,
You can do such as:
Copy all file from path modules/mod_omgmenu/tmpl to new folder you create in path templates/{your template}/html/mod_omgmenu
Then add css code in your template css file

If you cann't do,you can contact with us with mail This email address is being protected from spambots. You need JavaScript enabled to view it.
We'll check difficult to do and answer to you

Hello Hapt,

Thank you for getting back to me.

Sorry, what I meant was which file and line of code specifically do I need to edit to adjust the mobile menu settings.

The site is currently here: wicketts2.co.uk/thephoenix2/

When I shrink my browser window the menu goes on to two lines and then eventually switches to the mobile menu. What I would like is that if the main menu fits on one line then the normal menu is displayed but as soon as the menu goes to two lines, the mobile menu is activated.

Is this possible?

Many thanks for your help so far.

Kind regards


James

Hi,
sorry I haven't understood what you mean
can you give to me some screen image?
you can use Reponsive Develop in Firefox and print screen and send to me

Hi Hapt,

You said that I need to change the code in style css. Which file do I need to edit and which changes do I need to make?

Kind regards


James

favdes wrote: Hi,
You must add more code in template css file,not fix
In browser,you can check element what you want to change

In which case, what code do I need to add and where?

favdes wrote:
I said i haven't understood what you mean so you should use develop tool of browser,you can check what element you need to change

When the browser window is shrunk, the menu items collapse and go on to two lines (see screenshot). I don't want this to happen, I want the mobile menu to be shown immediately instead.

I need to know what code to change so that the menu doesn't go on to two lines but the mobile menu displays immediately.

Hi,
now I understand
Oh you use Our template OT Artwork?
First, in backend you access Extensions > Templates, choose template
choose tab Layout and Layout Builder,you can see Mediaum and small tab,you change logo block from 6 to 3,mainmenu from 6 to 9
Then you check again
if with smaller screen width,it'n not working you access file /templates/ot_artwork/assets/css/template.css line 599 and decrease font-size and padding

Beside,
In mobile view (screen width < 768px), mobile menu will appear,
If you want mobile view appear in tablet view (screen width from 768px - 991px),you can do like this:
- Open file default.php in path: templates/ot_artwork/html/mod_omgmenu line 38:
change "class="otmenu-wrapper otmenu-desk-wrapper hidden-xs""
to "class="otmenu-wrapper otmenu-desk-wrapper hidden-sm hidden-xs""

- Open file default_mobile.php in path: templates/ot_artwork/html/mod_omgmenu line 37:
change "class="otmenu-wrapper otmenu-mobile-wrapper hidden-sm hidden-md hidden-lg""
to "class="otmenu-wrapper otmenu-mobile-wrapper hidden-md hidden-lg""

Excellent, thank you Hapt. All working now :0)