What is ClonewebX?
ClonewebX is a tool designed to simplify the process of cloning websites and converting them into various popular page builders like Elementor and Bricks Builder. ClonewebX enables users to clone entire websites or specific parts of them with a single click, facilitating a seamless transfer of HTML and CSS elements to the chosen page builder. Watch the video to see ClonewebX in action.
Key features of ClonewebX include:
- Efficient Website Cloning: ClonewebX allows users to duplicate websites quickly, which can save significant time compared to manually recreating pages from scratch.
- Page Builder Compatibility: The tool supports popular page builders such as Webflow, Elementor (version 3.10 or higher with Flex Container), and Bricks Builder, ensuring compatibility and ease of use across different platforms.
- No Manual Coding Required: ClonewebX eliminates the need for manual coding, making web design accessible to those without extensive coding knowledge. Users can simply drag and drop elements within their preferred page builder.
- Responsive Design: It handles responsive design by default, allowing cloned websites to function well across various devices. However, users can also fine-tune specific customizations if needed.
- Advanced Customization: ClonewebX provides options for advanced customization, enabling users to tailor cloned websites to their specific requirements, including preserving or excluding certain functionalities during the cloning process.
Pricing for ClonewebX includes various plans ranging from a free option for limited use to more extensive plans for higher volume usage, with a notable lifetime deal that provides long-term access at a one-time cost.
Overall, ClonewebX is a valuable tool for web developers, designers, and marketers looking to streamline the website creation process by leveraging existing designs and transferring them effortlessly into modern page builders. Watch the video below to find out more.
Can’t spare 10 minutes to watch the video? Here’s a transcript that will only take a couple of minutes to read…
Looking to streamline your website development process and save time? You’re in the right place. ClonewebX can convert any website regardless of its programming language, source code, or platform. You can even add animations to match the original page’s brilliance without coding.
First, log in to your ClonewebX account and create a new project. Visit the homepage at Softlight.io, click on the ClonewebX product, and get started. Choose the suitable license with all the necessary features or try the trial version first, then log in to our project management dashboard.
Following our video tutorials, create a new project. For example, we’ll transfer the Breakdance website to Bricks Builder on WordPress and give it a custom name. Set up our ClonewebX Chrome extension by clicking the provided link to install it.
Access your target website and navigate to the page you want to transform. In our demonstration, we’ll work on the Breakdance homepage, a well-known WordPress page builder. Refresh the target page if you’ve just installed our extension. This is crucial for the process.
In this homepage, we have two animation sections and will show you how to replicate this effect. Scroll down to the end of the page to ensure all elements are loaded, especially if the page uses lazy load or animation effects. Click on the ClonewebX extension icon located in the top right corner of your browser, choose the appropriate project you created earlier, and click a page. Our tool will simulate the target page into your project management dashboard with a new Chrome tab.
We provide a control box to configure parameters, starting with the selector control. Use our selector detector to choose specific elements on the page for cloning. These elements will be highlighted with a blue frame. If you press the eye icon, all elements belonging to the current or parent selector will disappear. For more details, we will test on another site.
In this video, we’re choosing Bricks Builder. Ensure you’re using the latest version. Use the reduced DOM size function to optimize your wrappers. Adjust parameters for responsive design or customization as needed.
We offer two methods to export the CSS @font-face to your website. After exporting, we’ve upgraded the functionality to copy to the dashboard instead of exporting to a template. Head over to your Bricks site and paste sections in Bricks Builder. Start by creating a new template in the Bricks environment, add a div to cover all cloned elements, then right-click and paste the copied section content.
As you see, cloning is fast and delivers exceptional results. You can easily edit the content by corresponding elements. Now, let’s duplicate another section using the detective selector to choose a specific element, export it in the same way, and paste it onto your site. You can even modify images to create a unique look.
Next, we’ll clone the reviewer section on the Breakdance site. Keep in mind that this tool clones HTML and CSS, not dynamic content or animations. Save it and check the page’s responsiveness on various devices. It automatically adjusts to different screen sizes. Click here to inspect the front end and see the results. In a few minutes, you’ll have a static page identical to the original.
In the following part, we’ll use the LightMo tool to add animations to this reviewer section. For detailed instructions, refer to our documentation. In your clone test page, click on the Chrome LightMo extension. After logging in, you’ll be directed to the LightMo project dashboard. Add a new project and enter your unified domain as in your cloned website. Return to your clone page, choose the appropriate project in the LightMo extension, and click add page. You will be redirected to a new tab to simulate LightMo controls.
Create a new timeline as in the animation of Breakdance reviewers. Recognize that this is scrolling animations with scroll trigger animations belonging to the parent timeline. Start or end when the user scrolls down or up the elements. In the timeline control, a bunch of functions and options appear for configuration.
Imagine that users start scrolling the page down. When the top edge of your selector meets the start viewport, all animations belonging to this timeline will be triggered. Implement your first animation in the same way. Use our detective selector to choose specific elements or layouts to trigger. You can customize the duration of the animation with our visual editor.
To quickly create a second animation, duplicate the first one and edit it. Optimize the detective selector to easily choose the right element in the next versions. Add a selector for the second div. This animation will move to the opposite side versus the first.
Back to timeline control, enable the feature scrub. The animation will synchronize with the user scrolling, playing in real-time as they navigate the page. Done! Let’s check its front end and see how it works.
These tools meet your needs for reproducing any website in static layout and animation effects. In the final step, embed animation coding into your cloned page. After clicking export, our animation is automatically transferred to JavaScript. Add a new code element in Bricks and paste the corresponding JavaScript codes. If you apply LightMo for multiple pages, you only need a JavaScript library one time in general settings. Do not forget to execute the code.
We get quite a few searches for clonwebx, cloneweb x, clonewebx extensions and clonewebx alternative. Don’t worry if you’ve entered clonwebx, cloneweb x or clonewebx extensions, they are all the same, but the way it’s spelled is ClonewebX.
If you are searching for “clonewebx alternatives” there are several alternatives to ClonewebX for website cloning, copying, or mirroring. Some popular options include the products listed below, but none of these offer the performance optimisation facilities supported by ClonewebX, especially when converting a website to Bricks Builder.
- HTTrack:
- A free and open-source tool that allows you to download a website from the Internet to a local directory.
- It builds all directories, retrieves HTML, images, and other files from the server, and arranges them accordingly.
- Available for Windows, macOS, and Linux.
- SiteSucker:
- A Macintosh application that automatically downloads websites from the Internet.
- It can download the entire website, including images, PDF files, style sheets, and other elements.
- WebCopy:
- A Windows-based tool that copies websites to your local hard disk.
- It scans the specified website and downloads its content to your hard drive.
- Cyotek WebCopy:
- Similar to WebCopy but offers more customization options for how the website is downloaded.
- Allows you to configure which parts of the website are copied and how links are handled.
- Wget:
- A free utility for non-interactive download of files from the web.
- Supports downloading via HTTP, HTTPS, and FTP protocols.
- Available for various platforms including Windows, macOS, and Linux.
- Teleport Pro:
- A commercial Windows application that can download websites for offline browsing.
- Supports multi-threaded downloads, allowing for faster website copying.
- Blue Crab:
- A macOS application for downloading entire websites.
- It can download the entire site, individual pages, or just the files of a specified type.
- Scrapy:
- An open-source and collaborative web crawling framework for Python.
- Can be used for a variety of web scraping and website downloading tasks.
Each of these tools has its own features and advantages, so the best choice depends on your specific needs and the platform you are using. But for conversion to Bricks Builder we recommend ClonewebX – we’ve used it on Elementor sites and it has saved us 90% of the effort of manual conversion – please see full details on our page about how to convert Elementor to Bricks Builder.
