Re: Show code when metafield is filled

How do I display code on thank you page based on filled metafield?

LittlePaddocks
Excursionist
43 1 8

Hi all!

 

I have the following code added to my thank you page using the 'additional scripts' section in checkout settings.

 

<script>
   Shopify.Checkout.OrderStatus.addContentBox(
     '<h2>Delivery message (if applicable)</h2>',
     '<p>{{ order.metafields.custom.message_to_customer }}</p>'
    )
</script>

 

I wondered if anyone could please offer some advice on how to achieve the following... Display this code on the thankyou page when a metafield is filled. When it is blank, show nothing.

 

The metafield is a multi-line text type.

 

Thank you!

Replies 4 (4)

SomeUsernameHe
Shopify Partner
495 54 99

Try this: If not, I would have to give you some code to place directly into your theme files:

 

<script>
  // Check if the metafield has content
  var message = '{{ order.metafields.custom.message_to_customer }}';
  
  if (message.trim() !== '') {
    Shopify.Checkout.OrderStatus.addContentBox(
      '<h2>Delivery message (if applicable)</h2>',
      '<p>' + message + '</p>'
    );
  }
</script>

 




Have I helped? Consider putting coffee in my mouth!
Buy Me a Coffee
LittlePaddocks
Excursionist
43 1 8

@SomeUsernameHe Thank you for your fast response!

 

I have just tried that and it removes the section when blank. But doesn't seem to re-appear when content is added.

 

If you have any more suggestions that would be greatly appreciated.


Thanks

SomeUsernameHe
Shopify Partner
495 54 99

Of course, hopefully, I can be of some help!

Question, the original code worked correctly right? It displayed the message when the metafield was filled in, except when it is blank it still shows "

<h2>Delivery message (if applicable)</h2>

 Just want to make sure I understand your issue. 🙂

Have I helped? Consider putting coffee in my mouth!
Buy Me a Coffee
LittlePaddocks
Excursionist
43 1 8

@SomeUsernameHe it seems to be the other way round actually.

 

The code hides the section when blank but doesnt show it when it is filled in.