# Home 1

### Import the demo content

The home page's content should be built with SP Page Builder so you need to make sure the component has already been installed. 

* Go to Admin > Components > SP Page Builder > Pages > Create a new page
* Click to import > upload the home1.json file included in the template package.

### Create the home menu

* Go to Menus > Main Menu > Add a new menu
* Create a menu with a menu type: SP Page Builder > Page
* Choose a page: home page
* Choose a template style: tz\_autobike - Home Page

<figure><img src="/files/iChAGfEc4ugCOwHnpndG" alt=""><figcaption></figcaption></figure>

### Edit the home page content

### &#x20;1. Home video

The heading, text and button above the video are created with UK Heading, UK Text and UK Button.&#x20;

<figure><img src="/files/5z3jMedgo6juG6PtB16s" alt=""><figcaption></figcaption></figure>

To change the video, you should edit the row options > Style tab > SECTION OTHER SETTINGS > Choose background type: video > Upload an mp4 file

<div><figure><img src="/files/hdXNnjAQZFYUKZbaGcSQ" alt=""><figcaption></figcaption></figure> <figure><img src="/files/lKuMNCQyKXxOUwYZxBqS" alt=""><figcaption></figcaption></figure></div>

### Find Your Motorbike

<figure><img src="/files/v2TLmUox1yLImpqxFKG7" alt=""><figcaption></figcaption></figure>

This section is created with a TZ portfolio+ Filter module. You should go to Site Module > Create a new module with the type: TZ Portfolio+ Filter.

After the filter module is created, you can assigned it to the Joomla module in Sp Page Builder.

{% hint style="info" %}
Please refer to [How to create custom fields in TZ Portfolio+](https://www.tzportfolio.com/document/administration/30-how-to-use-fields-in-tz-portfolio-plus.html)
{% endhint %}

<figure><img src="/files/SHD1WeHc8gtYlfD74cB4" alt=""><figcaption></figcaption></figure>

#### Change the module's background color

You should edit the row options > Style tab > Section other settings > Change the background color

<div><figure><img src="/files/b1yHZUusswOw0Lr8Li7E" alt=""><figcaption><p>Open the row options</p></figcaption></figure> <figure><img src="/files/Wzvv3WdRUnvQ7ssgP4rf" alt=""><figcaption><p>Change the background color</p></figcaption></figure></div>

### Latest Motorbikes

The section "latest motorbike" was created with UK Heading, UK Text, and a Joomla module.&#x20;

The Joomla module in this section was built with TZ Portfolio+ Portfolio module. So you're supposed to go to Components > TZ Portfolio+ > Articles > Create articles.

Go to Site Modules > Create a new module with TZ Portfolio+ Portfolio, choose categories, and configure options. After that, assign the module to the Joomla module in the SP Page Builder.

<figure><img src="/files/XBVVeSKIbf1RI6D3SzB1" alt=""><figcaption></figcaption></figure>

### Free Service For Premium Members

To change the background image of this section, you should open the row options > style tab > Section other settings > Change the background image.

<div><figure><img src="/files/vcfZ902tqcC8SBK3pmJv" alt=""><figcaption><p>Edit Row options</p></figcaption></figure> <figure><img src="/files/VbnGepfCFISLUYHkfmvf" alt=""><figcaption><p>Change the ackground image</p></figcaption></figure></div>

Here above are the instructions that guide you on how to edit some sections of the page that might make you confused or difficult to find out where to edit them. Hope they are helpful.

### Our Products

The section includes UK Heading, UK Text, and a Joomla module.&#x20;

Go to Site Modules > Create a new module with Hikashop Content Module.&#x20;

<figure><img src="/files/e8IYz2eiGL613I3bIyTH" alt=""><figcaption></figcaption></figure>

You're supposed to refer to [SP Page Builder documentation](https://www.joomshaper.com/documentation/sp-page-builder) for more detailed instructions on how to use the component.&#x20;


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jollyany.co/templates/autobike/home-1.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.