Etch – The Next-Era Visual Development Environment for WordPress

Kevin Geary is known not only for consistently expressing his opinions – aka picking the odd fight with others in the WordPress community – but also for creating great products such as Automatic.css (ACSS) and Frames.

-
people visited this page
-
spent on this page
0
people liked this page
Share this page on

Last September, he announced Etch, a next-era visual development environment for WordPress. After a short pre-sale, Etch is currently available again for a limited time as a lifetime deal.

Etch

Etch enables you to create visually appealing, scalable and accessible WordPress sites without any of the disadvantages associated with traditional page builders.

Features

Etch is a visual development environment designed for professional users and those keen to learn advanced site building. It is not intended for beginners seeking basic page builders. All content created in Etch is authored as native Gutenberg blocks within the WordPress block editor. This enables two-way synchronisation, meaning that edits made directly in the editor are also updated in Etch. This approach liberates your data completely, ensuring that both users and clients enjoy a native, seamless WordPress editing experience.

Etch offers extensive global structure and styling control. This allows users to create reusable components with a single click, edit them inline on the canvas and effortlessly map props or generate conditional variants. These components are stored as synced patterns and render on the front end without introducing additional unnecessary DOM elements.

The platform features a powerful loop engine that enables users to loop through posts, taxonomies, users, raw JSON or REST API data. It even supports nesting and conditional logic within loops and allows users to save loop configurations for efficient reuse. Etch enables dynamic data fetching, so whether you are pulling data from the WordPress database, the block editor or custom fields, you can display or template it dynamically on your site.

Advanced conditional logic is at the core of Etch, letting users control the rendering, attributes, or inline styles of any element or its children based on complex combinations of conditions and logic strings. For those who want maximum control, Etch provides full access to the underlying HTML: you can write, paste, or manipulate code directly, or hide it altogether if you prefer a visual workflow.

In Etch, both styling and JavaScript are element-based. This means that CSS and JavaScript are stored with, and only output for, the elements that are present on the page. This results in organized, maintainable code with no unnecessary bloat. The ‘Auto-BEM’ system enables you to attach BEM-style selectors to every element with a single click, making scalable, maintainable styling effortless.

You can create custom post types (CPTs) and custom fields instantly without leaving your workflow and immediately template or loop them as needed. Etch’s flexible attribute system lets you easily assign classes, attributes and values, applying styles at the element level using any valid CSS selector – not just classes.

Visual styling inputs and written CSS are always in sync, so you always know exactly where your styles are coming from with no mystery or confusion. Etch produces exceptionally clean, semantic code by deliberately avoiding unnecessary wrappers, attributes, auto-generated IDs or classes, resulting in some of the cleanest code among visual builders.

Finally, Etch offers a highly modular and customizable interface. Panels can be rearranged and sidebars can host multiple resizable panels. Your layout preferences are also automatically preserved, allowing you to work exactly as you wish for the utmost efficiency and comfort.

Pricing

The official launch of Etch 1.0 is scheduled for September. As mentioned above, those who missed the pre-sale now have the opportunity to purchase the Etch LTD. Prices start from just $499 for the Freelancer LTD, which can be used on up to 15 production websites.

Etch also offers Flex Pay plans, which allow you to pay for the LTD in six monthly instalments. As LTD plans will be replaced with subscriptions in September, this is an opportunity not to be missed!

Freelancer

Biff Codes - The Job Board for WordPress Devs

Biff.codes is on a mission to revolutionize job boards. Post and find WordPress developer jobs for free.

Post Jobs for Free

FTC Disclosure: We may receive a payment in connection with purchases of products or services featured in this post.

Stefan
Stefan

Ahoi.dev is a ShabuShabu project by Stefan Glumpler & Boris Glumpler – a brother and web designer / developer team based in Munich, Germany. Servus from Bavaria!

Articles: 4880

Add your first comment to this post

My Cart
0
Add Coupon Code
Subtotal

 
Share to...
Your Mastodon Instance