Add and edit elements

Elements are the building blocks of your Foxify pages — text, images, buttons, product grids, and more. Add them from the elements panel and customize each one in the Inspector panel.

Add an element to your page

1

Open Add elements

Click Add elements in the left sidebar — or press E.

2

Browse or search

Scroll through the categories or use the search bar to find the element you need.

3

Drag onto the canvas

Drag the element onto your page. Once placed, click it to select it and edit its settings in the Inspector panel on the right.

Once added, use the Inspector panel's General, Design, and Animations tabs to configure and style the element.

Learn more about the Inspactor panel: Inspector panel

Types of elements

Quick add

Shortcut grid of the most-used elements. Use when you know what you need and want to add it fast.

Save assets

Your saved elements and sections. Drag directly onto the canvas to reuse them across pages.

App blocks

Elements from installed Shopify apps and Foxify extensions. Install from Apps market first, then find them here.

Basic elements

General-purpose building blocks for page content and layout.

Text

Headings, paragraphs, display text

Buttons

CTAs, links, icon buttons

Media

Images, videos, QR code, Before/After image

Decorative

Shapes, Dividers

Promotions

Countdown timer, Marquee text

Forms

Subcribe form, Contact form

Lists

List items, Social links

Advanced elements

More complex structural and interactive elements for richer page designs.

Layout

Grids and cells to organize elements

Navigation

Menu and nav bar elements

Slideshow

Pre-made slide layouts

Tabs & Collapsible

Display content in tabbed or accordion layouts

Testimonials & Press

Social proof elements — reviews, quotes, press logos

Shopify elements

Product

Individual product page elements, such as: Product details, media, price, variants, Add to cart, and so on.

Blog post

Individual blog post page elements, such as: Post title, Post meta, Post image, and so on.

Product list

Product list, Favorite products, Related products

Collections & Blog

Collection and blog listing displays

Buy buttons

Add to card and Dynamic checkout buttons

Delete an element

1

Select the element

Click the element on the canvas to select it.

2

Delete it

In the actions bar above the element, click Delete — or press Backspace / Delete on your keyboard.

Deleted by mistake?

Click the Undo icon in the top bar — or press Ctrl + Z (Windows) / Cmd + Z (Mac) to restore it instantly.

Learn more: Undo & Redo

Related articles

Layer sliderApp extensions