Made in Builder

Made in Builder.io

How to Build: Localization webinar on March 23rd @ 10am PST. Register Now

×

Developers

Product

Use Cases

Pricing

Developers

Resources

Company

Log in

Product

Features

Integrations

Talk to an Expert

Pricing

Blog

Home

Resources

Blog

Forum

Github

Login

Signup

×

Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required

Resources

Blog

Get StartedLogin

If you want to make changes to many layers in a Builder visual entry and know how to write JavaScript, you can use your browser's console to run code against the current entry.

To start, open a Builder content entry into the Visual Editor. Then open up your browser's JavaScript console and there is a global builder object you can interact with.

For instance, to delete the default top margin added to elements on the page, you can run the following code:

builder.allEditingElements.forEach(el => {
  if (el.style.get('marginTop') === '20px') {
    el.style.delete('marginTop')
  }
})

Full docs on the scripting API are coming soon, but in the meantime you can log around what is in the builder object to see what properties and methods are available for scripting.

Also, see our docs on plugins to learn how you can script behavior in the Visual Editor without using the browser console


Looking to hire a 3rd party to help with your project?

Submit a project request and our partnerships team will reach out to connect you with an Expert from our partner ecosystem.

Connect with us

Was this article helpful?