Please follow the easy steps below to install the theme and the demo content:
- Check Technical Requirements
- Download Theme
- Install Theme
- Install Two Plugins
- Import Templates / Demo Content Installation
- Customize Your Website / Post-Import Setup Guide
To install the theme you must have a working version of WordPress already installed. Make sure you have a clean WordPress setup. This installation guide will help you to install WordPress.
If you are new to WordPress please check Lessons.
We also recommend you WordPress Documentation and WordPress FAQs as a handbook.
1. Check Technical Requirements
For a smooth demo installation, please ensure your web hosting meets the following requirements:
- PHP version 7.4 or greater (we recommend 7.4, as it’s the most widely supported by plugins)
- MySQL version 5.6 or greater OR MariaDB version 10.1 or greater
- WordPress version 5.0 or greater, already installed
Please make sure before demo installation that the hosting has PHP 7.4 or greater. Additionally, we strongly recommend avoiding shared hosting for best performance and compatibility. Thank you!
2. Download Theme
- Go to Downloads
- Find the theme needed
- Click on Download button
- Choose “Installable WordPress file only“
5. ✅ Done.
3. Install Theme
1. Go to Appearance
2. Click on Add New
3. Click on Upload Theme
4. Choose File – the ZIP file you downloaded in Step 2
5. Click on Install Now.
If it shows issue: “The package could not be installed. The theme is missing the style.css stylesheet.” please make sure you are uploading only the installable theme which is called NameOfTheme.zip.
Notice
6. Click on Activate
7. ✅ Done.
4. Install Two Plugins
1. To make your website look like the demo website, you need to install the required plugins. Elementor and King Addons are the only plugins needed for the demo pages to work.
Install Elementor by clicking Install Elementor button (wait a moment while it installs), then click Activate Plugin. Do the same for King Addons plugin.
2. ✅ Done.
5. Import Templates / Demo Content Installation
1. Go to Appearance -> Import Templates. Example:
2. Choose a template and click on Import Template button to start the import.
The imported page should look like the one on the demo website. Use Go to imported page button to check the imported template. If you import the template again, it will NOT overwrite your already imported page — it will create a new page instead (e.g., template-name-2, template-name-3, template-name-4, etc.).
Note: You can find all imported pages in Pages section in the WordPress admin panel:
3. ✅ Done.
6. Customize Your Website / Post-Import Setup Guide
After importing the demo content, here’s where you can customize your site:
Theme Settings
Most theme options (colors, fonts, layout settings) are available in the Appearance -> Customize. Also check Documentation (here) it has explanation for each setting.
Header & Menu
Navigate to Appearance -> Menus to set up your navigation menu. Assign the primary menu in the menu locations settings. Header layout and styling options are in the Customizer under “Header Settings”.
Footer
Footer widgets can be configured under Appearance -> Widgets. Footer colors and copyright text are managed in the Customizer under “Footer Settings”.
Applying Page Templates and Blog with Sidebar
To change a page’s layout (e.g., full width, blog with sidebar), edit the page. In the Classic Editor, find the “Page Attributes” box and select a template from the dropdown. In the Block editor (Gutenberg), find the “Template” panel in the Page settings sidebar.
Black & White Menu Styles
For pages needing distinct black or white top menu bars, use these page templates: “Fullwidth + First Top Menu + Default Footer” or “Fullwidth + Second Top Menu + Default Footer”. You can then customize the colors for each style in the Customizer under “Header Settings”. Additionally, you can set different logos for the second menu style (“Second Logo”) and for inner pages (“Inner Page Logo”) within the “Header Settings” section.
Mobile Menu Close on Click
If you need the mobile menu to automatically close after a menu item is clicked (useful for one-page sites or anchor links), enable the “Close Mobile Menu After Click” option in the Customizer under “Mobile Menu Settings”.
Sticky Headers
To make the header stick to the top of the screen when scrolling: For desktop, enable the “Enable Sticky Header” option in the Customizer under “Header Settings”. For mobile, enable the “Enable Sticky Mobile Menu” option under “Mobile Menu Settings”.
Theme Translation
To translate the theme into another language, we recommend using the Loco Translate plugin. It allows you to easily find and translate theme strings directly within the WordPress admin area. Other translation plugins like WPML or Polylang are also compatible.
Custom WooCommerce Shop Template
If you need advanced customization for your WooCommerce shop, archive, product pages, and more, we recommend the ShopLentor plugin (formerly WooLentor). It offers extensive WooCommerce building capabilities for Elementor.While we recommend ShopLentor, other plugins offer similar functionality. You can search for alternatives in the WordPress plugin directory.
Explore the Customizer for all available options to fine-tune your website’s appearance!
WordPress Settings
You can find additional information in WordPress documentation, but we’ll describe the main options:
- Settings -> General. You can set here your email, timezone, and date format.
- Settings -> Reading. Use any of pre-build homepages, or you can use any other page of the site as a home page. Also, you are able to change the number of posts per page for the blog. 6, 8, or 10 is optimal for site performance.
- Settings -> Discussion. You can enable/disable the pre-moderation of comments here
CSS Customization
For minor changes, you are able to use Appearance -> Customize -> Additional CSS field. Basic information about CSS:
Also, you need an in-browser tool for CSS tweaks:
- Chrome Developer Tools (in Google Chrome)
- Inspector (in Firefox)
- Web Inspector (in Safari)
Possible Issues
Imported Template Looks Different
If the imported template looks different than the live preview then go to Elementor -> Tools -> Regenerate CSS -> Click on Regenerate Files button.
Elementor Stuck on the Loading Screen
We can’t provide support for third-party plugins directly, but you can follow the official Elementor help guide for this common issue: Elementor Stuck on Loading Screen.
Unable to Import Templates
The demo installation usually works on 99% of hostings, so issues are pretty exceptional. If you have a trouble with the import, please check the minimal hosting requirements from the Technical Requirements section above. Also, make sure your server configuration limits are:
memory_limit 512M
post_max_size 64M
upload_max_filesize 64M
max_execution_time 600
You can check them using the plugin to show PHP information. Contact your hosting provider, they must help you with server configuration.
Note: If you encounter any issues while importing the template (excluding hosting-related issues), please open a ticket in our Support.
You may also create a temporary login and password so we can check the issue manually. Please use support@duckthemes.com as the email. Thank you.