How to reCreate Websites with Elementor based AI Builder – 10Web

In this tutorial, I’ll show you how to recreate websites with Elementor based AI Builder by 10Web. Besides AI, the 10Web builder also makes it possible to edit and make changes to any recreated site with AI in just a matter of minutes! If you have Elementor page builder knowledge, all you need to do is simply edit with 10web builder and you’ll have access to the web editor based on Elementor.  

Note: the digits in brackets e.g. (00:02) indicate the minutes of that exact explanation in the video so you can easily jump to that section and follow along.

Video: 10Web Elementor based AI Builder

Signing up for 10Web AI Builder

In your newly installed WordPress dashboard without any plugins open up a new tab and go to 10web, sign up (open an account) on this website.

After creating your account, you’ll see a section where to view your websites and another to add a website. Click on Add Website option (02:22).

0V5M KOvhL5kzncvpOXXGwD2yoJBNSy EcfZRepwZ5OdOHdjZYnTRebtv32MDx Rj22PpfdDe8hokf9Ofsx ECuWlOzV UIHy2qnFvGyGHASiLldnSkdaq6uqlPTujzDHbbs0YKT

A new window pops up with the option to recreate with ai builder on your existing website, or you can also create your own web projects using the 10Web infrastructure. 

In this case, choose the first option; to recreate with ai builder on your existing website, then click Next. Here, you need to download the 10Web Manager Plugin, which will connect your WordPress website to the 10Web infrastructure, so click the download button. (03:00) 

Elementor based AI Builder

After downloading, go to your Plugins area on your dashboard and click Add New. In the Add Plugins window click the Upload Plugin button, choose the file you just downloaded and then click Install Now. (03:13)

HfBKsr KHvGV24gUgqBp EnaCK0F TJDfs

When the plugin installs, click on the Activate Plugin button, then you’ll be redirected to the 10Web platform.

ijUwpCRxSjhhsdmYM3L2A FBpXDDtea58qw4 9incwGGhBnpCC16BE80xOK LLbRWotRKvVJmrlZDJZKpFqAXTdEzOBFHWsALJ1Jb7Gohs huylzL3wX r46KjwfHU7ve8yA9r0

In the new interface, you get the option to enable recreating with ai, enable it. (03:35)

AZONsjQ6tc9q7GMRXG m0iI1rcsgU98teqWPhX1dnnBdQcUtHv4msb9Vt5EruiY1V6Oku5kKMmwTjb7ZGblqAvWTutFaL5A rUJ5ughKnFQULqLStVlPAO90d9Wqb Tkoj9mwy2c

After enabling recreation, you need to paste the URL of the page you want to recreate.

Here, I have a website that was created using Elementor and another that was created with Squarespace.

Also Read: How to Add Custom Fonts in Elementor and Generating Font Pairs

Recreating an Elementor Website using 10Web AI Builder

This website has a header, navigation, a background video, it also has some animated sections, buttons, and a footer. Copy the URL of the website created with Elementor and paste it. (04:28)

After pasting, there’s also an option to add more pages to the website you want to recreate. For example, if you want to recreate the contact form, you can just go and copy the form URL and paste it there.

 After adding the pages you want, click the Recreate & Import button, then wait for the recreation process to complete. When it is done you’ll get an option to preview and edit. (05:02)

5N4vLTJWCkVwhWUwascAaAD2tSme3Bm4GpyX0v7OfMgr2QdjJ4mGTsXvmWQqlEhCPt9Kl8LtgjBZBmzu0ISJzSVYY6hrw2VZnsh2oKIK0oOwfpnAEJ9PIVI7SnANaete84kmbHQ

When you click the view and edit button, you’ll get your new site which is a replica of the other one, with all the pages, buttons, header, footer, background, and all. But this is your own website and on your hosting platform.

To make any changes to this new recreated website, for example, to change some sections or make additions, click the Edit with 10Web builder button which takes you to the builder (06:23).

PWrpPC TZta8NEcfSJXJXrvC9Idg0UX19CgeyoGGxmp0EjImT J2dqn5oCbxyp3Tqv5Q0XdmOGc9rN3h4TqPOPlSOr5j9DzlLUS3LZXlfHtzjCIOlfJbh 1p9m1uBY1E sM0bKFc

After the recreation, when you check back in your plugins area you’ll notice Elementor is now installed in the plugins area, with the 10Web builder and manager (06:58). 

So the 10Web platform is based on the Elementor page builder. Their team is also creating their own Elementor-based widgets that you can use without having to use Elementor Pro.

To Read: Case Study: What is Site Structure and How To Get SiteLinks

k3WOJRRY4GrGHjmRtOopcmI

In the 10Web Builder, everything looks like in the Elementor builder, and when you check in the media library you’ll see that all the images and background video have also been saved there. You are able to make changes to any of the sections using Elementor and even make changes to your sections’ responsive settings.

Recreating a Squarespace Website using 10Web AI Builder

Go back to your 10Web dashboard and click the option to add a new website, choose the option to “recreate with ai builder on your existing website”, download and install the 10Web manager plugin in your WordPress. 

But first, go back to your dashboard and delete all the previously installed plugins.

Copy the URL from the Squarespace website and paste it, then click the recreate button. Wait for the recreate process then click to view and edit when it finishes. (11:51)

JMrZeeJVbbJ4xLz9YSxXYZRozMMmGkWh73GPSM3OphKXP5mUXIjOWY0G71wvFCftrQtQ HZ

On this recreated website, unlike the Elementor website; there are some changes for example the fonts, the formatting of the heading, the size, the buttons lost their motion effect, some content is lost, and a couple of other changes. 

However, you can easily just go into the Editor and edit them to what you want. (12:22)

TtnJeYe6ycKnOFem4GpB Nc26rzX4lv4BZQXlMv8rJrsqQnT0kl0LgMEKb 3sbcdH jZzGkolhqm5UUsnQBZtlrawyDkkxxcFNzvk8yC ZiAEhGLotggOp7j6oFzZzWWgQzt8Hcv

When you click on the Edit with 10Web builder button you are able to change those sections that differed from the original site to reflect what is on the original or whatever you want them to look like.

For sections that lost their content, you would have to recreate them by adding a new section, for example, then you can use templates from the Elementor Library or you can just create them and add your own content.

Note: Websites created using the 10Web Ai Builder are also hosted on the Google Cloud infrastructure with up to 90% page score. 

In Conclusion

If you’re looking to recreate a site for yourself or for your clients, the elementor based AI builder from 10Web Ai Builder is definitely the way to go. It gives you the power to recreate any kind of website and even if it is not yet perfect as you’ve seen, it saves you quite a lot of time that you would’ve put into recreating a website using WordPress or elementor.

It also opens up more possibilities for you as a web designer or a web agency, plus they’re creating even more widgets that you can use on your websites.

If you have any questions or comments don’t hesitate to use the comment section below. Remember to subscribe to my newsletter and Youtube channel for more tips and tutorials.

Also Read. . .

Snapchat Device Ban: The Why And The How

Snapchat is one of the quickest and easiest social media platforms used to communicate through photos and videos. Because of its emphasis on security and safety, Snapchat may ban a user’s account due to violations,

Read More »
Newsletter Subscription (EF)
Hamza
Hamza
Hamza comes from a design background with over 10years of experience in Web and Media design. He enjoys making web design videos on his YouTube channel GoTechUG. He also writes web design articles on this website. In his free time, Hamza loves riding a bicycle, swimming or going hiking.

1 thought on “How to reCreate Websites with Elementor based AI Builder – 10Web”

  1. How can we take an AI created design and import it to another WP Elementor instance? I’ve tried the import/export kit (and even downloading the .json template) and ends up being blank. Is there a way to do this?

Leave a Comment

Your email address will not be published. Required fields are marked *

Search

Recommended Tools

Hostinger offers premium WordPress hosting for small and medium size websites at an affordable price rated 4.5/5 on Trustpilot

Elementor is the WordPress most popular page builder with over 10 million active users