Customization

Share Cart allows us to change every aspect of the Share Button and Pop-Up to match them with the look and feel of our Shopify store. We can also unleash our creativity and try out different color combinations and fonts to see which is the best for us.

Design Preview

The Design Preview section lets us see customization changes for the Share Button and Pop-Up in real-time before applying them. It also allows us to change the texts within the Button and Pop-Up. More information on this can be found in the articles for Share Button and Share Pop-Up.

Basic Colors

This section is best when we want to make quick changes to the appearance of the Share Button and Pop-Up. We can configure the following settings under this section:

• Background Color: Edit the background color of the Share Pop-Up.
• General Text Color: Edit the color of all the texts at once for Share Button and Pop-Up.
• Button Color: Edit the color of the Share Button and all the buttons of Share Pop-Up at once.
• Button Text Color: Edit the colors of all the texts within all the buttons at once.

For more information on these options, check out our article on Basic Colors.

Typography

We can use this section to make changes to the style of the Share Button and Pop-Up texts. We can configure the following settings under Typography:

• Font Family: Edit the font style of Share Button and Pop-Up texts at once.
• Button Weight: Edit the font weight of the Share Button text.
• Button Font Size: Edit the font size of the Share Button text.
• Title Weight: Edit the font weight of the Share Button and Pop-Up title text.
• Title Font Size: Edit the font size of the Share Button and Pop-Up title text.
• Footnote Weight: Edit the font weight of the footnote text of Share Pop-Up.
• Note Font Size: Edit the font size of the footnote text of Share Pop-Up.
• OR Text Weight: Edit the font weight of the OR text in the Share Pop-Up.
• OR Text Font Size: Edit the font size of the OR text in the Share Pop-Up.

Text Customization

This section allows us to customize the Copy Confirmation Text and Copy Button Text of the Share Pop-Up.

To learn about these options in-depth, read our article on Typography.

Appearance

This section comes in handy when we want to change the appearance of specific Share Button and Pop-Up elements. We can configure the following settings under this section:

• Share Button Icon: Edit the Share Button icon.
• Share Widget Position: Edit the position of the Share Widget.
• Share Button Height: Edit the height of the Share Button.
• Border Radius: Edit the border radius of the Share Button and Share Pop-Up.
• Share Title & Button Alignment: Edit the alignment of the Share Title and Share Button.

To learn more about these options, read our article on Appearance.

Advanced Colors

We can customize the colors of specific Share Button and Pop-Up elements using this section rather than changing them all at once. We have the following color customization options under Advanced Colors:

• Share Title: Edit the color of the Share Title for the Share Button.
• Share Button: Edit the color of the Share Button.
• Share Button Text: Edit the color of text within the Share Button.
• Share Icon: Edit the color of the Share Icon in the Share Button.
• Copy Button: Edit the color of the Copy Button in the Share Pop-Up.
• Copy Text: Edit the color of text within the Copy Button in the Share Pop-Up.
• Copy Icon: Edit the color of the Copy Icon in the Share Pop-Up.
• Toggle Button: Edit the color of the Toggle Button in the Share Pop-Up.
• Toggle Icon: Edit the color of the Toggle Icon in the Share Pop-Up.
• Toggle Button Active: Edit the color of the Toggle Button in the Share Pop-Up for when it is active.
• Toggle Icon Active: Edit the color of the Toggle Icon in the Share Pop-Up for when it is active.
• Modal Background: Edit the background color of the Share Pop-Up modal
• Modal Text: Edit the color of the texts on the Share Pop-Up modal.
• Close Icon: Edit the color of the close icon in the Share Pop-Up modal.
• Modal Border: Edit the border color of the Share Pop-Up modal.
• Input bar background: Edit the background color of the input bar in Share Pop-Up.
• Footnote Text Color: Edit the footnote text color in the Share Pop-Up.
• Social Icon Color: Edit the color of the social icons in the Share Pop-Up.

For more information on these options, check out our article on Advanced Colors.

Social Sharing

Using this section, we can customize content for different social sharing platforms and let our customers share those content with their cart links. We have the following customization options under Social Sharing:

• Facebook Sharing: Lets us add a hashtag for Facebook.
• Twitter Sharing: Lets us add a hashtag and text for Twitter.
• Tumblr Sharing: Lets us add a title and content for Tumblr.
• Pinterest Sharing: Lets us add a description, pin an image or upload a custom image from our device for Pinterest.
• Whatsapp Sharing: Lets us add a message for Whatsapp.
• Reddit Sharing: Lets us add a title and text for Reddit.
• Email Sharing: Lets us add a subject and body for the email.

To learn more about these options, read our Customizing Social Sharing Contents article.

Links

This section allows us to configure the link expiry settings for Share Cart. Under this section, we have the following options:

• Number of Visits: Let us enter the number of visits for the Share Cart link.
• Number of Days: Let us enter the number of days for the Share Cart link to be active.

To know more about these options, read our article on Links.

Visibility

This section allows us to configure the visibility of the Share Button. Under this section, we have the Share Button Visibility option, which lets us control who can access the Share Button on our Shopify store.

To learn more about this option, read our article on Visibility.

Share Message

This section allows us to configure a feature through which customers can enter customized messages on their carts for their friends to see when they visit the cart links. Under this section, we have the following options:

• Font Weight: Let us edit the font weight of the customized message.
• Font Size: Let us edit the font size of the customized message.
• Border Radius: Let us edit the border radius and add roundness to the Share Message widget.
• Border Width: Let us edit the border width of the Share Message widget.
• Share Message Position: Let us edit the position of the Share Message widget.
• Background Color: Let us edit the background color of the Share Message widget.
• Border Color: Let us edit the border color of the Share Message widget.
• Text Color: Let us edit the color of the customized message.
• Icon Color: Let us edit the icon color on the Share Message widget.
• Footnote Text: Let us edit the footnote text for the Share Pop-Up.

For more information on these options, check out our article on Share Message.

Manual Embedding

This section allows us to manually embed the Share Button by pasting an HTML code snippet at the desired location of our Shopify store.

To learn more about this feature, read our article on Manual Embedding.