wpthemecustomizerReal Elementor containers
Sections, columns, flex rows and grids become Elementor containers you can edit, not one big block of code.
Free HTML to Elementor converter
Turn your HTML into Elementor
Paste your HTML and CSS and download an Elementor JSON template built with free widgets. Import it into WordPress and edit everything in Elementor.
How to convert HTML to Elementor
Three steps, no sign-up, about ten seconds.
- 01
Paste your HTML
Paste the HTML and CSS of one page, or upload the .html file. A full page, a section or a template you bought all work.
- 02
Convert to Elementor
Click Convert. In a few seconds your HTML becomes an Elementor template with desktop, tablet and mobile sizes.
- 03
Import the Elementor JSON
Download the Elementor JSON file, import it under Templates in WordPress, then insert it into any page and edit it in Elementor.
What gets converted
Your HTML and CSS become an editable Elementor template, built with the same parts you would use by hand.
Tablet and mobile included
Font sizes, spacing, columns and hidden parts are set for each screen size, the way your page already works.
Text, images, colours and fonts
Headings, text, links, buttons, images, videos, colours, backgrounds, shadows and Google Fonts carry over to matching Elementor widgets.
Any HTML and CSS
Static HTML sites, HTML templates, landing pages, Tailwind CSS, Bootstrap and pages from AI site builders can all be converted to Elementor.
Elementor JSON download
You get a standard Elementor JSON template, the same kind of file Elementor exports, ready to import on any WordPress site.
Built for Elementor Free
The template uses free Elementor widgets only. If part of your page needs Elementor Pro, like a form or a sticky header, the result names it.
HTML to Elementor: frequently asked questions
What is an HTML to Elementor converter?
An HTML to Elementor converter turns an existing HTML page into an Elementor template. Instead of rebuilding the page by hand, you import the template into WordPress and edit the page in Elementor.
Is this HTML to Elementor converter free?
Yes. The converter is free to use, with no sign-up and no usage limit. Your code is not stored.
What file will I receive?
You receive an Elementor JSON template file. It uses the same format as a template exported from Elementor, so it can be imported on any WordPress site that has Elementor installed.
How do I import the Elementor JSON file into WordPress?
In your WordPress dashboard, go to Templates, then Saved Templates, and select Import Templates. Choose the downloaded JSON file and select Import Now. Then open a page with Elementor, open My Templates from the folder icon and insert the template.
Do I need Elementor Pro?
No. The template is built with Elementor Free widgets only. Certain features, such as forms, sticky headers and advanced effects, require Elementor Pro to work in the same way. Where this applies, the result lists those parts, and they are kept in a simplified form that works in Elementor Free.
Which types of HTML are supported?
Static HTML pages, HTML and CSS templates, landing pages and pages built with Tailwind CSS or Bootstrap are supported, as are pages exported from AI website builders. Content that only appears after an interaction, such as sliders, tabs or menus that open, is converted as it appears when the page first loads.
Can I convert HTML that has no CSS?
Yes. If no styling is found, you are notified and a clean design is applied with a colour set of your choice, along with fonts, spacing and mobile sizes. Everything can be changed in Elementor after import.
Why do some images show a placeholder after import?
During import, WordPress copies each image to the Media Library, which requires a full image address such as https://example.com/images/logo.png. Images referenced with a short path, such as images/logo.png, cannot be copied. Use full image addresses in your HTML, or upload those images to WordPress and replace them in Elementor.
Can I convert an entire website to Elementor?
Pages are converted one at a time. Import each template and insert it into its own WordPress page. A header and footer that appear on every page require the Elementor Pro Theme Builder.
Will the Elementor page look the same as my HTML?
Layout, spacing, fonts and colours are matched as closely as Elementor allows. Hover effects beyond colour changes, animations and some decorative details may need minor adjustments in Elementor.
Want it done for you?
We convert HTML websites to Elementor, set them up and make them fast. Tell us what you have.