Frontend Helpers

RockCommerce provides a JavaScript file that enables you to integrate E-Commerce functionality into your existing pages without requiring a complete overhaul of your setup.

Setup

When using RockFrontend just add the file to your site scripts:

// example usage in _init.php
$rf = rockfrontend();
$rf->scripts()
  // example project using uikit
  ->add('/site/templates/uikit/dist/js/uikit.min.js')

  // example project loading the site's main.js file
  ->add('/site/templates/scripts/main.js', 'defer')

  // add this line to load RockCommerceSite magic :)
  ->add('/site/modules/RockCommerce/RockCommerceSite.min.js', 'defer')
  ->minify(!$config->debug);

Cart-Count

RockCommerce - Frontend Helpers

The rc-cart-count attribute allows you to display the number of items in the user's cart. Add it to any HTML element where you want to display the cart count. For example:

<span rc-cart-count hidden></span>

This will automatically update the element with the current cart count from the local storage when the DOM content is loaded.

Note: In the example, the element is initially hidden. Once the cart count is updated, the hidden attribute is removed, making the element visible. To prevent layout shifts, consider using an absolutely positioned badge or remove the hidden attribute so only the number will update.

< Frontend Rendering
Orders >

On this page