Now let’s explore how to use Read More widget.
Organizing content with the Read More widget
Step 1 — The first thing you should do is navigate to the Page or Post where you need to add Read More widget. Then, click Edit with Elementor button to proceed.
Step 2 — After this, find Read More widget in the Elements panel and drag the widget to a suitable location.
Step 3 — On the left sidebar, you’ll see the Sections block and the Settings section. You can change the appearance of the Read More button in the Settings section. Here you’ll be able to change Icon, Label, Show Effect, and choose whether you want to Show All Sections or not.
In the Sections block, you should click the first section and paste the ID of the section you want to hide. Let’s explore where we can find this ID.
Step 4 —In order to set unique ID, open Advanced Settings of the Section you want to hide. Here you will see CSS ID field where you should type in the name of the section, for example, “hidden-section-1”. Do that with all the sections you want to hide.
Step 5 — After that, go back to the Read More widget editor, click on the section_1, and in the Section Id field paste the ID of the section that you have set before.
Step 6 — If you have several hidden sections, then you need to click Add Item button and type in the ID for the next hidden section. Afterward, you will see that the section became grey, which indicates that it will be hidden on front-end.
Step 7 — Don’t forget to click the Publish button and proceed to the preview in order to see the result.
That’s all you have to do to organize content in a compact way with the Read More button. Hope you’ll enjoy the results!