Table of Contents

PageFly 4.18.0: Improving Color Picker, Content List Items' Styling Synchronization & Updating Global Styles

当社の事業は、アフィリエイトから得られる手数料によって支えられています。 詳細

Hi there,

Richard here from the PageFly team! We are thrilled to announce the release of PageFly version 4.18.0. The latest update brings many exciting improvements, focusing on enhanced user experience and design flexibility. With a revamped Color Picker, essential improvements for Content List Items' Styling Synchronization, and key updates to Global Styles, this release ensures building high-converting Shopify pages is more seamless than ever.

Whether you are a beginner or an advanced merchant, these updates empower you to create visually stunning storefronts with less effort. Let’s dive into what’s new and how these changes elevate your PageFly experience.

Improving Color Picker with Gradients

What’s New

In previous versions, PageFly only offered a solid color picker, limiting design flexibility to flat, single-color backgrounds. This restricted users from experimenting with gradient-based designs—a popular trend for modern e-commerce storefronts.

With PageFly 4.18.0, the new gradient-enabled Color Picker allows users to create dynamic, multi-tone visuals. Key updates & benefits of this latest update include:

  • Gradient support: Users can apply multi-color gradients without external design tools, enabling more visually engaging sections and banners.
  • Color stop control:You can now set a maximum of 10 color stops, controlling exactly where colors change within the gradient.
  • Precise positioning:Adjust stop positions from 0% to 100% to fine-tune how gradients transition, ensuring brand consistency across elements.
  • Background Gradient parameter:This new parameter in the Page Editor’s Styling tab simplifies the application of gradient background colors to various elements.

The solid color picker

Old color picker

The new gradient color picker

The new gradient color picker in PageFly 4.18.0

How It Works

  • With color stop, users can control exactly where colors change within the gradient
  • The gradient color stops can be precisely positioned with percentage values ranging from 0% to 100%, offering fine-tuned control over transitions between colors
How the color picker works in PageFly 4.18.0
  • Customizing color stops within a wide range of color code
  • Applying gradient background colors to various elements in PageFly's Styling tab
Applying gradient background colors in PageFly 4.18.0

Updating Content List Items' Styling Synchronization

What’s New

The Styling Synchronization feature has been simplified in PageFly 4.18.0 to make it more intuitive and user-friendly with only 2 options. In previous versions, the styling synchronization process was more rigid, with more complex styling synchronization options (Sync to master, Unsync Content List Item element only & Unsync Content List Item and all children). Now, the latest update offers clearer synchronization controls.

 Key updates & benefits of this new update include:

  • Simplified Controls: The two-option Sync item setting removes complexity, making it more intuitive and user-friendly.
  • Increased Flexibility: The new Object Unsync parameter gives users finer control over which elements stay synchronized and which can be independently styled.
  • Cleaner Interface: The Object Unsync parameter only appears when needed, ensuring a clutter-free workspace by displaying relevant settings at the right time.

How It Works

  • For the new Styling Synchronization in the Content List Item, there are two main synchronization options:
  1. Yes – Synchronize the styling across content list items.
  2. No – Disable synchronization for the selected item, giving it an independent style.

The two-option Sync item setting eliminates confusion, making the process easier for users to understand and use.

Updating Content List Items' Styling Synchronization
  • The new Object Unsync parameter allows more precise control over which elements maintain synchronized styling and which do not. Object Unsync Parameter only appears when the “No” option is selected for the Sync item.
Object Unsync parameter in PageFly 4.18.0
  • Users can now choose between 2 object unsync options:
  1. Container – Only unsyncs the content list item itself, while keeping its child elements synced.
  2. All – Unsyncs both the content list item and all its child elements, providing complete styling independence.

Updating Global Styles

What’s New

With the release of PageFly 4.16.0, the Gen 2 Editor with Flex Layout (Beta) introduced a modern framework that gave users greater design control.

The Global Styles feature has received several key upgrades in PageFly 4.18.0 to enhance its compatibility with the Gen 2 Editor and provide users with more flexibility in managing their designs. In previous versions, Global Styles were limited in scope, particularly when managing custom fonts and layout components. With this update, users can now enjoy the following improvements:

  • Custom Fonts Management in the Page Editor: Not only in the Global Styles, users can now also view and upload custom fonts directly within the Page Editor, which makes the process less time-consuming.
  • New Container Elements in Global Styles:This element provides better structure and control for layouts, ensuring seamless styling across different page components.
  • New Field Element in Global Styles: This element ensures greater consistency across forms and interactive fields throughout the website.

Upload custom fonts only in Global Styles in the old version

Upload custom fonts only in Global Styles in the old version

Upload custom fonts right in the Page Editor

Upload custom fonts only in Global Styles in PageFly 4.18.0

How It Works

  • Uploading custom fonts to individual elements or sections in Page Editor
  • Accessing the Global Styles settings to use the new Container elements for Flex-based sections
New container element in PageFly 4.18.0
  • Configuring Field elements to standardize the design of input fields in Global Styles, ensuring uniformity across all forms on your site
New field element in PageFly 4.18.0

Important Note

All of our new updates are only available in the Gen 2 Editor with the new Flex Layout, which is exclusively offered under the current pricing model with slot plans. If you are using the old pricing model (Silver/Gold/Platinum), you will need to switch to the new pricing model to access the Gen 2 Editor. Please refer to this guideline for more details.

Final thoughts

The PageFly 4.18.0 update offers powerful new capabilities that elevate the design experience for Shopify merchants. With features like gradient support for color pickers, refined synchronization options, and enhanced Global Styles, users can enjoy greater flexibility and control over their storefronts. These improvements reflect PageFly’s dedication to providing tools that are both easy to use and aligned with modern design needs.

Ready to take your Shopify store to the next level? Explore all the new features in PageFly 4.18.0 today and create pages that captivate customers and drive conversions.

Don’t forget to visit our blog to catch up on previous updates, including:

Explore Now

今すぐNo.1のShopifyページビルダーをお試しください

PageFlyを無料でお試しください
Discover unique store names with our Amazon Store Name Ideas Tool. Stand out from the competition today!    👉🏼Try it now