Starting from Porto v7.1.0, a new feature called Read More Content for Column/Container has been introduced.
This feature allows you to collapse overflowing content inside a container or column and reveal it dynamically using a “Read More” button. It’s designed to enhance the user experience and maintain a clean, organized layout — especially when displaying long text sections or multiple elements.
How to Use
Step 1. Create Your Column/Container Structure
Begin by adding your content elements inside a Column or Container.
At the end of this column or container, insert a Porto Button (or VC Button if you’re using WPBakery Page Builder).
You can include any elements above the button — such as text blocks, images, or shortcodes — according to your design needs.
Step 2. Enable Content Collapse
Open the Column Settings, and in the Porto Addons tab, enable the option “Content Collapse.”
This setting defines the section of the column that will be hidden initially and shown upon user interaction.
Step 3. Configure the “Read More” Button
In your button settings (either Porto Button or VC Button):
- Locate the option “Content Collapsible Action.”
- Enable this option so the button functions as the trigger to expand or collapse the content.
When users click this button, the hidden portion of your column will smoothly expand and reveal the remaining content.
Supported Page Builders
This feature is compatible with both WPBakery Page Builder and Elementor Page Builder.
You can use any of the following button elements to trigger the “Read More” action:
- VC Button (WPBakery Page Builder)
- Porto Advanced Button (WPBakery Page Builder)
- Porto Button (Elementor Page Builder)
