# Integration with Motors theme

{% hint style="success" %}
**Motors VIN Decoder Pro** version allows you to access dealer maintenance and car classifieds & listings by the autocomplete feature with the integration of Motors theme. 
{% endhint %}

With the help of **Motors VIN Decoder Pro** autocomplete feature, you can easily match and categorize the listings of your cars or car accessories.

{% hint style="warning" %}
You should install the [Motors theme ](https://stylemixthemes.com/motors/)first before installing *Motors VIN Decoder Plugin.* You can review the[ Motors Theme Manual ](https://docs.stylemixthemes.com/motors-theme-documentation/)to know more about it.
{% endhint %}

After activating it, you should import your theme layout. This plugin works with dealership layouts and classified layouts 1-4. As an example, Motors Theme Classified layout will be used below.

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzdGQ29iQ_kOeRzxNm%2Fimage.png?alt=media\&token=f69b8e07-9673-4070-b72e-6f7a7dbd4b5a)

{% hint style="success" %}
[Motors theme](https://stylemixthemes.com/motors/) provides additionally many awesome plugins for free and among those plugins, there is also [Motors - Car Dealership, Classifieds & Listings](https://wordpress.org/plugins/motors-car-dealership-classified-listings/) plugin that allows you to match your listings options with the *API options* with VIN Decoder Services in an automatic and fast way.API options with Autocomplete feature
{% endhint %}

{% hint style="success" %}
You can see *API options* of each VIN Decoder Providers after input fields of specific keys. Those API options can be matched with the properly provided options of what **Motors - Car Dealership, Classifieds & Listings** plugin. This matching is crucial for achieving an autocomplete feature.
{% endhint %}

After the API key input field, you can see the NHTSA API options are available in the following image. The highlighted selection dropdown list which is come from Motors - Car Dealership, Classifieds & Listings plugin.

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKkgk4AWoXIFocO9HHU%2F-MKki3oLsLDXWY6aBxkD%2Fimage.png?alt=media\&token=100586e1-5b3b-4313-94a2-27a7f8dd2103)

{% hint style="info" %}
Each VIN service provides *different API options* and car standard information.
{% endhint %}

You can match those API options due to your VIN Service that will be automatically shown on your listings page. Or you can just skip these options with defaults. **API options matching** is used when you add a new vehicle to your cars' listing.

{% hint style="success" %}
Entering the VIN number of a vehicle is enough to see the autocomplete form of adding a car page.
{% endhint %}

First, let's see how the autocomplete feature works. In all six providers, it works in the same manner. You should match API options from the selection list:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKYdID-LKt-u3na4Lex%2F-MKZgC_rzPP743XODHVM%2Fimage.png?alt=media\&token=80e764f1-ec52-4dbe-a579-2c6a18edecec)

After saving your API options matching, you should open the add a car page in your dashboard or in the front view.

{% hint style="success" %}
The autocomplete feature is available in WordPress Dashboard as well as in the frontend of the page.
{% endhint %}

Frontend View example with autocomplete feature:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKYdID-LKt-u3na4Lex%2F-MKZh4dYsDHB6tXjdyT8%2Fimage.png?alt=media\&token=e421372c-8fe4-400c-8157-458d84152072)

Backend View (WP Dashboard) with autocomplete feature before applying the code:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKYdID-LKt-u3na4Lex%2F-MKZhtdfAQ43FeXhex5Z%2Fimage.png?alt=media\&token=a009385d-336e-4e3a-8e9e-2f3c1d0c19c5)

Backend View (WP Dashboard) with autocomplete feature after applying the code:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKYdID-LKt-u3na4Lex%2F-MKZiOr1OM2ph5CC6FHA%2Fimage.png?alt=media\&token=a60e7215-cbd9-4af8-afca-0ecb30b5284f)

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MKYdID-LKt-u3na4Lex%2F-MKZiTJgWT1FckdCMDpz%2Fimage.png?alt=media\&token=d1ea54a8-026f-4ceb-a053-d32884e48370)

As you can see, make, model, year, fuel type, mileage options are the same in the backend and in the frontend.

Below we will discuss all VIN Services, their API options with autocomplete feature, and integration with the Motors Theme and will see sample examples relatively. However, there is the same step for all VIN services, and this step is inserting the shortcode into the page and the result of it.

## Adding STM VIN History Widget

{% hint style="success" %}
Users can check ***Vehicle History Data*** by adding the STM VIN History widget to the widgets of your website.
{% endhint %}

***Vehicle History Data*** gives you the history report of the vehicle with a stolen, accident, and the odometer information in addition to vehicle specifications. 

{% hint style="warning" %}
You should buy the **Motors Vin Decoder Pro** version to get the history report feature. This plugin works with [Vin Audit ](https://docs.stylemixthemes.com/motors-vin-decoder/vin-decoder-specification-providers/vin-audit)and [VinDecoer.eu](https://docs.stylemixthemes.com/motors-vin-decoder/vin-decoder-specification-providers/vindecoder.eu) Services to give the vehicle history data.
{% endhint %}

After activating the pro version of this plugin, you will see the Vin-Decoder History Providers section. You can choose your service according to your Vin-Decoder Specification Providers.

{% hint style="danger" %}
The chosen Vin-Decoder History Provider only works if your Vin-Decoder Specification Provider Default is the *same* as it. 
{% endhint %}

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJs1uVVkzlpR2KX_XgU%2F-MJs2PRByVrK1sP8630H%2Fimage.png?alt=media\&token=2bfbcb91-5270-412a-9c5d-4e003fd73181)

{% hint style="danger" %}
You must add the STM Vin History widget to your widgets list so that you can get Vehicle History Data.
{% endhint %}

In order to add the STM Vin history widget, please go to **WordPress Dashboard > Appearance > Widgets** section.

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJs1uVVkzlpR2KX_XgU%2F-MJs3cwZSAoxJi-Fp7t4%2Fimage.png?alt=media\&token=f40902a5-dd2e-4541-aa93-fee610c34ca0)

Scroll down the widgets page and find an STM Vin History widget:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzjaPXeT5ULJ287whg%2Fimage.png?alt=media\&token=5f4935ef-b796-4175-834f-802f98b367ef)

Open that widget and add it to STM Listing Car Sidebar by clicking the Add Widget button:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzjvlmzOM3TA6-EOcu%2Fimage.png?alt=media\&token=72a1865d-c6b1-4638-b289-edbe63f10549)

{% hint style="danger" %}
Do not forget to give a **button title** on the STM VIN History widget and **save** your work.
{% endhint %}

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzlJimU40yCFTXegu-%2Fimage.png?alt=media\&token=0a8a9e2e-93ab-4f21-832a-84a689026656)

Go to **WordPress Dashboard > Listings** **> All Items**(Motors - Car Dealership, Classifieds & Listings plugin) :

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzm8saa7jXQlLRp7W9%2Fimage.png?alt=media\&token=df6f4a4b-ecc8-4469-a283-a6705a3167e5)

Choose any of your created vehicles and view it to check the STM Vin History widget appearing on the sidebar:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzq51XAk6QYPR1W6E_%2Fimage.png?alt=media\&token=3da55081-eb7a-4c52-b279-840570f484e8)

The opened car page will be like below with the **Check VIN History** button on the right sidebar, click that button:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzqJiZKIZbdvCtpi3_%2Fimage.png?alt=media\&token=a022c91c-ba18-443b-b9a9-1f453b89e8a3)

You can see the **history data** like below:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzpndJUzzzKFTlyfzz%2Fimage.png?alt=media\&token=7e152ec2-2d7c-402f-8be7-eced32e88bc6)

You can also see the **specifications** of the vehicle like below:

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzqhnsPmNoLqOQsqfh%2Fimage.png?alt=media\&token=301e9ef0-9ebf-4b4c-af86-fb70935aa13f)

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzqtMDDwIvCElRDE3W%2Fimage.png?alt=media\&token=3d8963ae-004f-4ef7-9517-0bd2b891939b)

![](https://1124057022-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MDTOD84paEr3fL3b0hg%2F-MJzOoUmuDzaABbZxRQ9%2F-MJzqzXuAGIecnJI3Nnj%2Fimage.png?alt=media\&token=c2c1acbd-f4f3-4377-8da5-3ee5cda524a0)