Displays a search box or a dropdown for customers to select a font within all Google fonts or within just specific fonts selected by the admin.
Not yet, the Font Picker can be associated with a text field, then customers can enter the text to the text box/area, select a font, and then see the their entered text in the selected font.
Option Settings: #
Option name: Give your Font Picker option a unique internal name, which will also be visible to your customers. Ensure that different options in the option set have distinct names.
Option label: Add a label that is visible to your customers, such as “Select a Font”, “Engraving Font”, etc. Option labels can be the same or different for various options in the option set.
Required field: Make the Font Picker mandatory if needed, ensuring users select a font before adding the product to their cart.
Enable font preview in text box: When enabled, you can associate a text field (Text box or Text area) with the Font Picker. Customers can enter their text, select a font, and see the entered text displayed in the chosen font. Please note that you must create the text field before associating it with the Font Picker, and each text field can be linked to only one Font Picker option.
Add price: Set an extra price for font selection if it’s an additional service.
Font for selection
- All Google fonts: If you want customers to choose from all Google fonts, select this option. It will display a search bar on the storefront for customers to select their preferred fonts. Customers must enter at least 2 characters to see font suggestions.
- Specific fonts: If you want customers to select from a specific list of fonts, choose the “Specific Fonts” option. You can then pick the fonts you want to make available for selection.
- Display font swatches: If you choose “Specific Fonts” for selection, you can display fonts either in a dropdown (default) or as swatches.
- Enable search field: If you keep the default font dropdown with “Specific Fonts” for selection, you can include a search field in the dropdown to help users find fonts quickly, especially if you have many available fonts.
Column width: Adjust the width of the Font Picker search bar/dropdown from 25% to 100% as needed.
Help text: Provide additional instructions or information to assist users in selecting fonts.
Info: Create an informative tooltip that appears when users hover over a small icon, providing more context or assistance.
Placeholder: Customize the placeholder text in the font picker dropdown or search bar as needed, such as “Please select a font”.
Condition logic options: Implement conditional rules that control when the Font Picker should appear based on user selections or other conditions. For instance, you can create a checkbox labeled “Engraving”. The Font Picker option will then be displayed only when this checkbox is selected. It’s worth noting that if the Font Picker is the first option in your option set, setting conditional logics for it won’t be possible. To set up the condition logic for your Font Picker, follow this guide.
Need Assistance? #
If you run into any challenges while configuring your custom options, feel free to reach out to us for assistance through our convenient in-app live chat, by submitting your request via our contact form, or by sending an email to support@tigren.com. We’re here to help!
