This tutorial is a continuation of the previous article where we showed you how to add different sections. In this part, we shall cover the section below the slider. In order to get the attention of your Site visitors you need to ensure you have a quality and appealing look for the entire front page. Thus, this section we shall create a section of the top posts or featured posts that site visitors would probably click on. 

To get started go to your pages under Dashboard >> All Pages and select the page you created as the home page. Let’s dive in.

Step 1: Adding a row section

After placing your article slider appropriately we need to add a row section below it. It also have to match the size of the section that holds the post slider. Therefore it will be like a repetition of the first tutorial but this time no Color adjustments.

• To do so, In the first section, Click the red plus icon to add a single row section.
• In its Layout settings change the content width to ” full width “.
• In the Style settings choose ” Background Type” to be Classic. 
• Under image you can upload an image suitable for your site and ensure that it’s large enough to fit the full width (above 1280 px).
• Change the position to “Custom ” and under X Position  enter 70 px while Y Position enter 66px
• Then set the repeat style to “No repeat “.

Step 2: Add an Inner Section 

In this part we need to include a section which will hold the Featured posts. We can divide the Inner section in three or four columns depending on how many posts we want to display. 

• To do so,head over to the Elementor main left panel and search for, Inner section panel. It’s basically a two column section. 
• Drag and drop it section into the top row you created in step 1.
• This time, do not Delete any column section. Instead right click on that inner section and add a column 
• Under settings, go to ” Structure ” select the “25, 25, 50” px three column  structure.
• Also ensure the column gaps are set to  “wide”.

Step 3: Editing the Columns

These steps describe how to edit the inner section columns you created in step 2. This part will only cover one column and then you should be able to repeat the steps for the other columns. 

• To get started,  add a text editor in the first column 
• Then give it a label or number we labelled this as “1”. 
• Under Style tab settings increase its size to 82 px under the Typography settings.
• Below this text module drag and drop a Heading module. This describes the category of your post. So just type in the category of your post in the editor.
• Set the HTML tag of the Heading to H3
• Next, below the Heading module drag and drop the Typer Articles module.
• Under “show”, you can choose which type of articles to display from “latest” or “most liked articles “.
• Other options to choose include the image, category, and tag of the  post.
• In the Max post you can choose the maximum number of posts to display.
• Users can also opt to display meta info within the column.

Once you are done setting the above steps repeat the same for the other two columns. That’s it click on update to save your changes and preview your homepage.