# Inventory

The inventory page should be built with TZ Portfolio+ component, so you need to make sure the component is installed on your website. 

### Install TZ Portfolio+ addons

You're supposed to install some TZ Portfolio+ addons including Image Gallery, Form Builder, Pricing Content, Video Content, and Leader Price.

* You should go to Admin > Components > TZ Portfolio+ > Addons
* Click install/update button
* Install those mentioned addons one by one

<figure><img src="/files/UvthJSta73OawzXyUX9j" alt=""><figcaption><p>Install required addons</p></figcaption></figure>

### Create the field group "Motorbike"

Go to Admin > Components > TZ Portfolio+ > Field Groups > Add new

Enter the field group's title, choose the field ordering type.

{% hint style="info" %}
Learn more about [how to use field groups](https://www.tzportfolio.com/document/administration/29-how-to-use-group-fields-in-tz-portfolio-plus.html) in TZ Portfolio+
{% endhint %}

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

### Create custom fields

Go to Admin > Components > TZ Portfolio+ > Fields > Add new fields (Make, Model, Year, Minimum Age, Maximum Speed, and Engine Type).&#x20;

Custom fields may have the same or different types that depend on your needs and utility.&#x20;

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

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

<figure><img src="/files/RqZHEa6ZPiEfcjT0gKM2" alt=""><figcaption><p>Create custom field</p></figcaption></figure>

### Create inventory category

Go to Admin > Components > TZ Portfolio+ > Categories > Add new

Assign the category to the field group "Motorbike"

<figure><img src="/files/VhVBI7IlPFCi5SkAUuYO" alt=""><figcaption><p>Create a category</p></figcaption></figure>

### Create Portfolio articles

* Go to Admin > Components > TZ Portfolio+ > Articles > Add new
* Assign the article to the Inventory category
* Choose a media type: Image Gallery
* Choose a field group: Motorbike
* Add the motorbike's description to the content box

{% tabs %}
{% tab title="Upload Image Gallery" %}

<figure><img src="/files/YqIpl5NRllVZqrqtKxrT" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

#### Enter custom fields for motorcycle

Enter custom fields' information or choose available options in the drop-down list.&#x20;

<figure><img src="/files/81SCjo9Nq12xpPaKPtkS" alt=""><figcaption></figcaption></figure>

To show or hide a field from the list view or detailed view, you can go to TZ Portfolio+ > Fields > open the field > enable or disable the list view or detailed view options.&#x20;

<figure><img src="/files/vYR16aTTT6FMxbui10rC" alt=""><figcaption><p>Hide or show a field from the list view or detailed view</p></figcaption></figure>

#### Form Builder - Contact Form

* Provide Email & Recipient Options
* Enter Success & Error Message Options
* Configure Redirect, Security & Policy Options
* Configure Button Options and fields in the form <br>

<div><figure><img src="/files/Wy85HJamQTEMYIcdC73G" alt=""><figcaption></figcaption></figure> <figure><img src="/files/hYbkNJydzo1rkv6cmkcL" alt=""><figcaption></figcaption></figure></div>

#### Motorbike's Pricing

We used Pricing Content addon to display the motorbike's pricing. Afte installing the addon, go to edit an article > pricing content tab > Click + to add pricing items

The addon allows you add main price, and price meta, title, meta text and description.&#x20;

In General Options, you can adjust the pricing column's ratios on different devices. Moreover, it's possible to customize the style of price, and price meta as your preference.&#x20;

<div><figure><img src="/files/wCIL4i60L7aVlMrhqODO" alt=""><figcaption></figcaption></figure> <figure><img src="/files/Vs2LCtGMVDNjIhJlvFwZ" alt=""><figcaption></figcaption></figure></div>

### Configure the layout builder of a detailed inventory page

There are a lot of content elements displayed on a detailed inventory page, so how can we organize them to fit our needs? Let's go to TZ Portfolio+ > Layout > Open Elegant - Default.&#x20;

Here you're able to manage the layout of a detailed inventory page by dragging and dropping elements to a suitable position.&#x20;

It allows you to add more or remove any element you want. You can assign the layout to menus, categories, and articles.&#x20;

<figure><img src="/files/5d4vhNxxYiXPWD4Afv4l" alt=""><figcaption><p>Configure the layout builder</p></figcaption></figure>

### Create an inventory menu

After all, it's time to present the inventory page in the front-end by creating a menu item and assigning it to the main menu.&#x20;

* Go to Menus > Mein Menu > Add new
* Menu item type: TZ Portfolio+ > Portfolio
* Choose a category "Inventory"
* Choose a TZ Portfolio+ layout: Elegant default or any other you want
* Template style: tz\_autobike\_default

<figure><img src="/files/xkn19E7gAJ8nGGVwdlUF" alt=""><figcaption><p>Inventory menu item</p></figcaption></figure>

### Go to front-end and check the page again


---

# 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/inventory.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.