--- title: "What is Direct Import?" url: https://uichemy.com/docs/what-is-direct-import/ date: 2023-09-18 modified: 2026-04-14 author: "Sagar Patel" description: "UiChemy allows you to seamlessly export your Figma designs directly into your WordPress site, eliminating the need for manual downloads or uploads. With the Direct Import feature, your selected design..." image: https://uichemy.com/wp-content/uploads/2023/05/What-is-Live-Preview_-min-1024x536.jpg word_count: 496 --- # What is Direct Import? ## Key Takeaways - UiChemy exports Figma designs directly into WordPress, eliminating manual downloads or uploads. - Direct Import supports a maximum design height of 12,000 pixels for a single export. - Users can preview their designs live on WordPress after connecting UiChemy just once. **UiChemy **allows you to seamlessly export your Figma designs directly into your WordPress site, eliminating the need for manual downloads or uploads. With the **Direct Import** feature, your selected design is automatically converted and imported into WordPress, ready to use. ## How to Use Direct Import? To do this, we have two options here, #### Option 1: Step by Step Method Now, to use the UiChemy **Direct Import** with this method, follow the steps below – - Open the UiChemy plugin and select the top-level frame of your layout.   - Select the **Step by Step Method**, click the **Start **button, and connect your site. - Once successfully connected, click the **Convert** button, then select **Direct Import** and click **Import** to begin converting your design. - You’ll see a live progress screen as the design is being converted. - Once redirected to the **Export Method** tab, click the dropdown beside your site (green dot). Under **Import Settings**, choose **New** or **Existing**, and select a template type (Page, Elementor Templates, or Nexter Templates). - Click **Next**, then **Import** your layout(s). Once uploaded, click **Open** to preview the design directly on your website. #### Option 2: Express Conversion In the **Express Conversion** method, you can use the UiChemy **Direct Import** by following these steps –  - Open the UiChemy plugin and select the top-level frame of your layout.   - Select the **Express Conversion**, click the **Start **button, and connect your site. - Once successfully connected, click the **Convert** button, then select **Direct Import** and click **Import** to begin converting your design. - You’ll see a live progress screen as the design is being converted. - Once redirected to the **Export Method** tab, click the dropdown beside your site (green dot). Under **Import Settings**, choose **New** or **Existing**, and select a template type (Page, Elementor, or Nexter). - Click **Next**, then **Import** your layout(s). Once uploaded, click **Open** to preview the design directly on your website. > *Note: For Elementor Template and Nexter Template, you have to select the template type as well.* **Direct Import** is designed to export the **entire design layout** at once. However, the maximum supported height for a single design export is **12,000 pixels**. If your design exceeds this height, you’ll need to **split it into two or more parts** before importing. If you want to export only specific inner sections from the design instead of the full layout, you can use the** Copy to Clipboard** option. This offers more flexibility when working with individual parts of your design. This simplified workflow speeds up the design to development process, reduces manual effort, and helps you build pages faster - directly from Figma to WordPress in just one click. > *Note: *To obtain accurate output in Direct Import mode and avoid losing any frames or colors, maintain the following structure in your Figma design: > > > > > > **Page Frame → Section Frame → Content** You have to make the connection between UiChemy and your WordPress website just once, then you can click on the **Preview** button to see the live preview of any Figma design. ## Frequently Asked Questions **Q: What is direct import in UiChemy?** A: Direct Import in UiChemy allows you to export your Figma designs directly into your WordPress site without manual downloads or uploads. This feature automatically converts and imports your selected design, making it ready to use on your website. **Q: What is the difference between direct import and indirect import?** A: Direct import exports your entire design layout at once, while indirect import typically involves more manual steps, such as downloading files before uploading them to WordPress. Direct import streamlines the process, reducing manual effort and speeding up the design-to-development workflow. **Q: What should I do if my design exceeds the maximum height for direct import?** A: If your design exceeds the maximum supported height of 12,000 pixels for direct import, you will need to split it into two or more parts before importing. This ensures that the entire design can be successfully converted and imported into WordPress. **Q: What is the best practice for maintaining structure in Figma for direct import?** A: To obtain accurate output in Direct Import mode, maintain a specific structure in your Figma design: Page Frame u2192 Section Frame u2192 Content. This organization helps avoid losing any frames or colors during the export process. **Q: How do I connect UiChemy to my WordPress site for direct import?** A: You only need to make the connection between UiChemy and your WordPress website once. After that, you can easily click on the Preview button to see a live preview of any Figma design, streamlining your workflow.