1. Home
  2. Knowledge Base
  3. Text Preview for Add-Ons Ultimate
  4. Getting Started with Text Preview
  5. Enabling Text Preview
  1. Home
  2. Knowledge Base
  3. Text Preview for Add-Ons Ultimate
  4. Enabling Text Preview

Enabling Text Preview

The Text Preview extension for Add-Ons Ultimate allows you to display your user’s inputted text over the main product image.

In the example below, you can see that there’s a text field on the right where the user has entered some text. This text is replicated over the product image on the left.

text preview demo product
Example product page showing text preview

Text Preview settings

Text Preview has a specific field type. So your first step is to create a new add-ons field and choose ‘Text Preview’ as the field type.

The Text Preview field type has all the parameters that a standard text field has, including minimum and maximum number of characters, free characters, etc.

It also has a number of additional features, shown below:

Text Preview settings
  • Text center – X axis
    This setting determines how far left or right the centre of the text will sit relative to the main product image. If you enter 0 here, the centre of the text will appear on the left side of the image; 50 will position the text exactly in the horizontal centre of the image.
  • Text center – Y axis
    This setting determines the text’s vertical position relative to the main product image. A value of 0 will position the text at the top of the image; 50 will be the vertical middle; and 100 will be the bottom of the image
  • Width
    This determines how wide the text field is relative to the image size – 100 would mean the text field was the same width as the main image
  • Default text colour
    You can set the default preview text colour here
  • Default font size
    Use this to set the preview text’s default font size in pixels
  • Default Google font
    Choose the Google font to use for the preview text
  • Customers can change the colour?
    If you select this option, the user will be able to use a colour picker to set the preview text colour
  • Customers can change the font size?
    Enable this option to allow the user to change the font size of the preview text
  • Customers can change the font family?
    Enable this option to allow the user to choose the font to use in the preview text
  • Layer position
    By default, the plugin will display the text preview on all product images in the product image gallery. However, you can limit where it’s displayed using this setting. Choose from ‘Default’, ‘First Frame’, ‘Last Frame’ or ‘Specific Frame #’
  • Frame #
    If you choose ‘Specific Frame #’ in the ‘Layer position’ setting, then you can specify which image you want the preview to display on here
  • z-index
    Optionally set a z-index value for the text preview layer here

Was this article helpful?

Related Articles