Cart Drawer does not Automatically Update

OverviewClick to copy

In this article, you will learn about a PageFly page’s issue that the cart drawer (cart icon) does not automatically update when you add product(s) to your cart. It means that when customers click on the Add to Cart button, the cart drawer of your store’s theme stays static instead of automatically updating the products.

Basically, PageFly works well with Shopify themes. However, with some themes, especially the cart mechanism working makes conflict with PageFly, therefore there is the cart drawer not updating automatically.

How To FixClick to copy

To fix this problem, please follow these steps:

  • Go to Shopify Admin > Online Store > Themes.
  • In the Current theme > click Customize.
  • On the left sidebar, click App embeds.
  • Check the box next to PageFly Theme Helper.
  • Click Save.

This will fix the issue for 60% of Shopify themes. If the issue persists, please check the solutions below for your specific theme. If you do not find your theme listed, please contact our support team.

Please note that you need to know the original theme name in case you have changed it.

For more details, you can check the video tutorial below:

How to Fix When The PageFly Theme Helper Doesn’t WorkClick to copy

First of all, you need to access the theme files of Shopify Admin

Go to your Shopify Admin > Online Store > Themes > Edit code

Note that for each theme, the code to fix this issue is different. You can find the code for your theme in the list below.

Narrative ThemeClick to copy

With the Narrative theme, you just need to add the required code inside the theme.liquid file

Venue ThemeClick to copy

With the Venue theme, you just need to add the required code inside the theme.liquid file

Turbo ThemeClick to copy

  1. Go to app.js.liquid file and search refreshCart
  2. Add window.refreshCart like this video
  3. Search add.js in app.js.liquid file and copy the code below that like this video
  4. Add the above copied code inside window.__pagefly_helper_store code in theme.liquid file to make add to cart work like this video

Dawn – Origin – Taste – Craft – Refresh – Sense With Theme Popup NotificationClick to copy

With Dawn Theme, please add this code to the theme.liquid file

Note: You have to change the “View my cart” text in the code accordingly to your store language.

Dawn – Origin – Taste – Craft – Refresh – Sense Theme New Version With Cart DrawerClick to copy

With the Dawn – cart drawer, please add this code to theme.liquid file

Blockshop ThemeClick to copy

With the Blockshop theme, you just need to add the required code inside the theme.liquid file

Boundless ThemeClick to copy

  1. Go to javascript files of theme and find ajaxCart
  2. Add window.ajaxCart after ajaxCart like var ajaxCart = window.ajaxCart
  3. Add this code in theme.liquid

Porto ThemeClick to copy

With Porto theme, please check this link  here for the solution

Cospora ThemeClick to copy

With Cospora theme, please check this link here for the solution

Flex ThemeClick to copy

With Flex  theme, please check this link here for the solution

Grid ThemeClick to copy

With Grid theme, please check this link here for the solution

Galleria ThemeClick to copy

With Galleria theme, please check this link  here for the solution

Debutify & Palo Alto ThemeClick to copy

With Debutify theme, please follow these steps

  1. Go to theme.js.liquid file and then search theme.ajaxCart, ajaxify, ajaxCart
  2. Check in live view with this keyword to see there is an load function or update function or not

Example: theme.ajaxCart.update() or ajaxCart.load()

If there is one of keywords above, add this code into theme.liquid file

Here is the tutorial link here

If you follow the guide above but it is not working and the cart drawer show blank

Please add this code

Avone ThemeClick to copy

With Avone theme, please check this link here for the solution

Showtime ThemeClick to copy

With Showtime Theme, please check this link  here for the solution

Rebranding ThemeClick to copy

With Rebranding Theme, please add this code to the theme.liquid file

Envy ThemeClick to copy

With Envy Theme, please check this link here for the solution

Basel ThemeClick to copy

With Basel Theme, please check this link here for the solution

Ella ThemeClick to copy

With Ella  Theme, please check this link here for the solution

Lusion ThemeClick to copy

With Lusion Theme, please check this link here for the solution

Atlantic ThemeClick to copy

With Atlantic Theme, please add this code to the theme.liquid file

Motion ThemeClick to copy

With Motion Theme, please add this code to the theme.liquid file

Maker ThemeClick to copy

With Maker Theme, please add this code to the theme.liquid file

Debut ThemeClick to copy

With Debut Theme, please add this code to the theme.liquid file

Note: When you added this code into theme and this does not work. You can open console.log() in live view and see there is any error for this. If you see this error “$ is not define…”

You should copy and paste this line into theme.liquid file

<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js”></script>

Express ThemeClick to copy

With Express Theme, please add this code to the theme.liquid file

Impulse ThemeClick to copy

With Impulse Theme, please add this code to the theme.liquid file

If the code above not work, you can try add this code instead

Wokiee ThemeClick to copy

With Wokiee Theme, please add this code to the theme.liquid file

ABZ – IconClick to copy

With ABZ – Icon, please add this code to the theme.liquid file

Streamline ThemeClick to copy

With Streamline Theme, please add this code to the theme.liquid file

Bold-MovivatiorClick to copy

With Bold-Movivatior Theme, please add this code to the theme.liquid file

Brooklyn ThemeClick to copy

With Brooklyn theme, please check out this video for solution

If you follow the guide above but it is not working and the cart drawer show blank

Please add this code

Lorenza ThemeClick to copy

With Lorenza theme – you need to make sure that the theme shouldn’t be minified

Please check this video for solution

Kalles ThemeClick to copy

With Kalles theme please add this code to theme.liquid file

Prestige – Warehouse ThemeClick to copy

With Prestige or Warehouse theme, please add this code to the theme.liquid file

If the code above not work, please add this code instead

EcomSolidClick to copy

With EcomSolid Theme, please add this code to the theme.liquid file

FocalClick to copy

With Focal Theme, please add this code to the theme.liquid file

Focal 8.10Click to copy

With Focal 8.10 Theme, please add this code to the theme.liquid file

RetinaClick to copy

  • Step 1: Update code on retina.js

Slate ThemeClick to copy

Follow this video instruction for solution

Expanse ThemeClick to copy

Follow this video instruction for solution

Custom Theme (minimog)Click to copy

Please add this code to the theme.liquid file.

MeroxIO Custom ThemeClick to copy

Please follow this video for solution.

Showcase ThemeClick to copy

With Showcase Theme, please add this code to the theme.liquid file

Lorenza ThemeClick to copy

Please follow this video for solution.

MODULAR ThemeClick to copy

With MODULAR Theme, please add this code to the theme.liquid file

Electro – Zeexo ThemeClick to copy

Step 1: search and open bc.script.js.liquid in theme code

Step 2: search AT_AddCart and move it to window like this video : link

Step 3: please add this code to the theme.liquid file

Boost ThemeClick to copy

With Boost Theme, please add this code to the theme.liquid file

ReachClick to copy

With Reach Theme, please add this code to the theme.liquid file

District ThemeClick to copy

Please follow this video for  solution.

Vela ThemeClick to copy

  • Step 1: Move this function to window in ‘vela.js’ and added the code helper.

Pipeline, Testament ThemeClick to copy

  • Step 1: Move cartUpdateCallback to window first.

Shella ThemeClick to copy

Shella Theme Version 5.0.1Click to copy

With Shella Theme 5.0.1, please add this code to the theme.liquid file

Prestige Theme – WarehouseClick to copy

With Prestige theme – Warehouse (for some version only), please add this code to the theme.liquid file

Lammer Theme 4.0.0Click to copy

With Lammer theme 4.0.0, please add this code to the theme.liquid file

Warehouse 2.5.2 ThemeClick to copy

With Warehouse 2.5.2 theme, please add this code to the theme.liquid file

Turboant ThemeClick to copy

With Turboant theme, please add this code to the theme.liquid file

Broadcast ThemeClick to copy

With Broadcast theme, please add this code to the theme.liquid file

Be Yours 4.1.0 ThemeClick to copy

With Be Yours 4.1.0 theme, please add this code to the theme.liquid file

Solodrop-2.4.0 ThemeClick to copy

With Solodrop-2.4.0 theme, please add this code to the theme.liquid file

Pop version 3.0.4 ThemeClick to copy

With Pop version 3.0.4 theme, please add this code to the theme.liquid file

You can watch this video guide for more information.

Flow version 16.3.1 ThemeClick to copy

With Flow version 16.3.1 theme, please add this code to the theme.liquid file

You can watch this video guide for more information.

Tips And Best PracticeClick to copy

For all themes, it’s required to have this same code.

If your theme is not listed above, please ask your Theme Provider to have their own theme code so they can update their code in the red box as the demonstration below:

This code also needs to be added to the theme.liquid file.

Navigate this category

Thank you for your feedback!

Could not find the answer
to your question?

Chat with us