Skip to content

Widgets

Ensure you select the widget type corresponding to whether you are a 'Little things' seller or a 'Big Things' seller.

Contact pit@shophumm.co.nz if unsure.

Insert the script where you want the widget to display replacing PLACE_YOUR_PRODUCT_PRICE with the product's price.

'Little things' only

If a 'Little things' only seller, use:

For 5 fortnightly payments:

<script src="https://widgets.shophumm.co.nz/content/scripts/price-info.js?productPrice=PLACE_YOUR_PRODUCT_PRICE&little=f5"></script>

'Big things' Dynamic API Pricing

The 'Big things' widget can display dynamic API pricing if you append your merchant number to the script tag.

<script
src="https://widgets.shophumm.co.nz/content/scripts/price-info.js?productPrice=PLACE_YOUR_PRODUCT_PRICE&BigThings&merchantId=YOUR_MERCHANT_ID"></script>

Note the use of the &BigThings and &merchantId parameter.

You will need to replace the YOUR_MERCHANT_ID parameter of the above script with your merchant ID.

Platform-specific Installation Instructions

Dynamic Widget

Provide a price-selector query argument to target the HTML element containing the price. This will update the widget as the product price changes on user selection.

Provide a URL encoded jQuery CSS selector.

Here is HTML taken from a WooCommerce product page:

<span>Product Price:</span>
<p class="price">
    <span id="priceinfo" class="woocommerce-Price-amount amount">
        <span class="woocommerce-Price-currencySymbol">$</span>900.00
    </span>
</p>

Product Price: $900.00

Use the urlencoded %23priceinfo to reference the id #priceinfo

<script src="https://widgets.shophumm.co.nz/content/scripts/price-info.js?price-selector=%23priceinfo"></script>

You could also use price-selector=.woocommerce-Price-amount.amount or any CSS selector to identify the price.

Minimum and Maximum Widgets

"Little things" and "Big things" widgets have default minimum and maximum thresholds.

By default, "Little things" shows when product price is between $20 and $1000, while "Big things" shows only between the price of $80 and $10000.

You can customise the min and max threshold (can only increase the min or/and decrease the max) by setting data-min and data-max accordingly when calling the widget.

<script data-min="20" data-max="300" src="https://widgets.shophumm.co.nz/content/scripts/price-info.js?productPrice=YOUR_PRICE"></script>

Here it will not display for prices above $300 or will display in an altered form for prices below $20.

* humm reserves the right to change branding without prior notice