> For the complete documentation index, see [llms.txt](https://wpdocs.gitbook.io/nouhotel/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wpdocs.gitbook.io/nouhotel/content-management/set-up-homepage.md).

# Set up Homepage

You can quickly build a home page using **Elementor** for WordPress which is drag and drop frontend and backend page builder plugin that will save you tons of time working on the site content. You will be able to take full control over your **WordPress** site, and build any layout you can imagine – no programming knowledge required.

From your **Dashboard** admin Navigate to **Pages.**

 \- Select **All Pages** to see all pages then click **Edit** one page you want.

 \- Select **Add New** to create a new page.

One page always includes a lot of parts like a Header, Main Page, Widget Sidebar, and Footer. In that section, we guide you to create the main page by using Elementor.

**A. How to use Elementor**

Have you ever used **Elementor**? Please follow that guide first: [**Elementor guide**](https://docs.elementor.com/)​

​[Official Plugin Documentation](https://elementor.com/) For More information about the **Elementor** check the official documentation.

​[Watch the video about Elementor](https://youtu.be/kB4U67tiQLA).

**B. How to use Front End NouHotel**

**a. Add and modify Container Layout**

**Step 1** - Go to your page/post, first activate the backend editor and click **Edit with Elementor**.

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2FaXGLXbK3Jtqoj5ZRXUZ6%2Fimage.png?alt=media\&token=190989ee-1d4d-407e-b98c-910325523e56)

**Step 2** - You will see all elements in the left sidebar, please choose the element that you want to use.

Or you will see buttons "**Add Container**", and "**Add Template**", please click on the button to add elements.

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2F1q2QzFbO3U0aOInlg8DA%2FScreen%20Shot%202023-06-05%20at%208.45.04%20AM.png?alt=media\&token=04461448-80e3-49d7-aaf9-5328d8d9eed5)

**Step 3** - To change the Container layout you need to click the button content will display in the left sidebar.

**b. Edit Container**

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2F1VAm25FMNkrypPQI3mUw%2FScreen%20Shot%202023-06-05%20at%208.46.36%20AM.png?alt=media\&token=fff344aa-e104-4d08-a6b3-a837e97a4316)

**c. Edit Element**

Click on the **Edit This Element** (pencil icon) to the element, when you click to button all content will display in the left sidebar follow you can change it.

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2FpWsAAFyxC6ZWqFZLkVNp%2FScreen%20Shot%202023-06-05%20at%208.48.59%20AM.png?alt=media\&token=ca99ce61-5cb5-474d-a14e-011d1a91dad2)

**d. Remove Element**

Trash Box Icon - To Remove the Container you need to click the Trash Box icon (X).

To Remove the elements you need to right-click the element and choose **Delete**.

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2FFimlnxplyqulM4JT9dkm%2FScreen%20Shot%202023-06-05%20at%208.50.56%20AM.png?alt=media\&token=aee909e1-e784-4338-b3d4-283701191fa5)

**e. Add Container or Element**

Trash Box Icon - To add Container please click to Add icon (+).

To add an Element - Drag the element you want into the container.

![](https://3381484998-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FQyq6iXjg1aSXXsGBUvWL%2Fuploads%2FWA5UTjNqMZoEfJ7dOmSe%2FScreen%20Shot%202023-06-05%20at%208.54.51%20AM.png?alt=media\&token=619386c5-69b9-4449-a896-7c1452bae966)

**Step 4** - Once you are done customize your page, click **Update** or **Publish**.

**C. How to use Back End NouHotel**

**a. Page Attributes**

You can select page attributes on the right sidebar of the page admin layout. Each Page templates have a style.

![](https://gblobscdn.gitbook.com/assets%2F-M0pIcnkwC6XUmoax49d%2F-M0z7CPydivoHKZxVtiF%2F-M1-Kz0xQqEyN6loRVU9%2Fimage.png?alt=media\&token=3387cd55-714d-443f-976c-5d56a10509e9)

**b. Set a page as Home Page**

**Step 1** - Go to **Settings** > **Reading** in your WordPress Dashboard panel.

**Step 2** - Set "**Front page displays**" to a "**Static Page**".

**Step 3** - In the drop-down menu for "**Front Page**" choose a page that will be your home page.

**Step 4** - Leave the drop-down menu for the "Posts page" empty, as this is not used by the theme.

**Step 5** - Save changes.

![](https://gblobscdn.gitbook.com/assets%2F-MGbFxd9X6wS6x8pAOzM%2F-MGbSU9V0uY02EBi7nW1%2F-MGbUJZ96y2jo6DD8Y8-%2FPoco-6.png?alt=media\&token=19dd3cf7-9a59-494b-804d-e4dcb10809c9)

**Teapoz has used woo-commerce to set up products**, if you want to know how to use it, please click a link:

​[Woocommerce](https://docs.woocommerce.com/documentation/plugins/woocommerce/getting-started/).

Our theme has an element is "**Products** " to setting product display on the homepage, please click to **Add element** --> then choose "**Products**".