5.00 (1 votes)
5 stars 1
4 stars 0
3 stars 0
2 stars 0
1 stars 0

When customizing your own Joomla 3 site for tablets and mobile devices, you may come to the conclusion that you do not want to show the whole content but hide/show some site contents on selected screens. In such a situation, help comes from the utility classes included to the Bootstrap library.


Responsive utility classes.

You will be able to show or hide content by device by using the following classes:

  • visible-phone - visible for 767px screens and below
  • visible-tablet - visible for 979px to 768pox screens
  • visible-desktop - visible for 980px screens and up
  • hidden-phone - hidden for 767px screens and below
  • hidden-tablet - hidden for 979px to 768pox screens
  • hidden-desktop - hidden for 980px screens and up


How to use?

If you would like to hide/show a Joomla module for certain devices, simply add an utility class as module class suffix:




In some cases, when a Joomla module does not support suffixes or you would like to show/hide a template block, you can simply add an utility class as html class attribute:




Find more details on responsive features included to Bootstrap here.

Submit your article for free

Users' comments

Total rating (go to the top to rate): 5.00 (1 votes) Log-in to comment

Video Tutorials

EF4 Framework for Joomla! 3 - introduction

Joomla! 3 Quickstart Installation Guide

Speed up your website! Must watch video!

How to create Joomla article?

Joomla ReCaptcha - how to set up?

How to use Joomla editors?

How to display a module in Joomla article?

How to configure Joomla contact form?

How to check Joomla module positions names?

How to configure your language for Joomla 3?

How to create Joomla custom HTML module?

How to create Joomla menu?


ul. Przyjaźni 9, 84-215 Gowino, registered in Centralna Ewidencja i Informacja o Działalnosci Gospodarczej
NIP/VATID: PL5882424318

Copyright © 2009-2021 Joomla-Monster.com All rights reserved.

Joomla-Monster.com and this site is not affiliated with or endorsed by The Joomla! Project™. Any products and services provided through this site are not supported or warrantied by The Joomla! Project or Open Source Matters, Inc. Use of the Joomla!® name, symbol, logo and related trademarks is permitted under a limited license granted by Open Source Matters, Inc.