Introducing LiveCanvas v4: A Leap Forward in Web Design Efficiency
We are happy to announce the release of LiveCanvas Version 4, a revolutionary upgrade bringing some important new features to the table.
Designed with precision and intention, this upgrade will redefine the way professional webmasters approach WordPress development. The whole experience was designed to streamline and supercharge your workflow, not to replace it.
AI Assistant
Imagine an AI that doesn’t get in your way or try to reinvent the wheel you’re already rolling. The LiveCanvas AI Assistant is exactly that, a productivity power-up tailored for professionals, that works only where you precisely want.
It doesn’t "take over" your creativity or know better than you. Instead, it’s there to accelerate your workflow, inspire content ideas, and provide coding snippets. It’s a tool for the coders that know what they’re doing and just want to do it faster, smarter, and without writing the boring boilerplate and repetitive code - but remaining always in control of it.
Think of it as a smart assistant, helping you work faster, manage content, and bring your ideas to life more efficiently - and it's on each contextual menu of the page, so you can trigger it on each HTML element.
AI Assistant Highlights
- Plug-and-Play Setup: Just add your OpenAI key and get started.
- Context-Aware Content: Guide the AI with your website's topic to make its suggestions more accurate and relevant.
- Code and Content Generation: Need content? Done. Need Bootstrap-ready HTML? Done. It’s a Swiss Army knife for text and code.
- Code and Content Refinement: Need to make that heading bigger? Just ask. Need to make that headline shorter keeping the meaning? Two clicks and it's there.
- Business-Ready Prototyping: Instantly fills sections with text tailored to your business, ideal for rapid prototyping.
- Screenshot-to-Code Conversion: Convert screenshots to Bootstrap-ready HTML code with LiveCanvas-editable regions.
- Complete Control: You’re at the wheel, this AI Assistant is barely riding shotgun with you.
Master Your Content
- Text Editing: Correct typos, adjust word count, rephrase for clarity, or fine-tune for SEO.
- Tone Adjustments: Need to shift from formal to conversational? Or corporate to friendly? The AI adapts to match your brand’s voice.
- Effortless Translation: Speak to the world. Translate your content into multiple languages—German, Spanish, French, and beyond in one click and some tokens.
- Content Creation: Need an elevator pitch, social media post, or a snappy tagline? The AI's got your back, ready to deliver meaningful contents in seconds.
Handling Dynamic Data with the Loops & Logic Tangible Syntax
In order to help you display dynamic content in an easy and flexible way, we have introduced into LiveCanvas v4 native support for Tangible's Loops & Logic syntax.
This basically allows you to use dynamic tags like Loop, Field, and If, almost directly in your HTML. You'll just need to wrap your code in a specific custom HTML tag: <tangible>
.
This syntax allows you to query and display data precisely with total freedom, with full support for custom fields, ACF repeaters and any custom post type and taxonomy.
No more messy workarounds, just the old plain HTML syntax, with a sprinkle of conditionals, queries and all the tools you need to display fantastic post loops, without changing context.
Read more in this documentation page
Enhanced History
It happens everytime to everyone. Sometimes you are working and mess things so bad that panic starts to kick-in and you think you lost all your work. We've got your back.
With LiveCanvas v4 we introduced a browser-based local database (leveraging the power of IndexDB) to ensure every step you make in the page can be easily undone using the all new toolbar buttons: undo and redo. This is a perfect companion of the already great WordPress's native Revision History which happens at every save.
Universal Selection
The editor toolbar now has a big toggle switch to turn on the Universal Selection mode. This will basically allow you to select any element on the page.
Hover and watch a blue border outline your selection, complete with class labels and a context menu for quick tweaks.
Freeze the selection with the Command key to easily reach those, sometimes hard-to-get, elements.
Code Editors now edit Outer HTML
In response to popular demand, our code editors now allow outer HTML editing, enabling you to quickly inspect and modify the classes applied to elements.
Global JavaScript Editor Tab
Need a convenient spot for your global JavaScript? This update adds a "Global JS" tab to each code editor, providing a quick and easy way to handle your custom JS code.
This code is served inline on all pages.
What Else?
Other minor updates include:
- Bugfix: The text editor no longer adds empty
<p>
tags. - Bugfix: Smoother resizing of HTML code editor windows.
- UnSplash now offers images in AVIF format.
- New filters: lc_modify_header_content and lc_modify_footer_content.
LiveCanvas v4 is here to empower you, not overshadow your expertise. Embrace the new features and enjoy a more efficient, dynamic workflow!