Draly

Support Purchase

See this tutorial video

About the Theme

Draly is a modern, responsive WordPress theme crafted to help you build professional websites with ease. Designed to work seamlessly with WooCommerce and Elementor, Draly is suitable for a wide range of websites – from online shops and corporate sites to portfolios and personal blogs.

With one-click demo import, a flexible theme options panel, and compatibility with popular plugins, Draly allows you to create a fully functional and visually stunning website without the need for advanced coding knowledge.

 

 

Key Features

• One-Click Demo Import: Set up your website in minutes with ready-to-use demo content tailored for online shops.
• Elementor Page Builder Support: Build and customize pages with drag-and-drop simplicity, no coding required.
• WooCommerce Integration: Create a powerful online store with flexible product options, shop layouts, and shopping features.
• Responsive & Mobile-Friendly: Optimized for all screen sizes, from mobile devices to large desktops, ensuring your customers shop smoothly anywhere.
• Advanced Theme Options: Control typography, colors, headers, footers, blogs, and shop layouts directly from the dashboard or the live preview customizer.
• Mega Menu Support: Design advanced navigation menus, including customizable mega menus built with Elementor.
• Custom Widgets & Sidebars: Add flexibility with widgetized areas across your shop, blog, and product pages.
• Translation & Multilingual Ready: Supports Loco Translate for theme text strings and Polylang for creating a multilingual store, making your site accessible to a global audience.

 

Dropshipping Power with ALD

Draly is built to be the perfect starting point for AliExpress dropshipping. With ALD – AliExpress Dropshipping and Fulfillment for WooCommerce fully supported, you can:

• Import products directly from AliExpress with just a few clicks.
• Set up pricing rules and markups to maximize your margins.
• Manage suppliers and product variations seamlessly.
• Simplify the order fulfillment process, from your store to your supplier.
• Streamline stock and order management to save time and reduce errors.

This tight integration with ALD makes Draly more than just a WooCommerce theme — it’s a complete dropshipping toolkit designed to help you launch and scale your AliExpress business with ease.

 

 

Requirements

Before installing Draly, make sure your website meets the following requirements:

WordPress Environment

• WordPress version: 5.8 or higher (latest version recommended)
• PHP version: 7.4 or higher (PHP 8.x supported)
• memory_limit = 512M
• max_execution_time = 300
• max_input_time = 300
• post_max_size = 128M
• upload_max_filesize = 128M
• max_input_vars = 5000

 

Required Plugins

Draly requires the following plugins for full functionality:

• VillaTheme Core
• One Click Demo Import
• Elementor Website Builder
• WooCommerce
• Contact Form 7
• ALD – Dropshipping and Fulfillment for AliExpress and WooCommerce

 

Recommended Plugins

For enhanced features, we recommend installing:

• YITH WooCommerce Wishlist
• YITH WooCommerce Quick View
• COMPE – WooCommerce Compare Products
• Pofily – WooCommerce Product Filters
• Free Shipping Bar for WooCommerce
• Boost Sales for WooCommerce
• Coupon Box for WooCommerce
• Product Size Chart For WooCommerce
• Sales Countdown Timer
• Thank You Page Customizer for WooCommerce – Increase Your Sales
• Classic Widgets
• Checkout Upsell Funnel for WooCommerce
• FEWC – Extra Checkout Fields For WooCommerce
• EU Cookies Bar
• CURCY – Multi Currency for WooCommerce
• Abandoned Cart Recovery for WooCommerce
• Photo Reviews for WooCommerce
• Notification for WooCommerce | Boost Your Sales – Recent Sales Popup – Live Feed Sales – Upsells
• Product Variations Swatches for WooCommerce
• Email Template Customizer for WooCommerce

 

 

Theme Installation

From WordPress Dashboard:

• Go to Appearance > Themes > Add New.
• Click Upload Theme and choose the .zip file.
• Click Install Now.
  
• After installation, click Activate.
  

 

 

 

Plugin Installation

After installing and activating the theme, you’ll need to install the required (and optionally recommended) plugins for full functionality. Make sure all required plugins are activated before importing demo content to ensure everything works correctly.

Go to Appearance > Install Plugins in your WordPress dashboard.

 

Select all the required plugins (and any recommended ones you wish to use).

From the Bulk Actions dropdown, choose Install and click Apply.

 

Once installed, use the same Bulk Actions menu to Activate the plugins.

 

Import Demo Content

After installing all the required and recommended plugins:

Go to your WordPress Dashboard > VillaTheme Core > Import Demo. Choose a demo you want to import. Hover over the demo preview and click Import (or Preview Demo if you want to see it first).

 

Ensure all needed plugins are in use

 

Wait for the import process to finish.

 

After importing the demo:

• Click Theme Settings to Customize and adjust options to match your preferences.
• Click Visit Site to visit your site’s homepage to see the imported demo in action.

 

 

The theme is fully compatible with WooCommerce, allowing you to build an online store with ease.

• Install WooCommerce
• Adding WooCommerce Pages
• Setting Up WooCommerce
• Adding Products

Install WooCommerce

From Theme

 

From WordPress Dashboard

 

Adding WooCommerce Pages

After activating the WooCommerce plugin, the default WooCommerce pages will be created automatically. You can recreate them manually by adding the appropriate WooCommerce shortcodes or block.

 

Setting Up WooCommerce

• Go to Dashboard > WooCommerce > Settings.
• Configure your store details:
• General: Store address, currency, and selling locations
• Products: Shop page, measurement units, and review settings
• Shipping: Shipping zones, methods, and rates
• Payments: Choose and configure payment gateways
• Accounts & Privacy: Customer account options
• Emails: Customize WooCommerce emails

Adding Products

1. Go to Dashboard > Products > Add New.
2. Enter the product title, description, and categories.
3. Set the product data: Simple, Grouped, External/Affiliate, or Variable product.
4. Add product price, SKU, inventory, and shipping details.
5. Upload product images and galleries
6. Click Publish to make the product live.

 

 

You can build and customize pages using Elementor, a drag-and-drop page builder fully supported by the theme.

Creating a Page with Elementor

1. Go to Dashboard > Pages > Add New.
2. Enter a page title, then click Edit with Elementor.

You can also edit existing pages (such as Home, About, or Contact) by opening them and selecting Edit with Elementor.

 

Adding Elements

Elementor allows you to build layouts by inserting pre-designed blocks and widgets.

• Open a page in the Elementor editor (Edit with Elementor).
• On the left panel, browse the list of available elements (widgets).
• Drag the desired element and drop it into the page canvas.
• Customize the element’s content, style, and advanced settings in the left panel.
• Click Update to save your changes.

 

Draly Elements

The theme includes support for Draly Elements, a set of custom widgets designed to work with Elementor. Under Elements panel, search “Draly” and you’ll find them.

• Blog
• Category
• Products
• Product Tabs
• Newsletter
• Countdown Deal
• Slider
• Vertical Accordion

 

 

The theme supports Mega Menus, which allow you to display advanced navigation layouts with multiple columns, images, and custom content.

Adding a New Mega Menu

In the WordPress admin panel, go to Mega Menus.

Click Add New to create a mega menu.

 

Add content as you would when creating a page (using Elementor or the editor).

 

 

Setting Up a Mega Menu

Go to Appearance > Menus and create a new menu or edit an existing one.

Check the Enable Mega Menu option on your chosen item.

Additional Notes

When you enable a mega menu, it will display the content of the mega menu, not submenu items added directly to the menu.

Assigning Menus to Locations

After configuring your menu, scroll down and assign it to a location:

 

 

Creating Inner Pages (About, Contact, etc.)

• Go to Dashboard > Pages > Add New.
• Enter the page title (e.g., About, Contact).
• Scroll down and find the Custom Page Options section, make some configurations for your page
• Publish the page when you are satisfied with the layout.

 

 

Setting the Home Page

By default, WordPress displays your latest posts on the homepage. To use a static homepage instead:

• Go to Dashboard > Settings > Reading.
• Under Your homepage displays, select A static page.
• Choose your desired page for Homepage.
• (Optional) Select another page for Posts page to display your blog posts.
• Click Save Changes.
• Your selected page will now be displayed as the site’s homepage.

 

 

At the top right/bottom right of the settings page, you’ll find control buttons:

• Save Changes: apply your current changes.
• Reset Section: reset settings under the current section (e.g. Typography or Color).
• Reset All: reset all settings to default.

General Settings

To configure your theme’s general appearance, go to Dashboard > VillaTheme Core > Theme Options > General Settings. You will find options for Typography, Colors, and Buttons.

1. Typography: You can customize the fonts for the body text and each heading (H1–H6). For each option, you can set:
   
   • Font Family
   • Font Weight & Style
   • Font Size (px)
   • Line Height (em)
   • Font Color
   • Body
     • Font Family
     • Font Weight & Style
     • Font Size (px)
     • Line Height (em)
     • Font Color
   • Headings (H1–H6): Each heading has its own font settings (same structure as above).
     • Heading 1 (H1)
     • Heading 2 (H2)
     • Heading 3 (H3)
     • Heading 4 (H4)
     • Heading 5 (H5)
     • Heading 6 (H6)
2. Color
   
   • Main Color: the primary color of the theme (buttons, links, highlights).
   • Blockquote Color: color for blockquote elements.

 

 

Header Settings

• Header
• Header Mobile
• Logo
• Vertical Menu
• Breadcrumb
• Contact

 

Header

Configure the layout and style of the site header

 

Header Mobile

Enable header for mobile devices and select the header style

 

Logo

Upload and configure your site logo. Options include logo width and alternate width for mobile devices

 

Vertical Menu

Enable a vertical navigation menu on specific pages and edit the menu title, if supported by your demo

 

Breadcrumb

Enable or disable breadcrumbs for site navigation.

 

Contact

Configure header contact information such as phone number, email, or icons if the demo supports it

 

 

Footer Settings

You would need to create your own footer in this section first.

 

Once created, return to this page and select the footer you wish to apply

 

 

Blog Settings

Go to Dashboard > VillaTheme Core > Theme Options > Blog Settings to configure blog and single post options.

• Blog
• Single Post

Blog

• Enable Blog Author: Show or hide the author name on blog posts
• Enable Blog Date: Show or hide the published date
• Show Blog Comment Count: Display the number of comments on each post
• Blog Sidebar Layout: Choose Left Sidebar, Right Sidebar, or No Sidebar
• Blog Style: Select from supported blog layout styles
  • Standard
  • List
  • Grid: If you choose this style, set up the responsive settings:
    • Blog Grid – Items per row on Extra small devices (e.g., phones) – default for anything smaller: Number of item for device whose screen resolution > 0px
    • Blog Grid – Items per row on Small devices (e.g., phones in landscape mode): Number of item for device whose screen resolution >= 576px
    • Blog Grid – Items per row on Medium devices (e.g., tablets): Number of item for device whose screen resolution >= 768px
    • Blog Grid – Items per row on Large devices (e.g., small laptops): Number of item for device whose screen resolution >= 992px
    • Blog Grid – Items per row on Extra large devices (e.g., desktops): Number of item for device whose screen resolution >= 1200px
    • Blog Grid – Items per row on Extra extra large devices (e.g., large desktops or high-res displays): Number of item for device whose screen resolution >= 1400

 

 

Single Post

• Enable Post Author: Show or hide the author name on single posts
• Enable Post Date: Show or hide the published date
• Show Post Comment Count: Display the number of comments on the post
• Enable Post Category: Show or hide post categories
• Enable Post Tags: Show or hide post tags
• Enable Post Shares: Enable or disable social sharing buttons
• Enable Related Post: Display related posts at the end of articles
• Post Sidebar Layout: Choose Left Sidebar, Right Sidebar, or No Sidebar

 

 

WooCommerce Settings

You can customize your shop and single product pages through Dashboard > VillaTheme Core > Theme Options > WooCommerce

• Shop
• Single Product

Shop Settings

• Mini Cart Style: Dropdown or Slide Out
• Enable Fly To Cart: Toggle on/off the animation when adding products to the cart
• Products Newness (Days): Define the number of days a product is considered “new”
• Number Of Products On Shop Page: Set how many products are displayed per page
• Enable Shop Full Width: Display shop content in full width
• Shop Sidebar Layout: Left Sidebar, Right Sidebar, or No Sidebar
• Shop Filter Layout: Available only if a sidebar is enabled. Options: Default, Filter Dropdown, or Filter Slide Out
• Shop Pagination Type: Pagination or Load More
• Shop Layout: Grid or List
• Shop Grid Product Layout: Select from supported grid layouts
• Shop Grid Product Layout  – Responsive Grid Settings:
  • Shop Grid – Items per row on Extra small devices (≥ 0px): Default for smallest screens
  • Shop Grid – Items per row on Small devices (≥ 576px): Set number of items per row
  • Shop Grid – Items per row on Medium devices (≥ 768px): Set number of items per row
  • Shop Grid – Items per row on Large devices (≥ 992px): Set number of items per row
  • Shop Grid – Items per row on Extra large devices (≥ 1200px): Set number of items per row
  • Shop Grid – Items per row on Extra extra large devices (≥ 1400px): Set number of items per row
• Star Rating Style: Choose one of two available styles

 

 

Single Product Settings

• Enable Single Product Shares: Show or hide sharing options
• Enable Single Product Full Width: Expand product content to full width
• Single Product Sidebar Layout: Left Sidebar, Right Sidebar, or No Sidebar
• Single Product Style: Horizontal Thumbnail; Vertical Thumbnail; or Sticky Detail
• We Accept Payment Section (only available if a sidebar is enabled): For the No Sidebar layout, customization can be done via the Product Widget settings.
  • We Accept Title: Custom title for the payment section
  • We Accept Image: Upload images of accepted payment methods (e.g., Visa, MasterCard, PayPal)

 

 

Customize Overview

The WordPress Customizer provides a live preview of your site while you adjust theme options.

Go to Dashboard > Appearance > Customize. In this section, you will find most of the settings described earlier (General Settings, Header, Footer, Blog, WooCommerce, etc.)

 

 

Theme Widgets

Widgets allow you to add content and features to specific areas of your site such as sidebars and footers.

Adding Widgets

• Go to Dashboard > Appearance > Widgets.
• Locate the available widget areas .
• From the list of available widgets, drag and drop the widget you want into a widget area.
• Configure the widget settings (if applicable).
• Click Save to apply changes.

 

Custom Widget Areas

Select the widget position for Blog Sidebar, Shop Sidebar and Single Product Sidebar using the “Sidebar Layout” option

 

 

The theme supports multilingual websites and can be translated using popular plugins such as Loco Translate and Polylang.

Loco Translate

Install and activate the Loco Translate plugin.

Go to Dashboard > Loco Translate > Themes.

 

Create a new translation or upload your .pot file if you already have one.

 

Polylang

Install and activate the Polylang plugin.

Configure your site languages under Dashboard > Languages > Translations.

Add translations for pages, posts, menus, and widgets directly within Polylang.

 

Thank you for your attention!

If you have any question, please create a topic at our FORUM, we will support within 24 hours.