Product Field
Url field type is not available for Product Page. Although the purpose of the URL field itself to display arbitary reference link to any external resources on the product page, but this will be used by the store admin.
Product Field Raw Output
<table class="wccpf_fields_table ">
<tbody>
<tr>
<!-- Label section starts here -->
<td class="wccpf_label">
<label for="test_admin_url_1">Test Admin Url</label>
</td>
<!-- Label section ends here -->
<td class="wccpf_value">
<!-- Actual field starts here -->
<!-- If 'Display as' option is Link -->
<a href="https://google.com" class="" target="_blank" title="Click here" data-cloneable="yes">Google</a>
<!-- If 'Display as' option is button -->
<button onclick="window.open('https://google.com', '_blank' )" title="Click here" class="" data-cloneable="yes">Google</button>
<!-- Actual field ends here -->
</td>
</tr>
</tbody>
</table>
Admin Field
| Option | Description |
|---|---|
| Tool Tip | Tool tip for this link, displayed when user hover over this link. |
| Link Name | The text part of the link, which visible to the user, which they would be click on. |
| Display as | Whether to display this url as anchor tag (default) or as a button on the front end product page. |
| Open in | When user click on this link, whether to open it on the same tab or in a new tab (default). |
| Show Label | As with any other fields this also has Label section (Left side), whether to show (default) or hide |
| Field Class | Use this option to add a custom css class to this field for your own styling purpose. |
| Tips | Whether to show the tip 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_select_field"> <!-- Label for the Select field --> <label for="test_admin_url">Test Admin Url</label> <!-- Actual field starts here --> <input type="text" name="test_admin_url" class="wccaf-field" id="test_admin_url" placeholder="http://example.com" wccaf-type="url" value="" wccaf-pattern="mandatory" wccaf-mandatory="no"> <!-- Actual field ends here --> </p>
Admin Field Raw Output (on Product Category Create Page)
<div class="form-field">
<!-- Label for the Radio Button Group -->
<label for="test_admin_color_picker">Test Admin Url</label>
<!-- Actual field starts here -->
<input type="text" name="test_admin_url" class="wccaf-field" id="test_admin_url" placeholder="http://example.com" wccaf-type="url" value="" wccaf-pattern="mandatory" wccaf-mandatory="no">
<!-- Actual field ends here -->
</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_color_picker">Test Admin Url</label>
</th>
<!-- Admin Edit Category field's label ends here -->
<td>
<!-- Actual field starts here -->
<input type="text" name="test_admin_url" class="wccaf-field" id="test_admin_url" placeholder="http://example.com" wccaf-type="url" value="" wccaf-pattern="mandatory" wccaf-mandatory="no">
<!-- Actual field ends here -->
</td>
</tr>
