Hide/Show Modules based upon Type of Device (Mobile/Tablet/Desktop) Hide/Show Modules based upon Type of Device (Mobile/Tablet/Desktop)

For all YellowWebMonkey websites, we build on either the Gantry Framework by RocketTheme or the Warp Framework by YOOtheme.  Luckily, both use the same module suffixes.

1. To add a module suffix, login to the backend of the website and go to MODULE MANAGER.

2. Open the module you want to change and look for a field called MODULE SUFFIX (this is usually on the ADVANCED tab, but not always).

Adding a module suffix in Joomla

3. Put the correct word in the field and hit SAVE.

 

 

Here are the choices of module suffixes you can use:

Module Class Suffix Phones 480px and below Tablets 767px and below Desktops 768px and above
.visible-phone Visible
.visible-tablet Visible
.visible-desktop Visible
.hidden-phone Visible Visible
.hidden-tablet Visible Visible
.hidden-desktop Visible Visible

 

REFERENCES:

http://www.rockettheme.com/blog/team/1551-responsive-design-rocketthemes-solution

http://www.yootheme.com/component/blog/2012/06/12/warp-gets-responsive

  • Friday, 24 January 2014
blog comments powered by Disqus

Can't find it?

Request New Tutorial

Want us to fix it?

Hire Us

×

Get Started with YellowWebMonkey

Get Started Now!

Invalid Input

Invalid web address.

Invalid Input

Invalid Input

×

Joomla Maintenance Plans

Get started with reliable monthly care provided by a Joomla certified company.

Invalid Input

Invalid web address.

Invalid Input

Invalid Input