Modifications to Shopify 2.0 Dawn theme to create this store for Joliette London. Created Product tags and a Logo List Banner. Added a Dual Banner with Buttons to the Hero Image and very small edit to Image with Text to make it full screen. Some of these required editing the component classes. I created a gallery for the product page, add an instagram module and pop up newsletter with MailChimp Integration.
Today I spent some time really getting to know the Shopify CLI and Shopify 2.0. I worked through, figuring out all the new parts of Shopify 2.0 and the changes to metafields are everything! Adding a metafield in a template means that you can add have the same field but different content on the same template. I think there is actually more to the templates than that but I haven’t started experimenting with how they work just yet.
I used a Development Theme I called PartySplash and added some assets to it. I also added an upstream branch in Github so that I can get any new updates.
I set up ShopSync as many of my current clients have MailChimp and I’ve not had time to really experiment with it. After a good while I figured out there must be an issue with the base.css file, something to do with div:empty that was affect the close button on the MailChimp pop up, it was showing as display:none, so there was no way to close the pop-up. I added some specific CSS for the Mailchimp pop up close button ( display:block) and that seemed to finally sort it out for now but I know I’ll have to go back to that and look around at the issue further. I recommend looking at Klaviyo if you are just starting out.
I really wanted a sticky header but again I found that this only worked on the scroll up. I encountered this before on Narrative, so I’ll be spending tomorrow rebuilding this, while waiting for the official update. It will give me practice.
Everything else seems to working great so far, my new favourite thing is the way the blocks work. I added reviews to the Products page and it really took all the hard work out adding apps to pages and creating and modifying templates on the development theme was so much easier.
Another thing that took a little while to get my head around was shopify theme pull vs shopify theme push. If you have an existing theme that you are editing ‘push‘ used to overwrite the settings_data.json file, so Shopify added a fix so that it no longer pushed the setting file up to the live (or dev) site. The problem was that if you had a brand new theme and you wrote the code on the Development environment and then tried to edit anything the customise window, now that the settings file wasn’t being updated you would need to do a ‘push’ (with your code) and then a pull ( with the settings_data.json file). Another fix was that I could use two different git branches and then merge them but that got messy very quickly so I found that it was easier to push then pull.
Hopefully I’ll be able to tell you about my first app in my next post.
Site created for a beauty school. Some fresh design looks created.