# Multiple Engraving Initials

This page shows you how to let shoppers choose how many initials they want engraved, and then automatically show the right number of text fields based on their selection.

For example, if a shopper selects "2 letters," two text fields appear for them to fill in. If they select "3 letters," three fields appear. If they select "1 letter," only one field shows.

This setup uses Conditional Logic. If you haven't read that guide yet, it's worth a quick look before you start: [Conditional Logic](https://shoppad.gitbook.io/infinite-options/conditional-logic/conditional-logic)

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-5c0a61d462e4179964263611655b84908620cfec%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e61c75a57d2d46d4108375file-tbxysy7zg9.png?alt=media)

### What we're building

A shopper selects how many initials they want from a dropdown. Based on their choice, the right number of text fields appear, one for each initial. Each text field is limited to one character so shoppers can only enter a single letter.

Here's how it works:

* If they select 1 letter, the 1st Initial field appears
* If they select 2 letters, the 1st and 2nd Initial fields appear
* If they select 3 letters, all three fields appear

You'll build one dropdown and three text fields, all inside the same Option Set. Then you'll connect them using Conditional Logic.

***

### Before you start

All fields in this setup must be inside the same Option Set. The dropdown and the text fields all need to live in the same group for Conditional Logic to work between them.

This setup also uses a different operator than the standard Contains. Here you'll use Greater Than, which lets you show fields based on a number rather than a specific word. We'll explain exactly how to set it up in each step.

### Step 1: Create your Option Set and add the dropdown field

Open your Infinite Options dashboard and create a new Option Set. Assign it to the product where you want to offer engraving.

Inside the Option Set, create your first option field and set it up like this:

* **Label:** Number of Letters
* **Input Type:** Drop-Down Menu
* **Option Values:** 1, 2, 3

This is the field the shopper will use to choose how many initials they want. Their selection here controls which text fields appear below it.

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-fd720213e1c3e0d6ac3c0c4b4670a87689e5fe63%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e5e3f79935550bd599fb99file-wseguvynhs.png?alt=media)

### Step 2: Create the 1st Initial text field

Click Add Another Custom Field to add a second option field inside the same Option Set. Set it up like this:

* **Label:** 1st Initial
* **Input Type:** Text

Then click Show Advanced Options at the bottom of this field. This is where you'll set two things:

**Character Limit:** Set this to 1. This stops shoppers from typing more than one letter into the field.

**Placeholder Text:** Add something helpful like "Enter your first initial" so shoppers know what to do.

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-e4edceca917cc50ca3b7a17ec95ae96f416935e3%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e61000c43e86258f6f95e4file-tyvqp7vwxl.png?alt=media)

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-a3964ded7bb5943a1eca240ac48d97bca7d1943a%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e6efbf9935550bd599ff3ffile-diyflp0tle.png?alt=media)

### Step 3: Add a conditional rule to the 1st Initial field

Still in the Show Advanced Options section, click Create a new conditional rule.

This field should appear any time a shopper selects 1, 2, or 3 letters. In other words, it should show whenever the number of letters is more than 0. Set up the rule like this:

* **Field Name:** Number of Letters
* **Operator:** Greater Than
* **Value:** 0

This tells Infinite Options: show the 1st Initial field whenever the shopper selects any number greater than 0, which covers all three options.

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-256339bc7193362623e46023e7a5bf1d3e32b64f%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e6f15e5cad390a94c045d2file-bp1ghgab46.png?alt=media)

### Step 4: Create the 2nd Initial text field

Click Add Another Custom Field to add a third option field inside the same Option Set. Set it up the same way as the 1st Initial field:

* **Label:** 2nd Initial
* **Input Type:** Text
* **Character Limit:** 1
* **Placeholder Text:** Enter your second initial

Then click Create a new conditional rule and set it up like this:

* **Field Name:** Number of Letters
* **Operator:** Greater Than
* **Value:** 1

This means the 2nd Initial field only appears when a shopper selects 2 or 3 letters, not when they select 1.

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-9907f203533d83e967a271d9c3699d7d433f0edf%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e6f5e75cad390a94c045e9file-kcdkdkldyp.png?alt=media)

### Step 5: Create the 3rd Initial text field

Click Add Another Custom Field to add a fourth option field inside the same Option Set. Set it up the same way:

* **Label:** 3rd Initial
* **Input Type:** Text
* **Character Limit:** 1
* **Placeholder Text:** Enter your third initial

Then click Create a new conditional rule and set it up like this:

* **Field Name:** Number of Letters
* **Operator:** Greater Than
* **Value:** 2

This means the 3rd Initial field only appears when a shopper selects 3 letters.

![](https://24152052-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglwgaFVh2VmGBjtIbnDb%2Fuploads%2Fgit-blob-01cf782bf078e37efd64f99dd49747ffda61da17%2Fhelpscoutnetdocsassets555e25e4e4b027e1978e1c9aimages67e6f608a44cc41eebaa71c1file-2nehl7juwl.png?alt=media)

### Step 6: Save and test

Click Save Changes at the top of the Option Sets page.

Go to your product page and test every path:

* Select 1 and confirm only the 1st Initial field appears
* Select 2 and confirm the 1st and 2nd Initial fields appear
* Select 3 and confirm all three fields appear
* Try typing more than one character in a field and confirm it stops at one

If all of that works the way you expected, you're done.

### Something not working?

**The text fields aren't appearing when I select a number.** Check that all four fields are inside the same Option Set. Also confirm that each conditional rule is using Greater Than as the operator, not Contains. Contains won't work here because the values are numbers, not words.

**The wrong number of fields is appearing.** Go back and check the value in each conditional rule. The 1st Initial rule should have 0, the 2nd Initial rule should have 1, and the 3rd Initial rule should have 2. If any of those are off by one the wrong fields will show.

**A shopper can type more than one character into a field.** Go back into Show Advanced Options on that field and confirm the Character Limit is set to 1.

**Everything looks right in the app but it's not working on the product page.** Make sure the Option Set is assigned to the correct product and that you saved your changes. If it's still not working after that, reach out to support and we'll walk you through it together.