Overview

The Page Structure & Elements section will let you know how the PageFly page structure works, as well as all the PageFly elements in the page editor.

You can check this guide to know more about page structure with main containers which are Section, Row, Elements to design your page.

Elements play an important role in building your PageFly store and increasing your conversion rate. PageFly provides four different types of elements to help you build your store. These are:

• Standard elements: you can find Containers, Basic elements, Media elements, Social elements and Advanced elements such as the Countdown Timer, Mailchimp Form, and the Table. Those are standard to any web page.
• Shopify elements: here you will find elements that require data from Shopify, for example, the Product List, Product Details, the Collection list, Forms, and your Blog.
• Third-party elements: here you’ll find all the elements from other apps that have been integrated with PageFly. Third-party elements have been categorized into Reviews & Rating, Badges & Seals, Upsell & Cross-Sell, Subscriptions, and Upload Fields.
• Sections: this is where you can find saved sections (sections that you previously created and saved) and premade sections.

Editing your page’s spacing logically and rationally is essential because this will attract more customers to your store. You can learn how to edit the spacing with margins and padding functions to make your content stand out more.

The following articles will give you a broader understanding of how to use these elements.

In this section

Standard Elements

• Tabs element
• Layout element
• Accordion element
• Slideshow element
• Content List element
• Heading element
• Paragraph element
• Add Button element
• HTML/Liquid element
• Image element
• Icon element
• YouTube element
• Vimeo Element
• HTML Video element
• SoundCloud element
• QR Code element
• Divider element
• Facebook Like element
• Instagram element
• Facebook Page element
• Twitter element
• Table element
• Countdown Timer element
• MailChimp Form element
• Google Map element
• Progress element
• List element

Shopify Elements

• Shopify elements – Product List
• Shopify elements – Product Details
• Shopify elements – Product Media
• Shopify Elements – Product Title
• Shopify elements – Product Vendor
• Shopify elements – Product Price
• Shopify elements – Product Description
• Shopify elements – Product Variant
• Shopify elements – Product Quantity
• Shopify elements – Product Add To Cart
• Shopify elements – Product View Details
• Shopify element – Product Metafield
• Shopify elements – Collection List
• Shopify elements – Collection Details
• Shopify elements – Collection Image
• Shopify elements – Collection Title
• Shopify elements – Collection Description
• Shopify elements – Collection View Details
• Shopify elements – Customer Form
• Shopify elements – Customer Form Field
• Shopify elements – Customer Form Button
• Shopify elements – Contact Form
• Shopify elements – Contact Form Field
• Shopify elements – Contact Form Button
• Shopify elements – Search Form
• Shopify elements – Blog Posts List
• Shopify elements – Blog Post Details
• Shopify elements – Blog Post Image
• Shopify elements – Blog Post Title
• Shopify elements – Blog Post Content
• Shopify elements – Blog Post Meta

Third-party Elements

• How to activate integrated third-party Shopify apps to use on your pages
• What apps does PageFly integrate with?
• Reviews and ratings
• Upsell and cross-sell
• Badges and seals
• Appointment booking
• Delivery and pickups
• Subscriptions
• Order tracking
• Upload fields
• Email marketing
• Product information
• Push notifications
• Referral and affiliate marketing
• Image and media
• Loyalty and rewards
• Sustainability
• Gifts
• Internationalization
• Advertising
• Support
• SMS Marketing

Video tutorials

Legacy Editor

This video will give you a clear demonstration so you can understand more about the page structure in the Legacy Editor of PageFly.

Gen 2 Editor

To take your page-building skills further, watch our latest tutorial on building sections, blocks, and responsive layouts with the new Gen 2 Editor to optimize your Shopify pages.