Creating a new profile is a simple process that allows you to establish pre-orders in your online store.

1. Create a New Profile

After installing this app, please open the Stockify app, there are two ways to create a new Profile.

1.1. Add a New Profile from the App dashboard

 In the App dashboard, click the New Profile button.

1.2. Add a New Profile from the Pre-order list page

Click the New Profile button in the top right corner of the Pre-order list page.

Add Products popup is displayed, you just need to select the products/variants and click the Add button to add the products you want to your profile.

2. Edit Profile

Group products/variants into profiles to configure pre-order settings. Settings are previewed directly in the right sidebar. To edit a profile, you need to follow 5 steps:

2.1. Products

Display list of products/variants, profile name, status. 

- Product: You can add/remove products/variants in your profile. 

- Profile name: Change the name of the profile.

- Status: There are two statuses for the profile Active and Inactive. By default, the new profile will have Inactive status. To display the profile on the live page, you make sure the status is Active. 

2.2. General

General settings for Pre-order profile

* Pre-order

- Start date: Pre-order will open at this time

- End date: Pre-order will close at this time

- Mode: Apply pre-order settings for selected types of products, you can choose Enable for all products or Enable for out-of-stock products only.

- Limit: Setting a limit on the number of items that can be purchased. If this limit is reached before the end date (if set), the pre-order will no longer be available.

- Continue selling when out of stock: Check/uncheck the "Continue selling when out of stock" checkbox for all out-of-stock products/variants in this profile.

- Only sell this product as a purchase options: Check/Uncheck the "Only sell this product as a subscription" checkbox for applied products in this profile and hide/show the default "One-time purchase" option respectively. You have to select a purchase option to proceed. USE WITH CAUTION! since a product can have both out-of-stock and in-stock variants.

- Info message: Enter an extra note for your pre-order. Supported variables: {{start_date}}, {{end_date}}, {{items_sold}}, {{limit}}.

* Coming Soon:

You can choose Show/Disable "Coming Soon" to replace the default buttons.

Set the date for the product to display "Coming Soon" indicators. Leave this field blank if you want the indicators to show from now until the pre-order start date.

2.3. Purchase options

Add purchase options for profiles. 

- Payment type: Each profile will allow payment in 2 ways, full payment or partial payment in advance.

- Title: Enter title for payment options

- Description: Enter description for payment options

- Discount: Enter a number to get how much a % or $ discount

- End date: This option will be available until the specified date. Leave this field blank to keep it available throughout the entire pre-order period.

- Shipping: Choose the time shipping for the order

- Prepaid: Enter a number to get how much a % or $ prepaid

- Collect remaining balance: Choose time collect remaining balance

2.4. Roadmap

Create a roadmap for pre-orders. Use the installed phase and add some custom phases to create a roadmap. You can design a roadmap to display according to your wishes.

- Presets: Select a preset in the list of presets. Then click the Manage link to customize the preset.

Edit Roadmap popup is displayed, you can customize options to set up specifically for a profile. Follow instructions in part Roadmap (Timeline) at the following link.

- Preview: Show roadmap designed

- Stages: Each stage has options to config

+ Title: Enter Title for the stage

+ Short description: Short description for stage, show below title

+ Icon: Choose an Icon for the stage

+ Description: Enter the description for the stage, and it will show when you hover this stage.

+ Active when: The stage will be active at this time.

+ Additional infomation: You can add icons and descriptions here

You can use {{start_date}}, {{end_date}}, {{items_sold}} variables on any text field.

In addition, You can add another stage and drag/drop between stages.

2.5. Design

Some display settings for buttons, countdown, price, purchase options, or information.

2.5.1. Pre-order button/ Coming soon button:

- Presets: Select the button to design, and click Manage to customize details for the button. Follow the instructions in the part Button at the following link.

- Typography: Determines how text is displayed on the button, affecting readability and aesthetics.

- Icon: Adding an icon can enhance usability and visual appeal by reinforcing the button’s purpose.

- Custom css: Add your's css code to customize button 

 2.5.2. Purchase options

- Preset: Select the purchase option to design, and click Manage to customize details for the purchase option. Follow the instructions in part Purchase option at the following link.

 2.5.3. Countdown

- Presets: Select countdown to design, and click Manage to customize details for the countdown. Follow the instructions in part Countdown at the following link.

- Alignment: There are three options Left/Center/Right to show countdown alignment.

 2.5.4. Price

- Label typography: Customize the appearance of the label, e.g: font family, font size or font weight ...

- Label color: Choose color for the label

- Price typography: Customize the appearance of the price , e.g: font family, font size or font weight ...

- Price color: Choose color for the product price

- Compare price color: Choose color for the product compare price

 2.5.5. Price badge

- Typography: Customizable the appearance of badge text. It involves various properties: including Weight, Font size, Line height, Text Transform, Text style, Text decoration

- Border: Customize properties such as Border width, Border style, Border color, Border radius...

- Text color: Choose a color of the text

- Background color: Choose a background color for the text

 2.5.6. Info message

- Typography: Customizable the appearance of badge text. It involves various properties: including Weight, Font size, Line height, Text Transform, Text style, Text decoration

- Border: Customize properties such as Border width, Border style, Border color, Border radius...

- Padding: Adds space inside the element, increasing its size by pushing its content inward.

- Margin: Adds space outside the element, creating distance between it and other elements without altering its size.

- Text color: Choose a color for the text

- Background color: Choose a background color for the text