Email Field – WC Fields Factory

Product Field

Insert a email field (input[type=email]) on the product page.

Option Description
Placeholder Placeholder attribute’s value for this email field.
Default Value Default value for this email field – (This value will be used incase If user hadn’t given any).
Required Make this email field mandatory – user cannot perform Add To Cart operation without filling this email field
Message Message that has to be displayed when validation failed for this email field (When the Required Option is Set).
Visibility Whether this email field’s value (Given by the user) has to be displayed on the Cart & Check Page.
Note: Regardless of this option this fields value will be added as Order Meta (Unless you configured not so).
Order Item Meta Whether to add this field’s value (Given by the user) as Order Item Meta.
Logged in Users Only Make this field available only for the Registered Users only (They must have to be logged in).
Target Roles Make this field available only for the users that have the selected roles. Available to all, if you haven’t selected any
Editable Make this field’s value editable on Cart Page – (incase If user has gave a wrong value, he can correct it on the cart page itself, no need to go back to product page).
Note: this is only for the Cart page not for the Checkout Page.
Cloneable Exclude this field from cloning (Works only if Cloning option is enabled from the Settings Page).
Field Class Use this option to add a custom CSS class to this field for your own styling purpose.
Product Field Raw Output
<table class="wccpf_fields_table">
	<tbody>
		<tr>
			<!-- Label section starts here -->
			<td class="wccpf_label">
				<label for="test_product_email">Test Email Field</label>
			</td>
			<!-- Label section ends here -->
			
			<!-- Field section starts here -->
			<td class="wccpf_value">
				<!-- Actual field -->
				<input type="email" class="wccpf-field" name="test_product_email" value="" placeholder="" wccpf-type="email" wccpf-pattern="email" wccpf-mandatory="yes" data-cloneable="yes" />
				<!-- Validation message -->
				<span class="wccpf-validation-message">Test text validation error message</span>
			</td>
			<!-- Field section ends here -->
		</tr>
	</tbody>
</table>

Admin Field

All the above options available for the Admin Field as well, along with those there are some specific options related to only Admin Fields.

Option Description
Show on Product Page Show this field on Front end Product page as well.
Read Only Whether to show this field as Read Only Field (applicable only on Front End Product Page).
Value or Field Show the value that is entered on this Admin Field instead as the Field itself. Whatever the value, Store Admin set for this field on the back end will be displayed on the Front end Product Page.
Tips Whether to show the tips icon in the back end.
Description Tooltip message, when admin user click on the Tips Icon.
Admin Field Raw Output (on Product Page)
<p class="form-field test_admin_email_field">
	<!-- Admin field Label -->
	<label for="test_admin_email">Test Admin Email</label>
	<!-- Actual admin field -->
	<input type="email" class="wccaf-field" name="test_admin_email" value="" placeholder="" maxlength="" wccaf-type="email" wccaf-pattern="email" wccaf-mandatory="no">
	<!-- Validation message -->
	<span class="wccaf-validation-message">Test admin email vallidation error message</span>
</p>
Admin Field Raw Output (on Product Category Create Page)
<div class="form-field">
	<!-- Admin field Label -->
	<label for="test_admin_email">Test Admin Text</label>
	<!-- Actual admin field -->
	<input type="email" class="wccaf-field" name="test_admin_email" value="" placeholder="" maxlength="" wccaf-type="email" wccaf-pattern="email" wccaf-mandatory="no">
	<!-- Validation message -->
	<span class="wccaf-validation-message">Test admin text vallidation error message</span>
</div>
Admin Field Raw Output ( on Product Category Edit Page )
<tr class="form-field">
	<!-- Admin Edit Category field's label starts here -->
	<th scope="row" valign="top">
		<label for="test_admin_email">Test Admin Email</label>
	</th>
	<!-- Admin Edit Category field's label ends here -->
	
	<!-- Admin Edit Category actual field starts here -->
	<td>
		<input type="email" class="wccaf-field" name="test_admin_email" value="" placeholder="" maxlength="" wccaf-type="email" wccaf-pattern="email" wccaf-mandatory="no">
		<span class="wccaf-validation-message"></span>
	</td>
	<!-- Admin Edit Category actual field ends here -->
</tr>

Leave a Reply

Your email address will not be published.