Manage Custom Blocks

Estimated reading: 7 minutes 37 views

In this post

Edit Options

You can find the basic settings for each field here (like content, text style etc.)

Conditions

Display rules can be configured for any block or component using one or multiple conditions. There are two types of conditions: “Block condition” and “Component condition“.

1. Block condition is used to config display rules for the entire block. These conditions can help you set rules that are related products in cart, cart total, customer tag, etc.

Number of current conditions will be displayed here

2. Component condition is used to setup custom display rules for a specific component within a block. These virtual conditions are related to other custom blocks in the same form.

  • For example: You can make a product offer appear when a checkbox is ticked off.

Hover on the component you want to add display conditions
Setup your custom rules
  • ANY/OR” means only one condition needs to be met to trigger action A
  • ALL/AND” means all conditions must be met to trigger action B

Functions

When configuring the blocks, you have the option to select in the Functions tab where you’d like to store the collected data or how you want the next action to be

Apply value as checkout attribute

Save input value to customer’s order as an attribute

  • Attribute key: Enter the key to display your value
  • Note: If fields have the same key, the system will only save the last value in the form

Collected info will be saved in Additional details

Apply value as metafield

If you select this, the input value will be saved to customer’s order as a metafield

Let us give you an example: Choose the Effect type “Apply value as metafield” and fill Metafield key as “date-picker”

Now to make it show in your order details, you need to define a metafield first

Go to Store settings > Custom data > select Orders
Click Add definition
  • Name: Enter the name field to show in your orders
  • Namespace and key: checkout_craft.[your key] like “checkout_craft.date-example”
  • Select type: Single line text

Click Save and now you can test some orders to see if it’s working.

Match value and apply discount code using metaobject’s metafield

The function “Match value and apply discount code using metaobject’s metafield” is designed for text-type form field components. Its purpose is to compare the value entered in the text field with a metafield within a metaobject. If a match is found, a discount code will be applied.

Let’s show you an example: Affiliate. If customers are referred from another party (influencers etc.), show a text input field. Customers can type in the name of the referrer then the corresponding discount will be applied if it finds a match.

Here are step by step instructions:

1. Create discount codes

In Shopify admin, create discount codes you want to use in this campaign

2. Create Metaobject and setup Metaobjects

Matching the value of the field happens against data saved in a metaobject. You can create a metaobject and add its definition in Shopify settings.

Name: whatever you want; Field: choose JSON

A popup will open to config your JSON, enter a name and click Add

Save this value for use later
Remember this metaobject type to enter later

Now go to Content > Metaobjects > Add Entry and setup the metaobject we’ve just created above

Please note that for this function to run properly, the structure of the JSON must be array of objects. You can check our sample below:

				
					[
  {
    "input": "KATHLEEN5",
    "ApplyDiscount": "5_OFF"
  },
  {
    "input": "JUUNGUYEN10",
    "ApplyDiscount": "10_OFF"
  },
  {
    "input": "JASON20",
    "ApplyDiscount": "20_OFF"
  }
]
				
			

Once saved, collect all the required values to setup your function in Checkout Craft

3. Setup your function in Checkout Craft

Enter the values you’ve noted into corresponding fields

1 – [Metaobject] Handle

2 – [Metaobject] Type

3 – [Entry] Name key

4 – [Entry] Match value key

5 – [Entry] Discount code key

4. Test the function on storefront

Leave a Comment

Share this Doc

Manage Custom Blocks

Or copy link

CONTENTS