How to Import Templates From WDesignKit Public Library to Your Elementor or Gutenberg Site?

If you want to quickly build pages using professionally designed layouts, you can import templates directly from the WDesignKit Public Library. This library contains templates shared by other WDesignKit users and designers, allowing you to reuse high-quality layouts for your own website.

You can import full pages, sections, or complete website kits and customize them according to your needs. This makes it easy to speed up your website design process, whether you’re using Elementor or Gutenberg.

Requirement  – This feature is a part of The WDesignKit, make sure it’s installed & activated to enjoy all its powers.

To start importing templates:

1. Go to WDesignKit → Templates → Browse Templates from your WordPress dashboard.
   
2. This page displays all templates shared publicly by you and other WDesignKit users.
   

You can use the Filter panel on the left to quickly find the templates you need.

Available filters include:

• Search Templates

• AI Compatible (Templates)
  
• Page Builder (Elementor or Gutenberg)
  
• Free or Pro templates
  
• Template Type (Page Kits, Full Pages, Sections)
  
• Plugins (Elementor, Elementor Pro, The Plus Addons for Elementor, and The Plus Addons for Elementor Pro)

Note: Depending on the selected Template Type, the relevant options will be displayed.

You can also identify template types easily using the icons displayed beside each template.

Import Page or Section Template

To import a Page or Section template, follow these steps:

1. Select the Page Builder

From the Browse Templates page, choose the page builder you want to use from the Page Builder filter.

You can switch between:

• Elementor templates
  
• Gutenberg templates
  

2. Choose Template Type

From the Template Type, select:

• Full Pages – to import complete page layouts
  

• Sections – to import specific page sections

3. Import the Template

Hover over the template you want to use and click the Download icon.

Once you click the download icon, the template setup process will start automatically.

A pop-up titled Setting Up Your Template will appear, showing the progress of the template import process.

The system will automatically prepare everything required for the template.

4. Install Required Plugins & Themes (Automatic Setup Process)

During the setup process, WDesignKit will automatically perform the following steps:

• Installed Plugins and Theme – Required plugins and themes will be installed and activated automatically if they are not already installed.
  
• Plugin Settings – Necessary plugin settings will be configured to ensure the template works properly.
  
• Theme Settings – Required theme-related settings will be applied.
  
• Import Template – Finally, the selected template will be imported to your website.
  

You can see the progress of each step directly inside the setup popup.

Notes:

• If a required plugin is already installed but inactive, it will be automatically activated.
• Premium plugins will not be installed automatically.
• If the template depends on premium plugins, some elements may not appear correctly.

5. View the Imported Template

When the import process is complete, a success message will appear:” Template Imported Successfully”.

Click View Template to open the imported page and start customizing it.

Import Website Kit

A Website Kit contains a complete set of templates such as pages and sections designed to build an entire website quickly. Using a Website Kit allows you to import a full website structure and customize it according to your needs.

Step 1: Select the Page Builder

After navigating to WDesignKit → Templates → Browse Templates, choose the Page Builder you want to use from the filter panel.

You can select:

• Elementor
  
• Gutenberg

Note: You can also use the Search bar to quickly find specific templates. Additionally, you can enable the AI Compatible filter to display templates that support AI-based content customization.

Step 2: Choose Template Type

In the Template Type section, select Page Kits.

This will display all available website kits that you can import.

Step 3: Select the Kit Category

Under the Page Kits section, check the box next to the type of kit you want to use.

Available options may include:

• Agency
  
• WooCommerce
  
• Creative Kit
  
• Portfolio
  
• Entertainment
  
• Blog
  

This helps you filter and find the website kit that matches your needs.

Step 4: Select Required Plugins

Scroll down to the Plugins section and select the plugins required for your template.

For example:

• Elementor
  
• Elementor Pro
  
• The Plus Addons for Elementor
  

Step 5: Start Website Kit Import

Once you find the website kit you want to use, hover over it and click the Download icon.

This will open the Website Kit Setup Wizard.

Step 6: Enter Website Details

On the first screen, you need to provide basic website information.

Fill in the following details:

• Business Name
  
• Business Tagline
  
• Logo
  

You can also add additional content, such as:

• Address
  
• Email
  
• Phone Number
  
• Social Media Links
  

Once completed, click Next to proceed.

Step 7: Select Fonts and Color Palette

Now customize the design style of your website.

You can:

• Choose a Font Pair for headings and body text (e.g., Figtree).
  
• Select a Color Palette for your website.
  
• Add custom colors if needed.
  

These settings define your website’s visual identity and design style.

Click Next to continue.

Step 8: Choose Kit Features

On the next screen, select the features required for your website.

Available options may include:

• eCommerce (for WooCommerce stores)
  
• Dynamic Content
  
• Performance Optimization
  
• Security Tools
  
• Extras (Forms, Popups, etc.)
  
• Nexter Theme (recommended for better compatibility)
  

Before proceeding:

1. Enable the required toggles.
   
2. Read the backup notice carefully.
   
3. Check the box “I’ve read this and want to continue.”
   

Then click Next.

These options help configure your website functionality.

Step 9: Content & Media Setup (Import Options)

Next, choose how you want the content to be imported.

9.1 Import Dummy Content (Direct Import Flow)

You’ll see two main options:

Import Dummy Content

• Imports ready-made sample pages, text, and media.
  
• Matches the selected demo preview.
  
• Best if you want a quick starting point that you can edit later.

Import as Wireframe (Layout Only)

• Imports only the website structure/layout.
  
• No real content or images are added.
  
• Placeholder images will be used instead.
  
• Useful if you prefer building everything from scratch.

After choosing an option, click the Import button.

• The import process starts immediately.
  
• Demo content (pages, images, layout) is added to your website.
  
• Once completed, you are redirected to the editor.

9.2 Smart AI Content (Beta)

• Generates website content automatically using AI.
  
• Uses your business details to create relevant, on-brand copy.
  
• Ideal if you want a faster, more personalized setup.

Generate AI Blog Posts

• Automatically creates blog content using AI.
  
• Helps you launch your website with ready-to-publish articles.

Import as Wireframe

• Imports only the website structure/layout.
  
• No real content or images are added.
  
• Placeholder images will be used instead.
  
• Useful if you prefer building everything from scratch.

Once you select the option and click Next, you’ll be guided through the AI setup:

Step 9.2.1: Tell Us About Your Website

Fill in the following details:

• About Website: Enter your website or business name.
  
• Language: Choose your preferred language.
  
• Industry Type: Select the category that best fits your business. Options include:
  
  • Kitchen Staff
    
  • Collection
    
  • Tech Professionals
    
  • Educators
    
  • Coaches
    
  • Doctors
    
  • And more (e.g., Social Workers, Hospitality, Agriculture, Industrial Workers, Musicians, etc.).
    
• Website Description: Write the description manually, or click “Write Using AI” to generate it automatically.

Step 9.2.2: Choose Your Images & Proceed

• After filling in all details, click Next.
• You’ll be taken to the Image Selection Screen (only if the “Import as Wireframe” switch is disabled).

Note: If Import as Wireframe is enabled, this step will be skipped, and no images will be required.

      

• The system will use this information to prepare your website content.

Image Selection Options

You’ll see the following tabs:

Use the search bar to find images (e.g., chef, startup, fitness) and apply filters like All, Landscape, or Portrait.

• Stock Images – Browse from a built-in image library
  
• Lummi Images – Explore curated AI images
  
• Upload Your Images – Add your own files (PNG, JPEG, WebP, AVIF up to 20 MB)
  
• Selected Images – View and manage chosen images
  

Selecting Images

• Click on any image to select it
  
• You can select multiple images
  
• Selected images will appear under the “Selected Images” tab

Note: If you click Import without selecting any images, you’ll see this error: Oops! No Images Selected. It seems you haven’t selected any image yet!

To proceed, select at least one image.

Once you’ve selected your images, optionally review them in Selected Images and click Import to proceed.

Step 10: Website Kit Import Process

Once the import starts, the system will automatically perform several setup tasks.

You will see the progress of the following steps:

• Installing Plugins & Theme
  
• Importing Site Content
  
• Setting Up Pages & Layout
  
• Finalizing Settings
  

If any required plugins are already installed but inactive, WDesignKit will activate them automatically.

You can also install plugins individually if required.

After the import process is completed, you will see the message:

Success! Your Website is Ready.

You can now:

• Click Preview Site to view the imported website kit.
  
• Start customizing the website using your selected page builder.
  

Your website is now fully set up and ready to use.

Import Template From Elementor Editor

You can import WDesignKit templates directly while editing a page in Elementor.

Steps

1. Open any page or post and click Edit with Elementor.
   
2. Click the WDesignKit icon inside the editor.
   
3. A pop-up will open — go to the Templates section.
   
4. Browse the available templates and hover over the template you want to import.
   
5. Click the Download icon to start the import process.
   

Once the download icon is clicked, the automatic template setup process will begin. Refer to the Template Setup Process section below for more details.

When the import process is complete, the template will be inserted directly into the current page.

Note: It won’t download the premium plugins.

Note: You can also click on the Continue Anyway link it will only install the template without installing the required plugins, but the template might be missing some elements.

If you import a Page & Section, new pages will be created based on the selected templates.

Import Template From WordPress Editor

You can also import templates directly while editing a page in the WordPress block editor.

Steps

1. Open any page or post using the WordPress (Gutenberg) editor.
   
2. Click the Import Templates – WDesignKit button at the top.
   
3. You will be redirected to the Templates section.
   
4. Hover over the template you want to import.
   
5. Click the Download icon to start the import process.
   

Once the download icon is clicked, the automatic template setup process will begin. Refer to the Template Setup Process section below for more details.

After the import process is completed, the template will be added to your page or post.

Note: It won’t download the premium plugins.

Note: You can also click on the Continue Anyway link it will only install the template without installing the required plugins, but the template might be missing some elements.

If you import a Page & Section, new pages will be created based on the templates included in the kit.

Template Setup Process (Common for All Imports)

When you click the Download icon, WDesignKit automatically prepares everything required for the template.

A pop-up titled Setting Up Your Template will appear, showing the progress of the import process.

During the setup process, WDesignKit will automatically perform the following steps:

• Installed Plugins and Theme – Required plugins and themes will be installed and activated if they are not already installed.
  
• Plugin Settings – Necessary plugin settings will be configured to ensure the template works correctly.
  
• Theme Settings – Required theme-related settings will be applied.
  
• Import Template – The selected template will be imported into your website.
  

You can see the progress of each step directly inside the setup popup.

Once the process is completed, the template will be successfully added to your page.