CSS in App Sections

Appifiny
Shopify Partner
165 2 53

We are just getting started with the new sections architecture.

In the documentation for app sections, {% stylesheet %}  is not permitted.

What is the recommended way to add CSS to an app section.

Should we include it in <style></style> in the app section liquid code?

Or should we create a CSS file and insert it in the assets folder and then load it in the theme. This would still get left behind on app uninstallation though right?

Thanks in advance,

Asa

Try the best recent order app for Shopify free for 7 days: https://apps.shopify.com/recently
Replies 3 (3)

Appifiny
Shopify Partner
165 2 53

Any advice on this @Liam?

Try the best recent order app for Shopify free for 7 days: https://apps.shopify.com/recently

ThomasBorowski
Shopify Expert
803 71 239

It seems the only option is to include CSS within <style></style> tags and append -{{section.id}} to styles that are user-configurable via the theme editor so they only apply to the respective section/instance.

★ Smart Upgrades, Tips and Tutorials for Shopify themes: cartpunk.com
Did my solution work? Help other Community members easily find the correct solution and apply it to their own stores by marking it as the Accepted Solution and giving it a Thumbs Up
Appifiny
Shopify Partner
165 2 53

I thought this was probably the case.

It seems like Shopify have only considered part of the problem with theme sections.

There needs to be a method of bundling assets that are automatically removed on app uninstallation.

 

Try the best recent order app for Shopify free for 7 days: https://apps.shopify.com/recently