Many merchants are now selling Direct to Consumer (D2C) and Wholesale / Business to Business (B2B) at the same time. This is a great way to generate more revenue and Rebuy is here to assist you with that!
There are 2 options for you to consider how best to integrate Rebuy with your D2C / B2B store.
For any questions regarding how to setup your store for Wholesale or B2B business, please contact Shopify Support or the Support team for your specific B2B app.
You may also be interested in bulk quantity updating of items within Smart Cart.
Option 1: Selectively loading Rebuy
Using this approach allows you to choose which of your customer segments can see the Rebuy products you've added to your store. Typically merchants will allow D2C customers to access Rebuy features and will restrict B2B customers to using the stores native features only.
In order to conditionally load Rebuy only for D2C customers, please follow the link below.
Option 2: Allow all customers to access Rebuy features
In order to allow all customers access to Rebuy features you'll have to adjust a few settings. B2B pricing will show correctly when items are added to Rebuy's Smart Cart, however the prices shown in Rebuy widgets will not automatically update to B2B pricing.
To solve for this there are 2 data source options you can use and 1 coding option. Please read further to select the correct option for your store.
Data Source Option 1: Hide the widgets for B2B users
Because Rebuy widgets will not automatically show B2B pricing, you can choose to hide them from B2B customers.
In your Shopify Admin settings you'll know which of your customers are B2B, if you tag these customers (example: b2b) then you can use that tag in the data sources.
In the data source of each widget, click the "Add Before" button on Rule 1. This will create a new rule above that will now be Rule 1.
Set the rule to check for customer tags (example: b2b) and if found, return no products then exit if matched. This will hide the widget from all customers with that tag and prevent any other rules from returning products.
This prevents them from seeing incorrect widget prices but they can continue using Smart Cart which will show the correct prices automatically.
Data Source Option 2: Create a rule that discounts products for B2B
In your Shopify Admin settings you'll know which of your customers are B2B and which company they work for. If you tag those customers (example: companyA) then you can use that tag in the data sources.
In the data source of each widget, click the "Add Before" button on Rule 1. This will create a new rule above that will now be Rule 1.
This rule will do the following.
Check for customer tags (example: companyA).
Returns a collection of products users from Company A have discounted pricing for.
create the collection in Shopify (you'll know what products each company receives a discount on).
Adds a visual widget discount to those products because the widget doesn't automatically detect B2B prices. (Price will be correct in Smart Cart)
This should match the discount amount you set in Shopify for that company.
Then exit if matched so no other rules can return products.
If you have several B2B companies and they each have different discounts, you'll know what users are assigned to each company.
You can tag those users with the company name. Then create a collection of the products that company receives a discount on (unless all products are discounted) and repeat the step above, creating a new data source rule for each unique company tag.
If all B2B users receive the same discount regardless of company, then one rule will suffice. Just ensure all B2B users have the same tag you use in the data source.
Coding Option: Place code in your theme files to enable B2B prices in Rebuy widgets
This approach involves adding code to your theme files, the code is built for you and instructions are provided below to make it as easy as possible.
We recommend testing in a duplicate theme first, then you can copy the changes into your live theme when you're ready.
This option will not work for Checkout Extensions or Post Purchase widgets, due to Shopify limitations. For either of those widget types you'll need to also use one of the data source options shown above to make them compatible with your B2B users.
Step 1: Create a new snippet file
In your theme files, scroll down to "Snippets" and click "Add a new snippet" then title the new snippet "rebuy-b2b".
It's important you get the spelling correct here.
Step 2: Add code to your rebuy-b2b snippet file
Now you need to add the necessary code to your rebuy-b2b snippet file. The code is copy and paste, no modifications are needed from you.
<-- Click here to see the Step 2 code.
<-- Click here to see the Step 2 code.
This code enables Rebuy widgets to detect B2B pricing and display that amount.
<script>
function enrichProductJSON(products) {
for (var i = 0; i < products.length; i++) {
updateProductJSON(products[i]);
}
function updateProductJSON(product) {
fetch(Shopify.routes.root + "products/" + product.handle + ".js")
.then((res) => res.json())
.then((data) => {
var b2bProduct = data;
for (var i = 0; i < products.length; i++) {
if (products[i].id === b2bProduct.id) {
for (var j = 0, b2b_variant; j < b2bProduct.variants.length; j++) {
b2b_variant = b2bProduct.variants[j];
for (var x = 0, widget_variant; x < product.variants.length; x++) {
widget_variant = product.variants[x];
if (b2b_variant.id === widget_variant.id) {
widget_variant.price = b2b_variant.price;
break;
}
}
}
break;
}
}
});
}
}
// beforeProductsChange runs on every widget and handles both the ready and change states
document.addEventListener("rebuy.beforeProductsChange", (event) => {
setTimeout(() => {
enrichProductJSON(event.detail.widget.data.products);
}, 500)
});
</script>
Be sure to click save after pasting the code into your rebuy-b2b file!
Step 3: Add code to your theme.liquid file
In your theme.liquid file locate the closing body tag. It looks like this </body> you can command + f or control + f to search for it if needed.
Above the closing body tag copy and paste the code shown below. No modifications are needed from you.
<-- Click here to see the Step 3 code.
<-- Click here to see the Step 3 code.
The code will detect when a tagged B2B user logs into your store and then run the rebuy-b2b file, which allows the widgets to detect the B2B prices.
For anyone who is not a tagged B2B user, the rebuy-b2b code will remain inactive.
This code is targeting the specific customer tag "b2b". All B2B users on your store must be tagged 'b2b' for this to work.
You can change the tag if you'd like but all B2B users must carry at least one common tag, that is the tag to use in this code.
Once they log in, the rebuy-b2b code will update the widget pricing to their specific B2B pricing.
<!-- if a tagged B2B user logs in, render file to update Rebuy widget prices -->
{% if customer.tags contains "b2b" %}
{% render "rebuy-b2b" %}
{% endif %}
If you choose to use a different tag, update this line. Keep the tag in the quotations.
{% if customer.tags contains "put your tag here" %}
Hiding Smart Cart features from B2B users
Smart Cart features cannot natively be disabled based on user type, D2C versus B2B. However merchants may not want B2B customers to see the Tiered Progress Bar or Switch to Subscription features that D2C users can access, for example.
For this you'll need to add code to your theme.liquid file. Assuming you followed the coding option shown above you can add to that with the snippets shown below.
<-- Click here to see the customization options.
<-- Click here to see the customization options.
Option 1: Disable Tiered Progress Bar
This option will check for tagged B2B users (same as Step 3 above) but additionally checks if the Tiered Progress Bar is active, and is so, disables it for B2B users.
<!-- if a tagged B2B user logs in, render file to update Rebuy widget prices and disable Rebuy Tiered Progress Bar -->
{% if customer.tags contains 'b2b' %}
{% render 'rebuy-b2b' %}
<script>
/* confirms smart cart loaded */
document.addEventListener('rebuy:smartcart.ready', (event) => {
if (Rebuy.SmartCart.progressBarEnabled()) {
Rebuy.SmartCart.settings.progress_bar.enabled = false;
}
});
</script>
{% endif %}
Option 2: Disable Switch to Subscription
This option will check for tagged B2B users (same as Step 3 above) but additionally checks if the Switch to Subscription feature is active, and is so, disables it for B2B users.
<!-- if a tagged B2B user logs in, render file to update Rebuy widget prices and disable Switch to Subscription -->
{% if customer.tags contains 'b2b' %}
{% render 'rebuy-b2b' %}
<script>
/* confirms smart cart loaded */
document.addEventListener('rebuy:smartcart.ready', (event) => {
if (Rebuy.SmartCart.switchToSubscriptionEnabled()) {
Rebuy.SmartCart.settings.switch_to_subscription.enabled = false;
}
});
</script>
{% endif %}
Option 3: Disable both the Tiered Progress Bar and Switch to Subscription features
This option will check for tagged B2B users (same as Step 3 above) plus remove the Tiered Progress Bar and Switch to Subscription features, if active, for B2B users.
<!-- if a tagged B2B user logs in, render file to update Rebuy widget prices and disable the Tiered Progress Bar and Switch to Subscription -->
{% if customer.tags contains 'b2b' %}
{% render 'rebuy-b2b' %}
<script>
/* confirms smart cart loaded */
document.addEventListener('rebuy:smartcart.ready', (event) => {
if (Rebuy.SmartCart.progressBarEnabled()) {
Rebuy.SmartCart.settings.progress_bar.enabled = false;
}
if (Rebuy.SmartCart.switchToSubscriptionEnabled()) {
Rebuy.SmartCart.settings.switch_to_subscription.enabled = false;
}
});
</script>
{% endif %}
Option 4: Disable the Smart Cart Entirely
This option will check for tagged B2B users (same as Step 3 above) and disable the Smart Cart for those users, they'd interact with your theme cart instead.
<!-- if a tagged B2B user logs in, render file to update Rebuy widget prices and disable Smart Cart -->
{% if customer.tags contains 'b2b' %}
{% render 'rebuy-b2b' %}
<script>
/* confirms smart cart loaded */
document.addEventListener('rebuy:smartcart.ready', (event) => {
setTimeout(() => {
/* removes Smart Cart from the page */
Rebuy.SmartCart.destroy();
/* removes the Smart Cart class name from the body */
document.querySelector('body').classList.remove('smart-cart--enabled');
</script>
{% endif %}
Disclaimer
This article was built with Shopify's native B2B functionality in mind but the solutions shown will function well with other B2B apps.
Option 1 and both data source options will work regardless of which B2B app you use, however the code solution shown above may not work with all B2B apps.
To determine if your B2B app is compatible with the code solution, follow these steps.
Log into your store as a B2B user and navigate to a product page that has a B2B discount.
Your page should show the correct B2B price automatically.
Ensure the URL is only 3 parts.
Your base URL / products / product title
Like this
If there is extra data in the URL after the product title, remove it.
Now add .js to the end of the URL.
Don't forget the dot. It's .js not js alone.
This will show you the Shopify data for that product.
If you don't see the correct B2B price here your B2B app is not compatible with the code solution shown in this article.
Your app is not updating the product price in Shopify and that is where Rebuy pulls prices from.
Please reach out to your B2B app for assistance with this if needed as Rebuy is unable to impact your B2B product pricing in Shopify. In the mean time consider using option 1 or either of the data source options shown above.