Turning On App Embed In The Theme Customizer Changed My Themes Hex Codes From Uppercase To Lowercase

5 0 1

I made this post under Shopify Apps, this post under Technical Q&A, and this post under Shopify Scripts but didn't get a reply, so I'm making another post here. 


I recently started using Elevar, added the app to my Shopify admin, and then turned on the app embed in theme customizer and hit save.



Shopify automatically pushes changes as a new commit in GitHub showing what lines of codes have been changed. And I see that just turning on the app embed itself, without doing anything else before hitting save theme, changes my color hex codes from uppercase to lowercase. Why did this happen?


I reached out to Elevar support and they couldn’t give me an answer, saying that it’s probably Shopify that auto-formatted the hex codes and that they wouldn’t do this; honestly I think they’re just covering up for themselves for something that they don’t have the answer for, but I’m not sure myself. If it’s true, why should Shopify do this? If this was actually Shopify and not Elevar's doing,I've had my theme for quite sometime now, why change the hex codes to lowercase now when Shopify could do it any other time I changed and saved the theme?


There is only one page that got the changes when I turned on app embed, and that’s the very same page where Elevar’s code got injected and is also where the hex code changed. And the hex codes that changed are only the ones close to where the app embed injected their code, the hex codes lower down the page did not change to lowercase accordingly. 


I know hex codes aren't case sensitive, but I'd liked to know why did this change happen automatically and what caused it. This is on the Dawn theme.  


Why did this happen?



Reply 1 (1)

Shopify Staff
2731 299 769

Hi Ken,


I haven't seen this behaviour before - is this only happening with Elevar? If you add an app block from any other app, are hex codes similarly affected?

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog