Support Online : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Order of the module positions in header mobile

Featured Lock Resolved Issue
Hi,

is there any chance to switch the positions of menu and other modules in header only for mobile devices? See the screenshots
i tried to copy the header section but the offcanvas menu didn't work anymore.

Do you know a better way to do that? I want to have my offcanvas menu on the right side on mobile devices and the google logo and language switcher in the middle.

Thank you in advance

Best regards

Attachments (2)

  • Bildschirmfoto 2019-10-20 um 16.32.05.png
    Bildschirmfoto 2019-10-20 um 16.32.05.png 13.4 KB
  • Bildschirmfoto 2019-10-20 um 16.31.58.png
    Bildschirmfoto 2019-10-20 um 16.31.58.png 35.4 KB

3 Answers

Pavel

More than a month ago #Permalink
i tried to copy the header section but the offcanvas menu didn't work anymore.

You little missed. Create a copy of the modules for mobile devices and hide / show the necessary copies at the desired resolution using the bootstrap classes. https://getbootstrap.com/docs/4.0/utilities/display/
Use these classes in the module class suffix field

sebastianpro

More than a month ago #Permalink
Hi,

thank you for your answer!

But how to change the position from left to right? Because now the order is:

logo, menu, other logo, language switcher (see the screenshot)

but it has to be on mobile devices:

logo, language switcher, other logo, offcanvas menu

At the moment i have 4 different module positions in header. Maybe i'm missing something :)

Best regards

Attachments (1)

  • Bildschirmfoto 2019-10-21 um 14.40.31.png
    Bildschirmfoto 2019-10-21 um 14.40.31.png 69.1 KB

Pavel

More than a month ago #Permalink

@media (max-width: 992px) {
#sp-menu {
float: right;
}
}

http://dl3.joxi.net/drive/2019/10/21/0008/0401/545169/69/92b90aca42.jpg


There are no replies made for this post yet.
Be one of the first to reply to this post!

Leaderboard (30 days)

Paul Frankowski

Paul Frankowski

Total Accepted Answers: 109
Toufiq

Toufiq

Total Accepted Answers: 85
Mehtaz Afsana Borsha

Mehtaz Afsana Borsha

Total Accepted Answers: 70
Ofi Khan

Ofi Khan

Total Accepted Answers: 48
Rashida Rahman

Rashida Rahman

Total Accepted Answers: 32

121

Templates

315080

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us