From Uncode 2.5.0, the Posts module offers a new layout variation named Titles. The Titles layout is a modern design approach for displaying your Post Types, blog, portfolio, products, or any other custom Post Type. The Featured Media (images or video) appears on text hover in varied creative ways. You've probably seen this new design mode used recently by many award-winning design sites.
This layout mode can be an alternative, successful and creative solution for all demanding designers who want to create a modern portfolio or an unconventional shop. This mode emphasizes typography, loading speed, and minimal design with a surprising effect.
To activate the new Titles layout mode, please open the Posts module and select General tab → Layout → Titles, screenshot .
Block and Inline layouts
When you select this layout, in the Module tab → Display Layout, you have two major design options:
- The Block option creates a vertical list of items, and it is convenient when using a medium or large font size; please find an example at this link: Portfolio Titles;
- The Inline option creates a horizontal list of items on the same line until they wrap, and it is a good solution when using a small or medium font size; please find an example at this link: Portfolio Titles Inline.
Background and Mouse modes
Associated with these two modes, there are other two main options for displaying the media via the Media Position setting:
- The Background Row or Background Column options display the media as the background of the Row or Column container of the Posts module. This option is generally used combined with the Background Attachment Fixed option;
- The Mouse option displays the media in an absolute position that follows the movement of the mouse.
Unlike the Grid, Carousel, and Table layouts, within the Titles layout, it's not possible to select specific Elements that create the 'thumbnail'. Anyway, it's possible to choose an additional element to be presented within the main title, named Meta, and consequently, some display and positioning options. The Titles layout also has specific options for fine-tuning the design, both on Desktop, Tablet, and Device via the Mobile tab options.
Frontend Editor note
Please note that animated effects such as the Media appearing in Background or the Media following the Mouse are disabled when working in Frontend Editor.