PageFly - Get started in 5 mins

1818 views 9

In this article, you will learn how to create a simple page with the key features and tools.

Step 1: Install PageFly page builder

If you already installed the app, skip this step and move to the next one.

Visit PageFly page on Shopify App Store, click the Add app button and fill in your store’s URL to install the app to your Shopify store.

Step 2: Create a new page

In the Shopify admin sidebar, click Apps > PageFly – Advanced Page Builder. After that, you will be redirected to the PageFly Dashboard.

Click Create a new page to create a new regular page.

To explore other page types, choose the “+” sign. You can read more about other page types that can be created with PageFly here. You can always change your page type later.

pagefly-create-new-page

Important: Some page types are only available in paid plans.

Step 3: Get to know the key features

After creating a new page, you will be redirected to the Page Editor.

The Template Library window will pop up, which lets you choose a template to quickly start with.

Here are some features in the Page Editor to help you understand how PageFly works:

Top barSet up general information of your page, including page title, website SEO and device type. Select Pick a template to access the template library.
Add elementOffers PageFly basic elements and sections. Drag and drop them to the blank page.
Add Shopify elementOffers Shopify elements and sections.
Add saved sectionStores saved section that you can re-use in another part of the page or a different page.
Show page outlineDisplays the page outline inside the Editor.
Set pre-defined styleCreates a generic style for boxes, buttons and texts.
Add Custom CodeAdds your CSS and JavaScript code to the page.
Version historyShows auto-saved and published versions. The feature will be activated once you publish the page.

Step 4: Use PageFly elements

First, click Add Element > Element or Section to get started with a layout for your design.

Select the element and you can edit it with 2 tools:

  1. Element toolbar: Quickly take action on the element, including: move; duplicate; delete; lock; pick a pre-defined style; save style; copy style; paste style; and save section to the library.
  2. Element inspector: Edit the settings and stylings of the element with 3 tabs: General, Styling and Advanced.

Learn more about PageFly page structure.

Step 5: Preview or publish the page

Once you’re done building the page, hit Save. This option saves the page to a database but does not make it public yet. You can see the page preview via View > Preview.

The Save & Publish button both saves the page and makes it public. You can see the live page via View > Live Page. The page will links to your store with the address “your-shop-name.myshopify.com/pages/page-name”.

You can check the PageFly page in Shopify database by going to Shopify admin > Sales Channels > Online Store > Pages.

Was this helpful?