> For the complete documentation index, see [llms.txt](https://docs.jollyany.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.jollyany.co/templates/interiart/projects.md).

# Projects

The page is created to showcase your projects relating to interior design, building architecture or decor works. The demo page was created with [TZ Portfolio+ component](https://tzportfolio.com/), so make sure you have already installed it. 

### Install required addons

There are some add-ons of TZ Portfolio+ extension you need to install before creating articles. They are [**Gallery Content**](https://www.tzportfolio.com/document/add-ons/123-gallery-content.html) **and** [**Video Content**](https://www.tzportfolio.com/document/add-ons/125-video-content.html)**.** Besides that, you can install Media add-ons you're interested in such as Image gallery, Grid gallery, Flipbook gallery, Video ...

<figure><img src="https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FoBBXF4uM9fQS8Kd3Rdft%2Fuploads%2FWjRhini8Ln2dNsLBmHER%2Finstall-content-gallery-addon.jpg?alt=media&#x26;token=9a6b6a7c-abb5-4405-bf1f-6fca3d225e39" alt=""><figcaption></figcaption></figure>

### Create Project Articles

Please go to Admin > Components > TZ Portfolio+ > Articles > Add new

You should select a media type, and add media images in the corresponding tab. \
Then add the project's description, and set up the [gallery content](https://www.tzportfolio.com/document/add-ons/123-gallery-content.html) and [video content](https://www.tzportfolio.com/document/add-ons/125-video-content.html).

{% tabs %}
{% tab title="Featured image" %}

<figure><img src="/files/EcXYGP6ECorPGOiK3eIe" alt=""><figcaption><p>Upload the featured image of each article</p></figcaption></figure>
{% endtab %}

{% tab title="Video Content" %}

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

{% tab title="Gallery" %}

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

### Project's Extra Field

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

* Firstly, go to TZ Portfolio+ > Field Group > create a new field group
* Go to Fields > create new extra fields and assign them to the field group above
* Edit your articles > select a field group (or you can assign the field group to categories)&#x20;
* In the Fields tab, enter the content of each field

<figure><img src="/files/4QeQrAbMxm8TDrYcfNj7" alt=""><figcaption><p>Add content for each extra field</p></figcaption></figure>

#### Call-to-action button "Request A Quote"

By editing each article, you'll see "Project Link Information" on the right side, just enter the button's title and link here.&#x20;

<figure><img src="/files/TX2MK2hgXUnaDYnrmqcB" alt=""><figcaption><p>Set up the call-to-action button</p></figcaption></figure>

### Single Project Layout

Please go to TZ Portfolio+ > Styles > Install "Maya style", then go to the Layout section > edit Maya - Default layout

<figure><img src="/files/EVVOZ2lnUA1vjtyFhtBk" alt=""><figcaption><p>Project's single layout</p></figcaption></figure>

### Related Articles

To display related articles in detailed project pages, please edit TZ Portfolio+ categories > Article View Options > Related Articles > enable "Show Related Article"

Select an option to show related articles by tags or categories

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