WooCommerce Personalized Product Options Manager Inputs Guide
PPOM add custom field on product page with 19 different input types. Nice and simple UI and bunch of options against each field give admin and users to personalize any product before checkout. Following details are provided for each input fields.
Creating new fields in PPOM.
- We assumed that you installed plugin and access it via WooCommerce -> PPOM Settings menu
- Before adding new input there are Basic settings area on top.
- Following FAQs will help you understand more about this.
Meta group name?
It’s just to label your fields group
Control price display on product page?
Do not show price table: From version 10 prices are shown under extra fields just before Add to cart button. If you don’t want to show this table just use following option:
We recommend to use following two options when you use options with price and client will love to see what’s actual price of product after adding options.
Show only Option’s Sum: As name suggest, only option total will be shown to client, best if you have long list of options.
Show Each Option’s Price: It will show price against each option, recommended when you have less options.
Input CSS?
If you are designer, you can add your own CSS. See following some help about classes.
input wrapper class: Each input is wrapped inside a div with class ppom-input-{field_data_name}
Where {field_data_name} is field’s data name property
Apply for Categories?
It will show these fields only selected categories. Add categories slug per line, leave blank for default.
Aviary API Key (Photo Editing)?
This is special/paid add-on to edit photos with Aviary. Read more about Aviary Add-on here
PPOM PRO(WooCommerce Personalized Product Options Manager) Includes Following Input Types
General Fields
1- Text Input
Text input displays an input box allow client to personalize Product with text like ‘Name on Mug’ etc.
[vcex_bullets]
- Title & Description
- Required
- Error Message
- Min. Length
- Max. Length
- Default Value
- Input Masking
- 9: numeric [ 33-213334-9 –> 99-999999-9]
- a: alphabetical [ ID-card –> aa-aaaa]
- *: alphanumeric [ ID-213334-9 –> aa-999999-9]
[/vcex_bullets]
2- Email Input
Text input displays an email input box allow client to personalize Product with e-mail address.
3- Textarea Input
Just like Text input displays an a larger box allow client to personalize Product with text.
[vcex_bullets]
- Title & Description
- Required
- Error Message
- Max. Length
- Post ID
- This will pull content of post and set as default contents
- Rich Editor (Off/On)
- Rows
Note: Width (columns) are manipulated with field width[/vcex_bullets]
4- Number Input
Number input displays regular Number input box allow client to personalize Product with digits only like for Phones, IDs etc.
[vcex_bullets]
- Title & Description
- Required
- Error Message
- Max. Value
- Min. Value
- Steps
- Default Value
[/vcex_bullets]
5- Date Input
Date input displays regular Date using input box allow client to personalize Product with Date e.g Date of birth etc. It use HTM5 datepicker however you can enable jQuery UI Datepicker from settings.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Use jQuery Datepicker
- Date formats
- Disable Past Dates
- Disable Weekends
- Year Range (1950: 2017)
- c-10:c+10 = currentYear – 10 and currentYear + 10
- Datepicker year range options
- Default Value
[/vcex_bullets]
6- Radio Options Input
Radio input allow user to select single option set by admin, recommended when you have less options. Prices can also be set against each option.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Add Options
- Option and Price (optional)
- Price can also be given in %
- Fixed Fee and Fixed Fee Taxable
- This will add price to cart (one time) not multiply with quantities. Used when need to charge your client one time regardless quantities ordered.
- Set Default Option
[/vcex_bullets]
7- Select Options Input
Select input allow user to select single option set by admin in Dropdown, recommended when you have many options. Prices can also be set against each option.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Add Options
- Option and Price (optional)
- Price can also be given in %
- Fixed Fee and Fixed Fee Taxable
- This will add price to cart (one time) not multiply with quantities. Used when need to charge your client one time regardless quantities ordered.
- Set Default Option
- First Option
- like: Select your option
[/vcex_bullets]
8- Checkbox Options Input
Checkbox input allow user to select multiple option set by admin. Prices can also be set against each option.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Add Options
- Option and Price (optional)
- Price can also be given in %
- Fixed Fee and Fixed Fee Taxable
- This will add price to cart (one time) not multiply with quantities. Used when need to charge your client one time regardless quantities ordered.
- Checked Options
- Min. Checked Options
- Restrict client to at least select Min checked options
- Max Checked Options
- Restrict client to not to check more than Max. options.
[/vcex_bullets]
9- Image Option Input
Image input are just like Radio/Checkbox but images can be uploaded against each option. Price can also be set against each image option.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Select Image
- Select image from Media Library
- Title, Price and URL to link image
- Fixed Fee and Fixed Fee Taxable
- This will add price to cart (one time) not multiply with quantities. Used when need to charge your client one time regardless quantities ordered.
- Multiple Selection
- More than one image can be selected
- Selected Image
- Enable Legacy View
- Show old view if needed for old versions.
[/vcex_bullets]
10- Palettes Option Input
Palettes input is just like Radio/Checkbox but different colors can be added as option. Price can also be set against each palette color.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Add Colors
- Set color cods (e.g: #ffcccc)
- Price also can be in %
- Fixed Fee and Fixed Fee Taxable
- This will add price to cart (one time) not multiply with quantities. Used when need to charge your client one time regardless quantities ordered.
- Multiple Selection
- More than one image can be selected
- Selected Color
- Color Width
- It use to render color palette box width
- Color Height
- It use to render color palette box height
- Show as Circle?
- Make a nice circle like in screenshot below
[/vcex_bullets]
11- Timezone Input
Timezone input is a special form of Select Input but it has predefined list of all Time-zones. Different Time-zones can also be filtered with options.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Timezone All
- AFRICA
- AMERICA
- ANTARCTICA
- ASIA
- ATLANTIC
- AUSTRALIA
- EUROPE
- INDIAN
- PACIFIC
[/vcex_bullets]
12- File Upload
File Input allow clients to upload files from their computer or mobile devices. Admin can set any file type and sizes. Images can be edited using awesome Aviary add-on plugin. See Feature for more detail.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- File Cost
- Add one time cost in cart
- Fee Taxable
- Button Label & Class
- Files Allowed
- Number of file allowed
- File Types
- jpg,png,zip etc
- File Size (in mb)
- Enable Photo Editing
- It works when Aviary add-on is purchased and installed.
[/vcex_bullets]
13- Image Cropper
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Different Size
- Prices for each Size
- File Cost
- Add one time cost in cart
- Fee Taxable
- Button Label & Class
- Files Allowed
- Number of file allowed
- Images Types
- jpg,png,gif etc
- File Size (in mb)
- CROPPIE SETTINGS
[/vcex_bullets]
14- Audio Video Input
Audio/Video input allow clients to select Audio/Video options uploaded by Admin in media library. It’s similar to Image type input but with different media type. Price can also be set against each option.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Select Audio/Video
- Select media from WP Library
- Set price optionally
- Multiple Selection
[/vcex_bullets]
15- Variation Quantities (Options Quantities)
Variation Quantities allow client to order different quantities against different options. Read more about variation quantities here.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Add Options
- Option name
- Price
- Min Qty.
- Max Qty
- Include Product Price?
- This will also add product base price along options prices
- Horizontal Layout
- Will show in horizontal.
[/vcex_bullets]
16- Price Matrix
Price Matrix allow admin to offer client Less Price on Bulk/More quantities. More quantities will decrease the price set in matrix. It can be used as discount alternatively. More detail about Bulk Price/Discount
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Apply as discount
- It apply discount instead apply bulk discount. Bulk Price/Discount WooCommerce PPOM
- Discount On
- Apply discount only for Base or Option+Base if other options are used.
- Price Matrix
- Option: 1-10 (for quantities)
- Price 5 or 5%
- Quantity step (increase quantity by given step)
- Enable Quantity Slider
- Show Price per Unit?
- It calculates price per unit and show along Total price.
[/vcex_bullets]
17- Color Picker Input
Color Picker allow client to select color. Palette colors can also be defined in settings.
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Default Color
- Palettes
- Palettes Width
[/vcex_bullets]
18- Date Range Picker
[vcex_bullets font_size=”d:16px|pl:12px|pp:12px”]
- Title & Description
- Required
- Error Message
- Default Date
- Show Timepicker
- Timepicker increment
- Timepicker 24 hours
- Show Timepicker seconds
- Open Style (Down/Up)
- Show Week Numbers
- Start Date (must be set)
- End Date (must be set)
- Min. Date
- Max . Date
- Disable past date
- Disable Weekends
[/vcex_bullets]
19- HTML Content
It’s not an input, just to add some contents/text or HTML.
We have built this demo with Nice Looking OYE Theme.
