How To Display Custom Post Type In Elementor | CPT UI & Ele Custom Skin

Tutorial: How to Display Custom Post Type in Elementor Using CPT UI & Ele Custom Skin

Step 1: Install and Activate CPT UI Plugin

1. Go to your WordPress dashboard.
2. Navigate to the "Plugins" section and click on "Add New."
3. Search for the "Custom Post Type UI" plugin.
4. Click on "Install Now" and then activate the plugin.

Step 2: Create Custom Post Types

1. In the WordPress dashboard, locate the "CPT UI" section on the left-hand side.
2. Under "CPT UI," choose "Add/Edit Post Types."
3. Fill in the required fields such as post type slug, plural label, and singular label.
4. Scroll down to the additional labels section to add optional descriptions and names.
5. Configure settings like making the post type public, queryable, and hierarchical.
6. Set the post type to show in the menu and adjust other settings as needed.
7. Click on "Add Post Type" to create your custom post type.

Step 3: Create Custom Taxonomies

1. In the WordPress dashboard, go to the "CPT UI" section and select "Add/Edit Taxonomies."
2. Enter the taxonomy slug, plural label, and singular label.
3. Associate the taxonomy with the custom post type you created earlier.
4. Configure settings like rewrite, hierarchical, and admin column display.
5. Save the taxonomy settings.

Step 4: Design Custom Loop Templates Using Ele Custom Skin

1. Install and activate the "Ele Custom Skin" plugin.
2. Create a new template for the custom loop in Elementor under the "Templates" section.
3. Customize the loop template by adding dynamic data elements like post title and post terms.
4. Style the loop template as desired using Elementor's design options.
5. Save and update the loop template.

Step 5: Display Custom Post Type in Elementor Archive

1. Edit the archive page where you want to display the custom post type.
2. Select the "Custom" skin option under the skin section.
3. Choose the loop template you created using Ele Custom Skin.
4. Adjust the layout settings such as the number of columns and other display options.
5. Save the changes and preview the custom post type display on your website.

Conclusion:

By following these steps, you can effectively create and display custom post types in Elementor using the CPT UI plugin for post type creation, Ele Custom Skin for loop template design, and Elementor for customization and display. This comprehensive approach allows for a more advanced and unique WordPress website development without relying on additional plugins.