Revolutionize Your Online Business: Hide Prices Strategically

Discover an innovative strategy to customize your online store to your business needs by taking advantage of the ability to hide prices from non-logged-in users. While this customization requires a certain amount of coding knowledge, the potential benefits to your business can be significant.

Learn how to embark on this advanced journey here:

1. Gather The Necessary Information:

In your HTML code, a JavaScript variable should enable us to identify whether the user is logged in or not. Once you have set up this JavaScript variable, the next step is to configure the Doofinder script with the necessary function to hide the price for unlogged users.

Consider the following example, where our JavaScript variable is configured as follows:

• Example:

let dfGroup = 0; 

It returns 0 if the user isn't logged in and 1 if the user is logged in.


  <script>
const UpdateCardHook = {
  mounted() {
  this.changeResults = () => {
  const dfPricing = document.querySelectorAll('.dfd-card-row');
  for (let i = 0; i < dfPricing.length; i++) {    
  if(dfGroup == 0){
    dfPricing[i].remove();
  } 
  }
  }
  },
  updated(){
  this.changeResults();
  }
};

  const dfLayerOptions = {
    installationId: 'XXXX-XXXX-XXXX-XXXX-XXXX',
    zone: 'XX',
    hooks: {
    Carousel: UpdateCardHook,
    Results: UpdateCardHook,
    Layer: UpdateCardHook
  }      
  };



  (function (l, a, y, e, r, s) {
    r = l.createElement(a); r.onload = e; r.async = 1; r.src = y;
    s = l.getElementsByTagName(a)[0]; s.parentNode.insertBefore(r, s);
  })(document, 'script', 'https://cdn.doofinder.com/livelayer/1/js/loader.min.js', function () {
    doofinderLoader.load(dfLayerOptions);
  });
</script>

2. Configure The Doofinder Script:

In the next step, configure the Doofinder script with the necessary function to hide prices for users who aren't logged in. Use the JavaScript example provided, in which dfGroup is checked to determine the user status.

Remember to replace the 'XX' in dfLayerOptions with the values that correspond to your store settings.

3. Insert The Script Into Your HTML:

Once the script is ready, insert it seamlessly into your HTML code. Replace the existing Doofinder script so that you only have one Doofinder script in your HTML code.

4. Modify The Doofinder Script According To Your Platform:

For WordPress, Shopify and BigCommerce, search for the script in the respective platform configurations and modify it.

• WordPress: Locate the script in the Doofinder plugin configuration.
• Shopify: Find the script in your theme code under the "doofinder-script-tag.liquid" fragment.
• BigCommerce: Access the script in your BigCommerce panel, under Storefront > Script Manager.

For other platforms, the script must be inserted manually into the HTML code. Make sure you disable the display of layers in the plugin configuration to prevent script duplication.

Do you have any questions or need help? To contact our Support Team, simply log in to your Doofinder admin panel. Click on 'Help' in the top blue bar, then select 'Contact our Support Team’.

If you're already logged in, you can reach support by clicking here.

Transform your online business with strategic pricing today!