Skip to main content
Sign in MENU

Shopify Patch Customer Retention App Theme Blocks

Amanda Short
  • Updated

Shopify Patch Customer Retention App Theme Blocks

Currently the Patch Customer Retention Shopify app supports an app theme block called Pixel. Pixel was designed to create a one-click solution to install every app theme block we support. Right now, this includes our TextChat widget and Loyalty Cash widget. 

Overview

Loyalty Cash Widget

The Loyalty Cash widget is a part of the loyalty program that we offer. . The Loyalty Cash widget is meant to offer ways for customers to earn and cash out loyalty points to use towards future purchases. Rewards as a whole are used as an incentive for customers to join a store’s email list, text list, birthday club, and much more.

TextChat Widget

The TextChat widget is primarily a customer service tool geared towards Patch Customer Retentions’ main goal: to keep customers coming back. The widget can also be used by store owners to collect customer data and ask for messaging consent. 

Configuration

Note: Changes to configuration settings can take up to 1 hour to populate to your web storefront.

Loyalty Cash Widget

Step 1: Design

Banner Settings

Use these settings to add a logo or update the title of the banner section of the widget.

Membership Settings

  1. Use these settings to update the membership section.
    1. Membership Section Title
      1. The membership title is located directly underneath the banner and is in bold
      2. The default value is the customer’s first name and Your Rewards
      3. Update the text to anything that you desire
    2. Become a member details
      1. This body of the text is located directly underneath the membership section title
      2. There is no default text
      3. Update the text to anything that you desire
    3. Button Text
      1. The button text that shows in the widget when the customer is not signed in
      2. The text of the button for the membership section should be used to get customers to join your loyalty program
      3. The default text is “JOIN NOW”

Widget Styling Settings

Use these settings to update the styling of the widget:

  1. Theme Color
    1. Use this setting to change the colors of the background color of the banner, the buttons, icons, and the terms & conditions link.
  2. Website Placement
    1. Use this setting to place the widget on either the left or right bottom corner of your storefront

Ways to Earn Settings

Use these settings to add different ways to earn to the widget.

  1. To add a new way to earn click the purple button with a ‘+’ symbol.
  2. To edit an existing way to earn click the pencil icon (second icon in the actions column of the table).
  3. To delete an existing way to earn from the widget and your loyalty program click the trash can.
  4. To reorder the way the ways to earn appear in the widget click and drag the row with the three lines (first icon in the actions column)

Terms & Conditions Settings

Use this text area to update the Terms & Conditions of your loyalty program. Default Term & Conditions will be displayed in the widget preview (to the left or in the theme editor).

Step 2: Installation

Installation Settings

Loyalty Cash is added to a web page via the Patch Pixel, which can be automatically installed to a Shopify site automatically by enabling the Patch "App embed" in your Shopify Theme Settings.

To install the Loyalty Cash widget:

  1. Click the VIEW IN CURRENT THEM EDITOR button
  2. View the widget in the theme editor preview
  3. Click the save button from the theme editor
  4. The widget will not be available on your storefront

Manual Installation

See this related article: https://help.citygro.com/hc/en-us/articles/5372272281111-How-To-Add-the-Script-Tag-to-the-Shopify-Theme-Code

 

TextChat Widget

Step 1: Design

Basic Settings

Use these settings to get your customers started with their messages.

  1. Banner Text
    1. The banner text is located at the top of the widget.
  2. Message Text
    1. The message text is located directly below the banner
    2. Use this message text to communicate to your customers on what to do and what to expect next
  3. Checkbox for SMS marketing opt-in
    1. This checkbox is located below the input fields of the widget (name, phone, message)
    2. Use this checkbox to add or remove a checkbox that allows customers to opt-in to your SMS marketing messages

Callout Settings

Use these settings to edit the callout message that appears above the widget’s closed state in your storefront.

  1. Callout Message
    1. This is the text that will be displayed in the callout message
    2. Use this to prompt customers to message your store with any questions they might have about your product or service
  2. Show Callout Message automatically after
    1. This is the amount of time to wait before displaying the call out message
    2. Use this to time the display of your callout message
  3. Callout Image
    1. This image is located to the left of the callout message
    2. Use this to add a rep’s avatar image, your logo, or anything else you desire

Widget Color Settings

This setting is used to update the color of your widget. Updating this color applies to:

  1. The widget button in the corner of your storefront’s page
  2. The banner
  3. The message text bubble
  4. The send button

Manage Tags Settings

Use this setting to manage the tags that are added to messages sent in from the TextChat widget. If a tag is added to the tags list in this section an additional field will be added to the button of the list of fields titled “Question Type”. When a tag is selected by a customer the conversation will be tagged accordingly and can be used to manage how messages are addressed. Multiple tags may be selected by the customer.

Step 2: Installation

Installation Settings

TextChat is added to a web page via the Patch Pixel, which can be automatically installed to a Shopify site automatically by enabling the Patch "App embed" in your Shopify Theme Settings.

To install the TextChat widget:

  1. Click the VIEW IN CURRENT THEM EDITOR button
  2. View the widget in the theme editor preview
  3. Click the save button from the theme editor
  4. The widget will not be available on your storefront

Manual Installation

See this related article: https://help.citygro.com/hc/en-us/articles/5372272281111-How-To-Add-the-Script-Tag-to-the-Shopify-Theme-Code

Supported Shopify Templates

All Shopify templates are supported.

How to add, remove, and reorder app blocks

Add

Automatically Adding the Pixel

To automatically add the Pixel to your store:

  1. Click the ‘VIEW IN CURRENT THEME EDITOR” Button from one of 3 places
    1. Pixel Page
    2. Loyalty Cash Page -> Step 2: Installation
    3. TextChat Page -> Step 2: Installation
  2. View the widgets in your current theme editor
  3. Save the Pixel to your store
    1. The pixel will not be added to your store until you click the save button.

Manually Adding the Pixel

See this related article: https://help.citygro.com/hc/en-us/articles/5372272281111-How-To-Add-the-Script-Tag-to-the-Shopify-Theme-Code

Remove

To remove the Pixel from your store and therefore all elements utilizing the Pixel (both widgets):

  1. Click the VIEW IN CURRENT THEME EDITOR button
  2. Find the Pixel in your list of App embeds
  3. Toggle the pixel off

To remove only the Loyalty Cash widget:

Navigate to the Loyalty Cash page

  1. Find the green enabled switch button in the top right corner
  2. Click the enabled button
  3. When the enabled button is clicked it will turn grey and remove the widget from your store front Note: Changes may take up to 1 hour to reflect on your storefront

To remove only the TextChat widget:

  1. Navigate to the TextChat page
  2. Find the green enabled switch button in the top right corner
  3. Click the enabled button
  4. When the enabled button is clicked it will turn grey and remove the widget from your store front Note: Changes may take up to 1 hour to reflect on your storefront

Reorder

Widgets can be ordered either left or right on the page.

Reorder the Loyalty Cash Widget

To reorder the Loyalty Cash widget use the switch button in the Widget Styling section’s Website Placement option.

Reorder the TextChat Widget

To reorder the TextChat widget use the switch at the top right corner of the preview section.

 

How to activate and deactivate app embed blocks

To activate and deactivate the Pixel from your store and therefore all elements utilizing the Pixel (both widgets):

  1. Click the VIEW IN CURRENT THEME EDITOR button
  2. Find the Pixel in your list of App embeds
  3. Toggle the pixel off

To activate and deactivate only the Loyalty Cash widget:

  1. Navigate to the Loyalty Cash page
  2. Find the green enabled switch button in the top right corner
  3. Click the enabled button
  4. When the enabled button is clicked it will turn grey and remove the widget from your store front Note: Changes may take up to 1 hour to reflect on your storefront

To activate and deactivate only the TextChat widget:

  1. Navigate to the TextChat page
  2. Find the green enabled switch button in the top right corner
  3. Click the enabled button
  4. When the enabled button is clicked it will turn grey and remove the widget from your store front Note: Changes may take up to 1 hour to reflect on your storefront

 

 

Related articles

Comments

0 comments

Please sign in to leave a comment.