FOR VERSION 3.0.9 OR EARLIER ONLY
Note: We don't offer support for this kind of customization, so we highly recommend to only use this code if you are familiar with HTML & CSS.
As there is no hover state on mobile, informations like the title & category, which appear on hover, will not get displayed on mobile devices. There is also no solution to force this state, as we’ve removed the class completely. But there is a solution, which can be helpful.
You can display the title & category below the thumbnails on mobile only, but you will need some CSS for that.
Please aware that if you are using a fluid grid layout without a gutter, there will be a gap between your thumbnails, it would require further CSS to fix it, which is not a part of this tutorial.
-
First of all, make sure to enable the title & category below the thumbnails by default.
-
Now navigate to ‘Semplice → Advanced Styling → Custom CSS & JS’ and scroll down Media Queries.
-
You will see a variety of screen resolutions (Desktop, Table Landscape ..). Now paste following code to the code field of the resolutions you want the title & category to be hidden. In our example I just want the title & category to be hidden on Desktop.
CSS: section#thumbnails .thumb h3.thumb-title { display: none; } -
Now save everything and the title & category will be hidden on desktop resolutions.