Go back

Shopify’s Summer ’24 Edition: New Style Settings for Flexible Storefronts

Date

Shopify is making it easier than ever for merchants to create storefronts that truly reflect their brand’s unique look and feel. With the latest updates from the Summer ’24 Edition, the focus is on giving merchants more control over their site’s design and layout, allowing them to adapt and change styles as their brand grows.

Key Takeaways

  • Enhanced Layout Flexibility: New Style Settings allow theme developers to give merchants granular control over section and block customization.
  • Device-Specific Customization: Styles can be easily adapted for different devices, simplifying mobile design adjustments.
  • Static Blocks for Complex Layouts: Developers can now create more intricate designs like accordions or conditional elements.
  • Data Passing for Nested Blocks: Blocks can pass resources like products and collections to their children, simplifying data connections in custom layouts.

More Control Over Your Store’s Look

Shopify understands that a storefront needs to perfectly capture a brand’s identity. They also know that brands change and evolve, so the website’s design needs to keep up. Earlier this year, they introduced Themed Blocks, which made blocks more reusable. Now, with Style Settings, they’re taking it a step further.

These new settings give theme developers the power to let merchants customize layouts for sections and blocks. This makes building unique designs much simpler and faster. Imagine a theme with an image gallery section. Using the layout panel, a merchant could change things like the direction of the images, how they align, or the space between them, all to create a look that’s totally their own.

Adapting Designs for Every Device

One of the really neat things about Style Settings is how they handle different devices. Merchants can now customize how their site looks on mobile without needing a separate set of settings. This means the design can be consistent and look great whether someone is browsing on a desktop or a phone, all from the same place.

Building Advanced and Functional Layouts

Shopify is also introducing the ability for blocks to be statically rendered. What does this mean? It means merchants won’t be able to reorder or delete these specific blocks. This is a big deal for theme developers because it allows them to build more complex layouts. Think about things like an accordion menu, where content expands and collapses, or a "view all" button that only appears when there are more products to show than what’s currently displayed on the page. This level of control opens up a lot of possibilities for creating more interactive and functional storefronts.

Simplifying Data Connections

As Shopify moves towards more reusable blocks and offers more layout customization, they’re also making it easier to connect data. Blocks will be able to pass resources like products, collections, and metaobjects to their child blocks. This is super helpful for hooking up data, especially in custom layouts that have a lot of nesting. It simplifies the process of making sure the right information is displayed where it needs to be, even in complex designs.

These updates are a big step forward for creating flexible sections on Shopify. It’s exciting to see what developers and merchants will build with these new tools.

You may also like: