# Add Listing

It is recommended to create a special page where private sellers and dealers can publish their listings.&#x20;

1. [Enabling the "Add a Car" Button on the header.](#enabling-the-add-a-car-button-on-the-header)
2. [How to build a "Listing Submission" page with Elementor.](#how-to-build-a-listing-submission-page-with-elementor)
3. [How to build a "Listing Submission" page with WPBakery.](#how-to-build-a-listing-submission-page-with-wpbakery)

## Enabling the "Add a Car" Button on the header

In Classified layouts, the **"Add a Car"** button can be displayed in the header navigation. To do this go to the **WP Dashboard > Theme Options > Header > Buttons/Actions** and enable "Show Add a Car Button":

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FIbth7u0R20MAgrdnzU1I%2Fimage.png?alt=media&#x26;token=21892b42-c979-41d1-8a20-6659ba4a1725" alt=""><figcaption></figcaption></figure>

Customize the label, change colors, and set a link for the page with the Add a Car form.

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FAumo4GNl2IKW3f6TwWQ0%2FMotors%205.17%20-%20Theme%20Options%20add%20car%20button%20added.png?alt=media&#x26;token=d9b0d17b-70b2-4134-938c-34dc8eaf0a5f" alt=""><figcaption></figcaption></figure>

To make the button work, the page should contain **"Add Listing"** or **"STM Add a car"** widgets based on the page builder.

## How to build a "Listing Submission" page with Elementor

The page where users submit listings comes with demo import and it has the following view by default:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FGfMkvCN9tIuKuDqHtCHL%2FMotors%205.17%20-%20Theme%20Options%20add%20car%20elementor.png?alt=media&#x26;token=d7ceb270-3e4e-4445-ad69-c703b9b0046b" alt=""><figcaption></figcaption></figure>

By editing the page it is possible to apply the default Advanced settings of Elementor:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Fk95Bl7g0BeIiEdNTK4Dd%2FMotors%205.17%20-%20Theme%20Options%20add%20car%20elementor%20edit.png?alt=media&#x26;token=288b91e8-43bc-4d46-a185-f310d60d0f78" alt=""><figcaption></figcaption></figure>

The Content of the form is managed from the Motors Plugin directly. Refer to this manual to get more info:

{% content-ref url="../single-listing/add-listing-form" %}
[add-listing-form](https://docs.stylemixthemes.com/motors-theme-documentation/single-listing/add-listing-form)
{% endcontent-ref %}

## How to build a "Listing Submission" page with WPBakery

{% embed url="<https://youtu.be/aSY87n5S_vc?si=mSpjMVOZH6a0VoSR>" %}

The page where users submit listings comes with demo import and it has the following view by default:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FGfMkvCN9tIuKuDqHtCHL%2FMotors%205.17%20-%20Theme%20Options%20add%20car%20elementor.png?alt=media&#x26;token=d7ceb270-3e4e-4445-ad69-c703b9b0046b" alt=""><figcaption></figcaption></figure>

It is possible to adjust settings and add custom content by editing the page.

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FqizXWDqTuOaWuck3LFzA%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery.png?alt=media&#x26;token=b04327c9-2fd7-476a-9d24-cfa9fcbdaa3c" alt=""><figcaption></figcaption></figure>

The **STM Posts Available** widget - shows the number of slots available for the user to upload their listings.

The **STM Add a Car** widget generates a form for adding listing details with the following customizable settings:

### Step 1. General:

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FtEXPpyctRFEUEFRxnuyc%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20general.png?alt=media&#x26;token=eab1138f-ec96-4ffd-a6fc-ab71f8851018" alt=""><figcaption></figcaption></figure>

* **Include car title** - When the option is enabled, Users/Dealers can set a custom title for the listing.&#x20;
* **Main taxonomies to fill** - select which categories are compulsory to select before submitting the listing.
* **Show number fields as input instead of dropdown** - when the option is enabled users can type numbers on themselves. Otherwise, the system displays a drop-down with numbers to select.
* **Allowed histories** - Car history providers that dealers can use.
  {% endtab %}

{% tab title="How the page appears" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FFD2LqjXIo1Fy2jl2heA8%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20general%20rendered.png?alt=media&#x26;token=da6896be-035e-4403-9291-b913f82c0c4c" alt=""><figcaption></figcaption></figure>

{% hint style="info" %}
In the Screenshot above the required fields are marked with "**\***".
{% endhint %}
{% endtab %}
{% endtabs %}

### Step 2. Features:

In this section, users and dealers can select additional features for the car they are publishing.

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2F1SaKMZFAfxfkBOAJvi3I%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20features.png?alt=media&#x26;token=e0ecd9a3-4c81-4be3-881f-480db0e7e621" alt=""><figcaption></figcaption></figure>

Site administrators can group the listing features by assigning a title to the group in the settings. Please type the car features separated by commas without any additional spaces.
{% endtab %}

{% tab title="How the page appears" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Fu3o1Dpy7lC2t7nwSGnBK%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20features%20rendered.png?alt=media&#x26;token=58f0b031-7b9a-4f6c-acb5-ca5bef16cd63" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Step 3. Gallery

The listing images will be uploaded in the Gallery section.

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Fkxjachhs5TM3tslECrQ5%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20gallery.png?alt=media&#x26;token=a95762c8-12aa-47f8-949a-20a33c353991" alt=""><figcaption></figcaption></figure>

Site administrators can provide guidelines on how to upload images, including recommended resolution and size.
{% endtab %}

{% tab title="How the page appears" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FaN34QubCZI0uSWEoje2D%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20gallery%20rendered.png?alt=media&#x26;token=8b2ac536-ce43-48af-af4a-4b90f1c2ee0d" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Step 4. Videos

Users can upload multiple videos from hosting services like **YouTube** and **Vimeo**.

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Frh19946Bz8r1GUDM9Vg4%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20video%20rendered.png?alt=media&#x26;token=e2ede29d-f1e3-4e61-9bf7-3ad25bbc042e" alt=""><figcaption></figcaption></figure>

### Step 5. Phrases

In this section, users and dealers can provide a short description of their listing.

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FhwQ81HlN4Ble37xFxXZZ%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20phrases.png?alt=media&#x26;token=f89f363c-d39c-465e-a54a-95e389afe834" alt=""><figcaption></figcaption></figure>

In the settings, it is possible to define template phrases by separating them with commas.
{% endtab %}

{% tab title="How the page appears" %}
Default view:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Fe84cIGTXORSFGTj9cMJD%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20seller%20notes.png?alt=media&#x26;token=85ac8b89-4f3d-46eb-b132-6f1dd18220e7" alt=""><figcaption></figcaption></figure>

When the "**Add Template Phrases**" button is clicked, it is possible to select several pre-written sentences to use as a car description:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2F1GOJHfQbn0jkrBhkf3ud%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20seller%20notes%20select.png?alt=media&#x26;token=bbbdf24f-676e-4d9b-96f7-53ac21821867" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Step 6.  Price

You can set the price for uploading a listing in this section.

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FCcXUGsXYN99khjdgQKGq%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20price.png?alt=media&#x26;token=3b7f7116-2f04-4e29-ae67-eaf768e3ac15" alt=""><figcaption></figcaption></figure>

**Price label** - The label from settings appears behind the price.

**Show Sale Price label** - When Enabled, users/dealers can set the sale price while uploading the listing.&#x20;

**Sale Price label** - Custom label for the sale price.

**Show Custom label** - When enabled, the price is hidden and a custom label appears. Customers must request the car price through a form.
{% endtab %}

{% tab title="How the page appears" %}
Default view:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FW4I0XpyIoxDer6S649cV%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20price%20rendered.png?alt=media&#x26;token=f4d9ef67-90d2-401a-99c6-29c798abe2fa" alt=""><figcaption></figcaption></figure>

When the **Sale price** and **Custom labels** are enabled:

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FHKyGg2P4uSsksG2SFYJ1%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20price%20with%20custom%20label.png?alt=media&#x26;token=1bc75b86-49a3-4ebe-a276-ff7be42c958a" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Register/Login user

When a guest user tries to upload a listing, they will be offered the option to create a new account or log into an existing one.

{% tabs %}
{% tab title="Widget Settings" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2Fpta4XF5udxvV6IViAnub%2FMotors%205.17%20-%20Add%20listing%20with%20WPBakery%20register%20form.png?alt=media&#x26;token=4cf14d66-f993-42dd-b5a8-908c6a67d5d4" alt=""><figcaption></figcaption></figure>

Administrators of the site have the ability to notify users who are in the process of creating their accounts.
{% endtab %}

{% tab title="How the page appears" %}

<figure><img src="https://2954064479-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDP3ivYPbpYO9Rs_wuB%2Fuploads%2FeOgHUwDQpqFzZWE3reQQ%2FMotors%205.17%20-%20add%20car%20login.png?alt=media&#x26;token=9fb3c916-5ac8-472a-9a3a-1586b0cc713a" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

{% hint style="info" %}
The layout of all published listings will be displayed according to a single listing template.
{% endhint %}

{% content-ref url="../single-listing/listing-templates" %}
[listing-templates](https://docs.stylemixthemes.com/motors-theme-documentation/single-listing/listing-templates)
{% endcontent-ref %}
