Code & Dev
Intro to Velo.
Velo is a full-stack development solution that allows you to extend the functionality of your Editor X sites by adding code.
Create your desired UI, then add custom functionality using JavaScript and Velo APIs in both the frontend and backend.
With Velo you can create anything from small interactions to complete websites.
Enabling dev mode
To start using Velo, click on Dev Mode in the top menu, then click Turn On Dev Mode.
Changing an element’s ID
Change an element’s ID by clicking on the element and giving it a unique identifier in the Properties and Events Panel.
Setting default values
Set an element’s default state when the page loads by navigating to the Properties and Events Panel and clicking on the checkbox beside the state you want to set.
Adding event handlers
Add an event handler by clicking on the element that you want to add it to, then click on Event Handler in the Properties and Event Panel and click on the plus symbol beside it.
Adding your code
Begin adding code to your Editor X site by using the Code Panel. Here you can write JavaScript and use Velo’s APIs.
To learn about all the features and tools you can use to customize your Editor X site, click here.
Intro
TRY IT YOURSELF
Exercise on intro to velo.
Open Academy X from desktop to complete this exercise.
{No.}
{Exercise Description}
{No.}
{Exercise Description}
Open Academy X from desktop to complete this exercise.
Did you find this resource helpful?
Thank you for your feedback!
Next lessons.
VIDEO LIBRARY
Title
Learn how to add new sections, rearrange them & flip them to vertical.
▶
LESSONS & EXERCISES
Title
Learn how to work with sections—the building blocks of your site.
▶
VIDEO LIBRARY
Title
Get to know where you control size, position and behavior of all elements.
▶
LESSONS & EXERCISES
Title
Learn how to take precise control over the positioning of elements using grid.
▶
Related learning resources.
VIDEO LIBRARY
Title
Learn how to add new sections, rearrange them & flip them to vertical.
▶
LESSONS & EXERCISES
Title
Learn how to work with sections—the building blocks of your site.
▶
VIDEO LIBRARY
Title
Get to know where you control size, position and behavior of all elements.
▶
LESSONS & EXERCISES
Title
Learn how to take precise control over the positioning of elements using grid.
▶
Ready to start creating?
Top searches
People are searching for
VIDEO LIBRARY
Introducing Editor X
Discover the Editor X workspace. Get an introduction to your advanced layouting tools and an overview of responsive web design features like breakpoints, flexbox and CSS grid.
VIDEO LIBRARY
Getting Started
Learn the basics of creating a site on Editor X. Get a step by step walkthrough covering the key features and capabilities.
