---
title: "How to Create Elementor Custom Post Type Loop Skin?"
url: https://theplusaddons.com/docs/create-elementor-custom-post-type-loop-skin/
date: 2023-08-28
modified: 2026-04-10
author: "Aditya Sharma"
description: "Do you want to make your custom post type loop design really stand out from the crowd? For this, you can use the custom skin feature of the Dynamic Listing..."
image: https://theplusaddons.com/wp-content/uploads/2023/08/How-to-Create-Elementor-Custom-Post-Type-Loop-Skin_-1024x536.jpg
word_count: 849
---

# How to Create Elementor Custom Post Type Loop Skin?

## Key Takeaways

- The Plus Addons for Elementor includes a Dynamic Listing widget that allows users to create custom post type loop skins.
- Users can create a custom post type called Cars using the free Advanced Custom Fields (ACF) plugin.
- Custom fields such as Mileage, Transmission, Date, and Price can be added to the custom post type using ACF.
- The Dynamic Listing widget supports up to 5 templates together for displaying multiple layout designs.

Do you want to make your custom post type loop design really stand out from the crowd? For this, you can use the custom skin feature of the Dynamic Listing widget from The Plus Addons for Elementor. 

A custom post type loop skin is essentially a template that allows you to display custom post types in a specific way.

*To check the complete feature overview documentation of The Plus Addons for Elementor Dynamic Listing widget, [click here](/docs/dynamic-listing-widget-settings-overview/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-listing//#dynamic-listing-wgts?utm_source=tpae&utm_medium=docs&utm_campaign=text)

https://www.youtube.com/watch?v=ID5BWK0yP3A

To do this, follow the steps -

For instance, we will be creating this custom post type layout design.

![dynamic listing custom post type custom skin demo](https://theplusaddons.com/wp-content/uploads/2023/08/dynamic-listing-custom-post-type-custom-skin-demo.png)

For creating a custom loop skin, we recommend using the [Elementor Pro](https://elementor.com/pro/) plugin for fetching dynamic data.

### Create a Custom Post Type

To create a custom post type you can use the free[ Advanced Custom Fields (ACF)](https://wordpress.org/plugins/advanced-custom-fields/).

For instance, we’ll create a custom post type called Cars.

1. From the Dashboard, go to **ACF** > **Post Types** and click on **Add New**.

![](https://theplusaddons.com/wp-content/uploads/2023/08/tpae-dynamic-listing-custom-post-type-loop-skin-acf-1.png)

2. On the next page add the post type name and adjust the settings as per your requirement. Once done click on the **Save Changes** button to create the post type.

![](https://theplusaddons.com/wp-content/uploads/2023/08/tpae-dynamic-listing-custom-post-type-loop-skin-acf-2.png)

### Add Custom Fields to Custom Post Type

Now, we’ll create some custom fields for our custom post types.

1. To do this from the Dashboard, go to **ACF** > **Field Groups** and click on **Add New** button. 

2. Add a name to the field group.

3. Then we’ll add a number field type and name it Mileage. 

![](https://theplusaddons.com/wp-content/uploads/2023/08/tpae-dynamic-listing-custom-post-type-loop-skin-acf-3.png)

Click on the **+Add Field** button to add more fields. Following the same process, we’ll add the following fields - 

- Transmission as a select field type.

- Date as a select field type.

- Price as a number field type.

4. Once done, from the **Settings** section, we’ll set the location to our custom post type **Car** under **Rules**.

![](https://theplusaddons.com/wp-content/uploads/2023/08/tpae-dynamic-listing-custom-post-type-loop-skin-acf-4.png)

5. Once done, click on the **Save Changes** button.

6. Then you have to add value in the custom fields on each Car post.

![custom fields custom post type](https://theplusaddons.com/wp-content/uploads/2023/08/custom-fields-custom-post-type.png)

### Create a Custom Post Type Loop Template

Now, you have to create a custom post type loop template using Elementor.

1. To do this from the Dashboard, go to **Templates** and click on **Add New**, then select **Section** as the template type, give a name to the template then click on **Create Template** button.

![create elementor custom post type loop template](https://theplusaddons.com/wp-content/uploads/2023/08/create-elementor-custom-post-type-loop-template.png)

> *Note: For creating this template we’ll use both The Plus Addons for Elementor *[*single post widgets*](https://theplusaddons.com/elementor-builder/blog-builder/)* and *[*Elementor Pro*](https://elementor.com/pro/)* widgets.*

2. Add a container then to add the post image, we’ll use the [Post Featured Image](https://theplusaddons.com/elementor-builder/blog-builder/post-featured-image/) widget and style it according to your requirement.

3. Then, for the post title, we’ll use the [Post Title](https://theplusaddons.com/elementor-builder/blog-builder/post-title/) widget and style it according to your requirements. 

4. Now to add the price, we’ll use the Elementor Heading widget and to make it dynamic, click on the **Dynamic Tags** in the **Title** field and select **ACF Field** under ACF.

Then click on the **ACF Field** and from the **Key** dropdown, select **Price**.

![dynamic custom post type price](https://theplusaddons.com/wp-content/uploads/2023/08/dynamic-custom-post-type-price.gif)

Style it according to your requirements.

5. Now, we’ll add a three column container to show more details. On the left column, we’ll add the Elementor Icon widget then we’ll add the Elementor Heading widget.  

To make it dynamic, following the above mentioned process, click on the **Dynamic Tags** in the **Title** field and select **ACF Field** under ACF.

Then click on the **ACF Field** and from the **Key** dropdown, select **Mileage**.

![dynamic custom post type mileage](https://theplusaddons.com/wp-content/uploads/2023/08/dynamic-custom-post-type-mileage.png)

Style it according to your requirements.

6. In the same process, we’ll add the remaining two custom field values, Transmission and Date then style both according to your requirements.

7. Once done, publish the template.

> *Note: Following this process, you can use different widgets to create the layout as well and make them dynamic using the Dynamic Tags of Elementor Pro.*

### Use the Template With Dynamic Listing Widget

Once you have created your custom post type loop layout, use it with the Dynamic Listing widget.

1. Add the Dynamic Listing widget on a page or template.

2. Select the appropriate listing type from the **Post Listing Types** dropdown (except ACF Repeater) and select your custom post type from the **Post Type** dropdown.

3. Then select **Custom Skin** from the **Style** section.

4. Now, you have to select your template from the **Select a template** dropdown.

You can turn on the **Multiple Loops** toggle to use multiple layout designs together for your listing. You can use up to 5 templates together.

> *Note: In order to use Multiple Loops, you have to create separate custom templates for each loop template.*

5. Then, you have to select the appropriate layout type from the **Layout** section.

> *Note: For using Masonry and Metro layout, you have to design your templates accordingly.*

6. If you are using multiple loops, you can arrange the templates in reverse or random order from the **Template Order** dropdown.

Now, your custom posts will show in your custom layout.

Also, read [How to Show Posts from Multiple Post Types in Elementor](https://theplusaddons.com/docs/show-posts-from-multiple-post-types-in-elementor/).

## Frequently Asked Questions

**Q: What should I do if my custom post type isn't showing up in Elementor?**
A: If your custom post type isn't appearing, ensure that you've created it correctly using the Advanced Custom Fields (ACF) plugin. After adding your custom post type, check that you've saved the changes. Additionally, verify that the Dynamic Listing widget from The Plus Addons for Elementor is installed and activated, as it is necessary for displaying custom post types.

**Q: What is the best way to style my custom post type loop template in Elementor?**
A: For optimal styling of your custom post type loop template, use a combination of The Plus Addons for Elementor single post widgets and Elementor Pro widgets. This approach allows for greater flexibility and design options. Remember to style each widget according to your requirements to ensure a cohesive look across your custom post type layout.

**Q: How do I add multiple custom templates for my custom post type loop?**
A: To use multiple custom templates for your custom post type loop, first create separate templates for each layout you want to display. Then, in the Dynamic Listing widget settings, enable the Multiple Loops toggle. You can arrange these templates in reverse or random order from the Template Order dropdown, allowing for varied presentations of your posts.
