# 1-Step Order

## General Settings

### Element Name/Title

Here you will see the default name/title of the Edit option you are working on. You can decide to leave at that or rename it.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-d312482d6ec72aaa066d2991d68db5f2e3bcae5f%2F1step%20order%20form%20-%20Title.png?alt=media)

### Text Align

You can move your text in different positions as you deem fit, you can position it to the Left, Center, Right, or as Justified.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-ecd517e4c952f9e24287df07c9a0ae0327ac6504%2F1step%20order%20form%20-%20Align.png?alt=media)

### Button Color

If you want to change the button color of your order form, you can do that by clicking on the color you want to change it to.

If you didn't find your color, you can also add custom colors if you have the color code of the exact color you are going for, just type it in the space provided and click "add color".

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-e93b05abb71184df5341c06eb48dfa25a009b845%2F1step%20order%20form%20-%20Button%20Color.png?alt=media)

### Button Text Color

If you want to change the button text color of your order form, you can do that by clicking on the color you want to change it to.

If you didn't find your color, you can also add custom colors if you have the color code of the exact color you are going for, just type it in the space provided and click "add color".

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-46490e3d68c9665ff038b440ba0f0d7f2880b7b0%2F1step%20order%20form%20-%20Toggle%20phone%20number.png?alt=media)

### Button Size

You can decide the size of the button from extra small to extra large.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-98e2f196d4157cc6d78690526caf13478531bc97%2F1step%20order%20form%20-%20Button%20size.png?alt=media)

### Button Style

You can style the button color by selecting the style you prefer.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-eeec00338659688586953d0f0bd99e882a6fcc70%2F1step%20order%20form%20-%20Button%20style.png?alt=media)

### Input Background Color

If you want to input background color to your order form, you can do that by clicking on the color you want to change it to.

If you didn't find your color, you can also add custom colors if you have the color code of the exact color you are going for, just type it in the space provided and click "add color".

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-78bdeee043f1523735696c6ee809be7f7ca57c0f%2F1step%20order%20form%20-%20Input%20BG%20Color.png?alt=media)

### Form Corner

You can adjust the degree of the curve for the edges of the form fields.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-fca58fd55d0871d8302e38fd51c39318133cee57%2F1step%20order%20form%20-%20Form%20corners.png?alt=media)

### Typography Type

Here you can edit the font of your text/content.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-cf46076c25797a502754626946667732d592a2b5%2F1step%20order%20form%20-%20Typography%20Type.png?alt=media)

### Button Action

#### Sale Actions

You can select either the "Open the popup" or the "go-to website URL"

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-f063f99094731be7cc48b4b30e5c3115d5d4bccd%2F1step%20order%20form%20-%20Button%20Action.png?alt=media)

* **Website**\
  When you select "Go to website URL" in the "Image Action" icon, it will require you to select which website page you will be settings.
* **Open In New Tab**\
  If you want the website to direct visitors to a new tab when they perform an action, simply toggle it on.

## Advanced Settings

#### Headline

Here you will see the default headline name and you can decide to leave at that or rename it.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-b6e7660bb5ddd6ae6d063034428e6344eb26552e%2F1step%20order%20form%20-%20Headline.png?alt=media)

### Sub-Headline

Same as the Sub-headline name, you can decide to change it or leave it as it is.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-a533a2dcd6e475016fe5190e15caef2cefc4ea5c%2F1step%20order%20form%20-%20subHeadline.png?alt=media)

### Toggle Company Name

You can decide to show a form field for the "Company name" or you can hide it.

* **Company Name**\
  You can edit the description in the company name form field here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-a814b6e67ec4e33908e08e07a2fd50e6295e4020%2F1step%20order%20form%20-%20company%20name.png?alt=media)

### Full Name

You can edit the description in the full name form field here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-66da141bd8ca9d79bb3dbccd487dc86061598b96%2F1step%20order%20form%20-%20Full%20name.png?alt=media)

### Email Address

You can edit the description in the email address form field here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-ca3ec1cfbe48627bc29a027eeeb1d5440f6d86b9%2F1step%20order%20form%20-%20Email%20Address.png?alt=media)

### Toggle Phone

You can decide to show a form field for the Phone number or you can hide it.

* **Phone Number**\
  You can edit the description in the Phone number form field here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-46490e3d68c9665ff038b440ba0f0d7f2880b7b0%2F1step%20order%20form%20-%20Toggle%20phone%20number.png?alt=media)

### Enable Country Picker

You can toggle on or off the country picker here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-89c3abf522069ce6981b6830aedb589343a62174%2F1step%20order%20form%20-%20Enable%20country%20picker.png?alt=media)

### Toggle Shipping

You can decide to show a form field for the Shipping info or you can hide it.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-ccff6b522062946e8ca5aef70e671c1b0cdb6759%2F1step%20order%20form%20-%20Shipping.png?alt=media)

1. **Shipping Headline**

   Here you will see the default shipping headline name and you can decide to leave at that or rename it.\\

2. **Address**

   You can edit the description in the Address form field here.\\

3. **City**

   You can edit the description in the City form field here.\\

4. **State/Province**

   You can edit the description in the State/Province form field here.\\

5. **Zip/Postal Code**

   You can edit the description in the Zip/postal code form field here.\\

6. **Country**\
   You can input your country here.

### Bin Text

This is the button you will click on to move to the next form. you can edit the text.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-568baa5e45dac02a06cc0411a1481c5827789dc3%2F1step%20order%20form%20-%20Bin%20Text.png?alt=media)

### Sub Bin Text

You can add a sub-text to the bin by inputting what you would like to name it.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-59fa861405f239f8140eb4d2deb43c752892d8f6%2F1step%20order%20form%20-%20Bin%20SubText.png?alt=media)

### Button Footer Text

You can add any other information you will your visitor/client to be aware of here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-814f700dabdbad97ac8655038187a52c13f7a3fc%2F1step%20order%20form%20-%20Button%20Footer%20text.png?alt=media)

### Order Bump Options

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-081fff0722046dec365eec39c1b4ba512df08db7%2F1step%20order%20form%20-%20Order%20bunp.png?alt=media)

1. **Enable Order bumps**

   When you toggle on the border bumps, it enables you to order bumps.\\

2. **Select Product**

   You can select the product you will like to add here.\\

3. **Enable by default**

   "Enable by default" allows you to set the order bumps to turn on by default.

## Sticky Contact

Toggle on or off to add or remove the sticky contact

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-6aaef6fdfc32a2066e8fb15eb8cf484d935c474d%2F1step%20order%20form%20-%20Sticky%20contact.png?alt=media)

### New Contact on Every Purchase <a href="#new-contact-on-every-purchase" id="new-contact-on-every-purchase"></a>

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-8813baf0d53adbe2c61b67a7fc52a2a2d3524171%2F1step%20order%20form%20-%20New%20Contact%20every%20purchase.png?alt=media)

### Validate Disposable Email <a href="#validate-disposable-email" id="validate-disposable-email"></a>

You can validate any disposable email by toggling this on.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-ed7dbae57ed523ba3e920878acd98c5959df75ea%2F1step%20order%20form%20-%20Validate%20disposable.png?alt=media)

### Visibility

You can decide if you want this particular Edit option to be visible on only mobile devices, desktops, or both by clicking on it to highlight the icon.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-1b8947ff2d92a269ebf360a6610f97597b00c2f2%2F1step%20order%20form%20-%20Validality.png?alt=media)

### Custom Class

Input your custom class here.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-3ff1a7ad90acb8917781b9d4f5df557ccb745ef7%2F1step%20order%20form%20-%20Custom%20Class.png?alt=media)

### CSS Selector

If you need to copy the Custom CSS, just click on the "Copy" icon on the right side of the reference code.

![](https://3652255517-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FSpDxRsrRdNpxcuWtIMiA%2Fuploads%2Fgit-blob-c3cba618edd7d8f629aaf44c233ef4caacb3b416%2F1step%20order%20form%20-%20CSS%20Selector.png?alt=media)
