Add and edit elements
Learn how to add, modify, and customize elements.
Elements are images, text, buttons, shapes, and other details that make up your page design.
Add elements to your page
Steps:
Click Add elements on the left side of the Editor, or press E.
You can scroll up and down, and browse the library to view elements
Select an element and drag it onto the canvas to add it to your page design.
What's next?
Once you have added an element, use the options and Inspector panel to edit and perfect it.
To add an app block, check out App extensions
Types of elements
Quick add: Quickly find and add common elements like Heading, Text, Button, Image, etc.
Saved assets: View and use your saved design (both elements and sections). See how to save a design as an asset here.
Basic elements
Text
Add different text elements, including:
Heading
Paragraph
Display text
Text with shadow
✍️ Learn more:Text
Buttons
Add buttons to let visitors interact with your page, including
Solid button
Button with border
Rounded button
Button with icon
Button with underlined text
✍️ Learn more: Button
Advanced elements
Layout: Embed a grid or a stack to organize elements more easily.
Slideshow: Use pre-made slideshows for horizontal or vertical slides
Tabs and Collapsible: Display content in an accordion layout.
Testimonials and Press: Showcase social proof to build trust.
Shopify elements
Single product: Add product details and other product-related elements, including:
Product details - Learn more: Product details
Product media
Quantity input
Pries
Variants
Description
Add to cart
Dynamic checkout
Vendor
Type
Product meta
Products: Add a Product List, Favourite Products, or Related Products.
Collections: Add a collection display with featured images for Main Collection, Collection List, or Collection Tabs.
Blog posts: Create and add a stunning blog and attract traffic.
Buy buttons: Add Shopify functional buttons to your page - Add to cart button and Dynamic checkout buttons.
Delete an element from your page
You can delete an element you add to your site at any time.
Steps:
Click on the relevant element on the canvas.
In the Actions bar, click Delete or press Delete on your keyboard.
Delete an element by mistake? If you delete an element by mistake, you can easily undo this by clicking the Undo icon in the top bar of the Editor.
See more: Undo & Redo
Last updated