Grow Sales & Expand Globally with Top Affiliate Tools.    Start For Free

Drive Sales Through Personalized E-commerce Experiences.👉🏼 Discover now

No credit card required to Start Shopify Trial or Try PageFly

Start Shopify trial Try PageFly freeTry PageFly free

Table of Contents

PageFly 4.19.0: Update Editor code, Refined Copy-Paste, Shopify Font Integration, and Faster Performance

Our operations are supported by commissions earned from affiliates. Details.

Hi there,

Richard here again from the PageFly team! We're thrilled to introduce PageFly version 4.19.0, an update packed with enhancements to elevate your website-building experience.

From optimizing editor functionality and refining copy-paste style to improving request handling and integrating Shopify theme fonts seamlessly, this version is designed to help you create high-performing Shopify pages more efficiently than ever. Let's dive into the details of what's new in PageFly 4.19.0.

Update Editor Code and Notification

PageFly Editor Notification

Objectives

We've made essential updates to ensure the Gen 2 Editor and Legacy Editor operate independently within the source code.

Implementation

  • Implemented a version-checking mechanism to load the appropriate source code for each editor dynamically.
  • We added the new warning banners to notify users when both flex and row/column elements are present on a page, ensuring clarity and design consistency.
Editor Notification

Refine Copy-Paste Style

Objectives

We aim to enhance usability and maintain design consistency by ensuring the "Paste Style" functionality is available only for elements with compatible styles in the clipboard.

Implementation

  • Disable the "Paste Style" button: The button will be deactivated when no compatible styles exist for the currently selected element

Example: If you have not copied any style before, the paste style button will be disabled

disable paste style
  • Restrict style application: Style pasting will be limited to elements with compatible types and versions, ensuring seamless and error-free functionality.

Example:

We cannot copy-paste a style from a section to a heading but can do so between elements of the same type, such as section to section or heading to heading.

Restrict style application

Similarly, styles cannot be copied between different versions of elements, like ProductATC and ProductATC2.

Restrict style for difference version element
Product Add to Cart 1

ProductATC version

Product Add to Cart 2

ProductATC2 version

  • Display an explanatory tooltip: When hovering over the disabled button, a tooltip will explain why the action is unavailable, enhancing user understanding and usability.

The tooltip displays the message following the motif: "No {element-name} styles on the clipboard".

Tooltip sample

Examples of some tooltips:

Tooltip no button styles

Tooltip no button styles

tooltip no compatible button

Tooltip no compatible button

Optimize request handler

Objectives

Ensure app stability and improve page publishing efficiency.

Implementation

  • Apply rate limits for APIs to ensure the stability of the app.
  • Optimize the publish page by using Shopify GraphQL
  • Display user-friendly error messages based on Shopify's returned error codes for better troubleshooting.
error list when publish

Split Theme App Extension Helper File

Objectives

Reduce Initial Load Time and Improve Perceived Performance

Implementation

  • Split the PageFly Theme App Extension Helper File into multiple files, loading only those required for PageFly elements in live view.

Use Shopify Theme Fonts

Objectives

  • Align with the store’s design for a cohesive look and feel.
  • Improve performance by reducing the need to load additional font files.

Implementation

  • Added a category to select Shopify theme fonts directly from the PageFly editor.

  • The selected Shopify theme font settings will automatically update in the PageFly editor.
auto update font setting
  • If the Shopify theme font already includes settings like Bold or Italic, these options will no longer appear in the PageFly editor.
font setting disabled
  • Switching back to a Google font restores the ability to customize text styles.
Switch font
  • We can choose Shopify theme fonts for Properties and Elements of the Global Styles.
set shopify theme font in global style
  • Each Theme has a different theme font setting so when you choose the Shopify theme font before switching the theme, it will automatically apply the Shopify theme font of the new theme.

Example:

We choose this Bevan font for the current Shopify theme.

choose shopify theme

After switching the theme, It will automatically apply the Barlow font of the new Shopify theme.

new shopify theme font

Other Updates

We also fix some bugs and minor security issues to help enhance the app's performance and ensure a more secure and seamless user experience.

Final Thoughts

With the PageFly 4.19.0 update, we're continuing our mission to provide you with the tools and features to effortlessly create stunning and high-performing Shopify pages.

Our team remains dedicated to supporting you 24/7, so feel free to explore these new features, share your feedback, and let us know how they work for you.

As always, we’re committed to improving PageFly based on your needs. Don’t forget to check out our PageFly Blog for details on previous updates and stay tuned for future releases:

Explore Now