In the previous post, I showed you how to create a satisfactory header with Flatsome. Next, we will create a homepage. A beautiful homepage will be very attractive to customers, especially with a sales website. In this article, I will guide you . At the top of the homepage, people often put sliders, or image banners to impress customers.
Create a homepage header
You create a new page named homepage, the content is blank. Then go to settings and set this page as the default homepage for the website. If you forgot how to do it, review the Basic WordPress Configuration article !
Then you go back to editing the Home page, click on the UX Builder tab at the top of the editor.
You’ll be taken into Flatsome’s UX Builder drag-and-drop editor. The left is for you to add components, the right is for viewing changes and editing directly.
You click the Add elements button on the left.
Then you choose the layout as Grid , because I want to insert the banners in the head. You can add a Slider if you want.
Then you choose the layout for Grid , for example, I choose Grid 4 .
You will see that Grid 4 has 3 cells, 1 to 2 small on the side, corresponding to 3 Grid items on the left. On the right side also appear 3 corresponding boxes, click Add elements to add content to this box.
Then I choose the content type is Banner . Similarly, you can also add Slider to this box if you want.
Then you choose the appearance of the banner, such as Buttons Right and click the Apply button at the bottom.
Then, you go to Edit Banner, choose an image for this banner, and can edit the background color and overlay color on the image.
Banner will have text and 2 buttons, you delete 1 button. To delete or edit an element, press the gear button on the right, select Delete to delete or Option to edit.
You start editing the Text content then edit the Button with the node name and path.
Similarly, you edit the content for the remaining 2 Grid to your liking. Finally, click the Update button below.
Now go to the homepage to see your results so far!
summary
Above is a guide to create the first part for the home page of the sales website. You can customize the header with other components to your liking. I will end the tutorial here for the time being. In the next article, I will guide you to add other content to the homepage.
