Create falling snow effect for your Shopify store

Holiday Snow is a app in Apps store of Shopify. Holiday Snow allows you to add a “falling snow” effect to your Shopify store with no coding required! Holiday Snow provides an easy way to add some Holiday Cheer to your Shopify powered site. The easy one click means anyone can add a “falling snow” effect. But you have to pay $5 per month for it.

This article will guide for you create this effect for your store. And you can enjoy without having to pay any costs.

Here we go.

Step 1: Create a shopifytips-snowflakes snippet

  • Open this Liquid code snippet.
  • Select and copy all of the text.
  • In a new tab, open up your shop admin.
  • Go to the Edit HTML/CSS page.
  • Click the Snippets folder.
  • Under the Snippets folder, click Add a new snippet.

falling snow 1

  • Give your snippet the name shopifytips-snowflakes and click Create snippet.
  • In the online code editor, paste the content from your clipboard.
  • Click Save.

Step 2: Add to your Customize theme page

  • On the Edit HTML/CSS page, locate and click Config.
  • Under the Config folder, locate and click the settings_schema.json file. This will open the file in the online text editor.

falling snow 2

  • Scroll down to the very bottom of your settings_schema.json file and add this code before the last square bracket ] and after the last curly bracket } – make sure to include that first comma , since you’re modifying a JSON data structure:

  • Click Save.

Step 3: Include the shopifytips-snowflakes snippet in theme.liquid

  • Go to the Edit HTML/CSS page.
  • Under the Layout folder, locate and click the theme.liquid file to open it in the online code editor.
  • Look for the </body> tag and add the following code above it:

  • Save your changes.

Step 4: Configure your effect

You can now configure your falling snow effect using your Customize theme page:

  • Go to the Customize theme page.
  • Configure your falling snow effect in the Falling Snow Effect section:

falling snow 3

OK. Now you can access your site for check.

Falling snow effect demo

This demo shop has a falling snow effect.

If you get stuck in the process of work you can contact me to get help or hired me to do that.

Huynh Mai Anh Kiet

You may also like...

9 Responses

  1. Vero says:

    Work!, very nice, thanks, but can I change the snowflakes shape and look?

  2. Vero says:

    the snowflakes tool works on the web but leaves a weird black snowflake at the top left corner of every page, which causes problem when open a new link/page. To open a new link, now I have to click on the link and refresh it once more to make it appear, otherwise it’s show an empty page, why is that? any way to fix it?

  3. Sofia says:

    Hi! I just installed and enabled it, but now the Olark Chat won’t pop up! 🙁

    Any way to fix it?

    • Yes, I checked. This issue have reason by a variable in my code is duplicate with a variable in Olark code. Fix:
      – Open: shopifytips-snowflakes.liquid
      – In line: 30, 31, 39. You must change name of variable “opera” to “br_opera”
      – Save and check again.

      Thanks

  4. Nav says:

    How can I change the flakes to hearts?

    • Yes, you can. In shopifytips-snowflakes.liquid file:
      – Inline 11 change:
      var snowcolor=new Array(“#aaaacc”,”#ddddff”,”#ccccdd”,”#f3f3f3″,”#f0ffff”);
      to
      var snowcolor=new Array(“red”);
      – And inline 13 change:
      var snowletter=”*”;
      to
      var snowletter=”♥”;

      Done!

  5. I just want to say that this page has helped me so much. Thank You

Leave a Reply

Your email address will not be published. Required fields are marked *