{"id":10845,"date":"2019-07-16T12:09:32","date_gmt":"2019-07-16T12:09:32","guid":{"rendered":"https:\/\/www.mageworx.com\/blog\/?p=10845"},"modified":"2022-04-19T13:52:26","modified_gmt":"2022-04-19T13:52:26","slug":"how-to-add-a-field-to-custom-options-in-magento-2","status":"publish","type":"post","link":"https:\/\/www.mageworx.com\/blog\/how-to-add-a-field-to-custom-options-in-magento-2","title":{"rendered":"How to Add a Field to Custom Options in Magento 2?"},"content":{"rendered":"\n<!-- SEO Ultimate (http:\/\/www.seodesignsolutions.com\/wordpress-seo\/) - Code Inserter module -->\n<!-- Google Tag Manager (noscript) -->\r\n<noscript><iframe src=\"https:\/\/www.googletagmanager.com\/ns.html?id=GTM-5DTCW7B8\"\r\nheight=\"0\" width=\"0\" style=\"display:none;visibility:hidden\"><\/iframe><\/noscript>\r\n<!-- End Google Tag Manager (noscript) -->\n<!-- \/SEO Ultimate -->\n\n<span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Reading Time: <\/span> <span class=\"rt-time\"> 5<\/span> <span class=\"rt-label rt-postfix\">minutes<\/span><\/span>\n<p>You all know how convenient it is to use products\u2019 customizable options. We\u2019ve got a powerful <a aria-label=\"Advanced Product Options Suite (opens in a new tab)\" href=\"https:\/\/www.mageworx.com\/magento-2-advanced-product-options-suite.html\" target=\"_blank\" rel=\"noreferrer noopener\">Advanced Product Options Suite<\/a> that drastically expands the standard functionality of the customizable options. Custom fields are the basis of some of the extension&#8217;s functionality. These fields get added to specific option types, such as a checkbox or text area.<br><\/p>\n\n\n\n<p>In the article, I\u2019ll do my best to explain how you can add the necessary fields to the database and admin panel fast and easy. Let\u2019s have an insight.<br><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. Create a new module<\/h2>\n\n\n\n<p>First, let\u2019s create a MageWorx_Option module. We will get it all done using this module as an example.<\/p>\n\n\n\n<p>Let\u2019s create the following directory: app\/code\/MageWorx\/Option. To register a module, we will need some standard files: <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\n\\Magento\\Framework\\Component\\ComponentRegistrar::register(\n   \\Magento\\Framework\\Component\\ComponentRegistrar::MODULE,\n   'MageWorx_Option',\n   __DIR__\n);\n\n\ncomposer.json:\n{\n   \"name\": \"mageworx\/module-option\",\n   \"description\": \"N\/A\",\n   \"require\": {\n       \"magento\/module-catalog\" : \"&gt;=101.0.0 &lt;104\",\n       \"magento\/module-ui\"      : \"&gt;=100.1.0 &lt;102\"\n   },\n   \"type\": \"magento2-module\",\n   \"version\": \"1.0.0\",\n   \"license\": &#91;\n       \"OSL-3.0\",\n       \"AFL-3.0\"\n   ],\n   \"autoload\": {\n       \"files\": &#91;\n           \"registration.php\"\n       ],\n       \"psr-4\": {\n           \"MageWorx\\\\Option\\\\\": \"\"\n       }\n   }\n}\n\nmodule.xml:\n&lt;?xml version=\"1.0\"?&gt;\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:Module\/etc\/module.xsd\"&gt;\n   &lt;module name=\"MageWorx_Option\" setup_version=\"1.0.0\"&gt;\n       &lt;sequence&gt;\n           &lt;module name=\"Magento_Catalog\"\/&gt;\n           &lt;module name=\"Magento_Ui\"\/&gt;\n       &lt;\/sequence&gt;\n   &lt;\/module&gt;\n&lt;\/config&gt;\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">2. Add our new fields to the database<br><\/h2>\n\n\n\n<p>For example, we wish to highlight one of the options on the front-end somehow. Let\u2019s add a checkbox field for an option \u2018Is Special Offer\u2019 and a text field \u2018Description\u2019 for the selectable options values (dropdown, checkbox, radio button, multi-select).<br>First, we will need to add it to the database in the corresponding tables. For that, add the following file:&nbsp; app\/code\/MageWorx\/Option\/Setup\/InstallSchema.php. <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\nnamespace MageWorx\\Option\\Setup;\n\nuse Magento\\Framework\\Setup\\InstallSchemaInterface;\nuse Magento\\Framework\\Setup\\ModuleContextInterface;\nuse Magento\\Framework\\Setup\\SchemaSetupInterface;\nuse Magento\\Framework\\DB\\Ddl\\Table;\n\nclass InstallSchema implements InstallSchemaInterface\n{\n   public function install(SchemaSetupInterface $setup, ModuleContextInterface $context)\n   {\n       $setup-&gt;startSetup();\n\n       $setup-&gt;getConnection()-&gt;addColumn(\n           $setup-&gt;getTable('catalog_product_option'),\n           'is_special_offer',\n           &#91;\n               'type'     =&gt; Table::TYPE_BOOLEAN,\n               'unsigned' =&gt; true,\n               'nullable' =&gt; false,\n               'default'  =&gt; '0',\n               'comment'  =&gt; 'Special Offer Flag',\n           ]\n       );\n\n       $setup-&gt;getConnection()-&gt;addColumn(\n           $setup-&gt;getTable('catalog_product_option_type_value'),\n           'description',\n           &#91;\n               'type'     =&gt; Table::TYPE_TEXT,\n               'nullable' =&gt; true,\n               'default'  =&gt; null,\n               'comment'  =&gt; 'Description',\n           ]\n       );\n\n       $setup-&gt;endSetup();\n   }\n}\n<\/code><\/pre>\n\n\n\n<p>The \u2018Is Special Offer\u2019 field will be disabled by default.<br><\/p>\n\n\n\n<p>Next, we can install the module.<\/p>\n\n\n\n<p>To do that, run the following commands in the console:<br><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo -u www-data php bin\/magento module:enable MageWorx_Option\nsudo -u www-data php bin\/magento setup:upgrade\n<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">3. Add logic to work with the backend<\/h2>\n\n\n\n<p>At this point, let\u2019s add the pool-modifiers mechanism to our module, which Magento 2 uses to combine all the necessary features on a product page in the admin panel.<br><\/p>\n\n\n\n<p>For that, let\u2019s add the following file:<\/p>\n\n\n\n<p>app\/code\/MageWorx\/Option\/etc\/adminhtml\/di.xml<br><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?xml version=\"1.0\"?&gt;\n\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\" xsi:noNamespaceSchemaLocation=\"urn:magento:framework:ObjectManager\/etc\/config.xsd\"&gt;\n   &lt;virtualType name=\"Magento\\CatalogStaging\\Ui\\DataProvider\\Product\\Form\\Modifier\\Pool\" type=\"Magento\\Ui\\DataProvider\\Modifier\\Pool\"&gt;\n       &lt;arguments&gt;\n           &lt;argument name=\"modifiers\" xsi:type=\"array\"&gt;\n               &lt;item name=\"mageworx-option-all\" xsi:type=\"array\"&gt;\n                   &lt;item name=\"class\" xsi:type=\"string\"&gt;MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\All&lt;\/item&gt;\n                   &lt;item name=\"sortOrder\" xsi:type=\"number\"&gt;71&lt;\/item&gt;\n               &lt;\/item&gt;\n           &lt;\/argument&gt;\n       &lt;\/arguments&gt;\n   &lt;\/virtualType&gt;\n   &lt;virtualType name=\"Magento\\Catalog\\Ui\\DataProvider\\Product\\Form\\Modifier\\Pool\" type=\"Magento\\Ui\\DataProvider\\Modifier\\Pool\"&gt;\n       &lt;arguments&gt;\n           &lt;argument name=\"modifiers\" xsi:type=\"array\"&gt;\n               &lt;item name=\"mageworx-option-all\" xsi:type=\"array\"&gt;\n                   &lt;item name=\"class\" xsi:type=\"string\"&gt;MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\All&lt;\/item&gt;\n                   &lt;item name=\"sortOrder\" xsi:type=\"number\"&gt;71&lt;\/item&gt;\n               &lt;\/item&gt;\n           &lt;\/argument&gt;\n       &lt;\/arguments&gt;\n   &lt;\/virtualType&gt;\n   &lt;virtualType name=\"MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\Pool\" type=\"Magento\\Ui\\DataProvider\\Modifier\\Pool\"&gt;\n       &lt;arguments&gt;\n           &lt;argument name=\"modifiers\" xsi:type=\"array\"&gt;\n           &lt;\/argument&gt;\n       &lt;\/arguments&gt;\n   &lt;\/virtualType&gt;\n   &lt;type name=\"MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\All\"&gt;\n       &lt;arguments&gt;\n           &lt;argument name=\"pool\" xsi:type=\"object\"&gt;MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\Pool&lt;\/argument&gt;\n       &lt;\/arguments&gt;\n   &lt;\/type&gt;\n   &lt;virtualType name=\"MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\Pool\"&gt;\n       &lt;arguments&gt;\n           &lt;argument name=\"modifiers\" xsi:type=\"array\"&gt;\n               &lt;item name=\"mageworx-option-base\" xsi:type=\"array\"&gt;\n                   &lt;item name=\"class\" xsi:type=\"string\"&gt;MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\Base&lt;\/item&gt;\n                   &lt;item name=\"sortOrder\" xsi:type=\"number\"&gt;72&lt;\/item&gt;\n               &lt;\/item&gt;\n           &lt;\/argument&gt;\n       &lt;\/arguments&gt;\n   &lt;\/virtualType&gt;\n&lt;\/config&gt;\n<\/code><\/pre>\n\n\n\n<p>Now, it&#8217;s time to create our MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\All class, which doesn\u2019t add anything new by itself to the Customizable Options form on the product page. Using the <em>dependency injection<\/em> (DI), it will add the necessary fields on the product page.<\/p>\n\n\n\n<p>In fact, our <a aria-label=\"Advanced Product Options Suite (opens in a new tab)\" href=\"https:\/\/www.mageworx.com\/magento-2-advanced-product-options-suite.html\" target=\"_blank\" rel=\"noreferrer noopener\">Advanced Product Options Suite<\/a> adds about 40 fields and other complex structures, which get added with the help of more than 10 packages that are included within the extension. As we do not need such complex structure here, we will use solely one class-modificator \u2015<\/p>\n\n\n\n<p>&nbsp;MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\Base.&nbsp;<br><\/p>\n\n\n\n<p>You might wonder, why we specify the following sort_order = 71. This all can be explained by the standard Magento 2 functionality, where fields for <em>Customizable Options <\/em>get added under sort_order = 70.<br><\/p>\n\n\n\n<p>Below, take a look at the MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier\\All class, which is presented by a regular iterator:<br><\/p>\n\n\n\n<p>app\/code\/MageWorx\/Option\/Ui\/DataProvider\/Product\/Form\/Modifier\/All.php<br><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\nnamespace MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier;\n\nuse Magento\\Catalog\\Ui\\DataProvider\\Product\\Form\\Modifier\\AbstractModifier;\nuse Magento\\Ui\\DataProvider\\Modifier\\PoolInterface;\n\nclass All extends AbstractModifier implements \\Magento\\Ui\\DataProvider\\Modifier\\ModifierInterface\n{\n   \/**\n    * @var PoolInterface\n    *\/\n   protected $pool;\n\n   \/**\n    * @var array\n    *\/\n   protected $meta = &#91;];\n\n   \/**\n    * @param PoolInterface $pool\n    *\/\n   public function __construct(\n       PoolInterface $pool\n   ) {\n       $this-&gt;pool = $pool;\n   }\n\n   \/**\n    * {@inheritdoc}\n    *\/\n   public function modifyData(array $data)\n   {\n       \/** @var \\Magento\\Ui\\DataProvider\\Modifier\\ModifierInterface $modifier *\/\n       foreach ($this-&gt;pool-&gt;getModifiersInstances() as $modifier) {\n           $data = $modifier-&gt;modifyData($data);\n       }\n\n       return $data;\n   }\n\n   \/**\n    * {@inheritdoc}\n    *\/\n   public function modifyMeta(array $meta)\n   {\n       $this-&gt;meta = $meta;\n\n       \/** @var \\Magento\\Ui\\DataProvider\\Modifier\\ModifierInterface $modifier *\/\n       foreach ($this-&gt;pool-&gt;getModifiersInstances() as $modifier) {\n           $this-&gt;meta = $modifier-&gt;modifyMeta($this-&gt;meta);\n       }\n\n       return $this-&gt;meta;\n   }\n}\n<\/code><\/pre>\n\n\n\n<p>Basically, now is the time to create a file, which will add our fields to the Customizable Options form:<br><\/p>\n\n\n\n<p>app\/code\/MageWorx\/Option\/Ui\/DataProvider\/Product\/Form\/Modifier\/Base.php<br><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;?php\nnamespace MageWorx\\Option\\Ui\\DataProvider\\Product\\Form\\Modifier;\n\nuse Magento\\Catalog\\Ui\\DataProvider\\Product\\Form\\Modifier\\AbstractModifier;\nuse Magento\\Catalog\\Ui\\DataProvider\\Product\\Form\\Modifier\\CustomOptions;\nuse Magento\\Ui\\Component\\Form\\Element\\Input;\nuse Magento\\Ui\\Component\\Form\\Element\\Checkbox;\nuse Magento\\Ui\\Component\\Form\\Element\\DataType\\Text;\nuse Magento\\Ui\\Component\\Form\\Field;\n\nclass Base extends AbstractModifier\n{\n   \/**\n    * @var array\n    *\/\n   protected $meta = &#91;];\n\n   \/**\n    * {@inheritdoc}\n    *\/\n   public function modifyData(array $data)\n   {\n       return $data;\n   }\n\n   \/**\n    * {@inheritdoc}\n    *\/\n   public function modifyMeta(array $meta)\n   {\n       $this-&gt;meta = $meta;\n\n       $this-&gt;addFields();\n\n       return $this-&gt;meta;\n   }\n\n   \/**\n    * Adds fields to the meta-data\n    *\/\n   protected function addFields()\n   {\n       $groupCustomOptionsName    = CustomOptions::GROUP_CUSTOM_OPTIONS_NAME;\n       $optionContainerName       = CustomOptions::CONTAINER_OPTION;\n       $commonOptionContainerName = CustomOptions::CONTAINER_COMMON_NAME;\n\n       \/\/ Add fields to the option\n       $this-&gt;meta&#91;$groupCustomOptionsName]&#91;'children']&#91;'options']&#91;'children']&#91;'record']&#91;'children']\n       &#91;$optionContainerName]&#91;'children']&#91;$commonOptionContainerName]&#91;'children'] = array_replace_recursive(\n           $this-&gt;meta&#91;$groupCustomOptionsName]&#91;'children']&#91;'options']&#91;'children']&#91;'record']&#91;'children']\n           &#91;$optionContainerName]&#91;'children']&#91;$commonOptionContainerName]&#91;'children'],\n           $this-&gt;getOptionFieldsConfig()\n       );\n\n       \/\/ Add fields to the values\n       $this-&gt;meta&#91;$groupCustomOptionsName]&#91;'children']&#91;'options']&#91;'children']&#91;'record']&#91;'children']\n       &#91;$optionContainerName]&#91;'children']&#91;'values']&#91;'children']&#91;'record']&#91;'children'] = array_replace_recursive(\n           $this-&gt;meta&#91;$groupCustomOptionsName]&#91;'children']&#91;'options']&#91;'children']&#91;'record']&#91;'children']\n           &#91;$optionContainerName]&#91;'children']&#91;'values']&#91;'children']&#91;'record']&#91;'children'],\n           $this-&gt;getValueFieldsConfig()\n       );\n   }\n\n   \/**\n    * The custom option fields config\n    *\n    * @return array\n    *\/\n   protected function getOptionFieldsConfig()\n   {\n       $fields&#91;'is_special_offer'] = $this-&gt;getSpecialOfferFieldConfig();\n\n       return $fields;\n   }\n\n   \/**\n    * The custom option fields config\n    *\n    * @return array\n    *\/\n   protected function getValueFieldsConfig()\n   {\n       $fields&#91;'description'] = $this-&gt;getDescriptionFieldConfig();\n\n       return $fields;\n   }\n\n   \/**\n    * Get special offer field config\n    *\n    * @return array\n    *\/\n   protected function getSpecialOfferFieldConfig()\n   {\n       return &#91;\n           'arguments' =&gt; &#91;\n               'data' =&gt; &#91;\n                   'config' =&gt; &#91;\n                       'label'         =&gt; __('Is Special Offer'),\n                       'componentType' =&gt; Field::NAME,\n                       'formElement'   =&gt; Checkbox::NAME,\n                       'dataScope'     =&gt; 'is_special_offer',\n                       'dataType'      =&gt; Text::NAME,\n                       'sortOrder'     =&gt; 65,\n                       'valueMap'      =&gt; &#91;\n                           'true'  =&gt; '1',\n                           'false' =&gt; '0'\n                       ],\n                   ],\n               ],\n           ],\n       ];\n   }\n\n   \/**\n    * Get description field config\n    *\n    * @return array\n    *\/\n   protected function getDescriptionFieldConfig()\n   {\n       return &#91;\n           'arguments' =&gt; &#91;\n               'data' =&gt; &#91;\n                   'config' =&gt; &#91;\n                       'label' =&gt; __('Description'),\n                       'componentType' =&gt; Field::NAME,\n                       'formElement'   =&gt; Input::NAME,\n                       'dataType'      =&gt; Text::NAME,\n                       'dataScope'     =&gt; 'description',\n                       'sortOrder'     =&gt; 41\n                   ],\n               ],\n           ],\n       ];\n   }\n}\n<\/code><\/pre>\n\n\n\n<p>What we need to do here is recursively add a necessary config for \u2018Is Special Offer\u2019 and \u2018Description\u2019 fields at the right place. Pay attention to the last two methods that actually realize the config of the added fields. For \u2018Is Special Offer we use checkbox, and for \u2018Description\u2019 \u2015 text input. <br><\/p>\n\n\n\n<p>As our fields in the database are located in the \u2018catalog_product_option\u2019 and \u2018catalog_product_option_type_value\u2019 fields, Magento 2 itself will add them to the form providing that we specify <strong>&#8216;dataScope&#8217; <\/strong>correctly.&nbsp;<br><\/p>\n\n\n\n<p>It is important to use different <strong>&#8216;sortOrder&#8217;<\/strong> to avoid replacing the standard Customizable Options fields. After playing around with various <strong>&#8216;sortOrder&#8217; variants, you can arrange fields in the order that suits you the most.<\/strong><br><\/p>\n\n\n\n<p>Besides, the fields config allows you to add various inline validations. For example, in our Advanced Product Options extension, the \u2018Cost\u2019 field is implemented as follows:<br><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code> 'label'             =&gt; __('Cost'),\n   'componentType'     =&gt; Field::NAME,\n   'formElement'       =&gt; Input::NAME,\n   'dataScope'         =&gt; \u2018cost\u2019,\n   'dataType'          =&gt; Number::NAME,\n   'validation'        =&gt; &#91;\n       'validate-number'          =&gt; true,\n       'validate-zero-or-greater' =&gt; true,\n   ]\n<\/code><\/pre>\n\n\n\n<p>Then, clear cache:<\/p>\n\n\n\n<p>sudo -u www-data php bin\/magento cache:clean<br><\/p>\n\n\n\n<p>The only thing left is to open a product we are interested in, fill in the necessary fields, and save it. The final result will look something like that:<br><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1600\" height=\"565\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM.png\" alt=\"\" class=\"wp-image-10848\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM.png 1600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-600x212.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-1200x424.png 1200w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-768x271.png 768w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-250x88.png 250w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-696x246.png 696w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-1068x377.png 1068w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2019\/07\/Screen-Shot-2019-07-05-at-3.54.21-PM-1189x420.png 1189w\" sizes=\"auto, (max-width: 1600px) 100vw, 1600px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Wrap Up<\/strong><\/h2>\n\n\n\n<p>Magento 2 offers an extremely convenient mechanism of expanding customizable options with practically unlimited functionality. That is what we eagerly use<a aria-label=\" in our extension (opens in a new tab)\" rel=\"noreferrer noopener\" href=\"https:\/\/www.mageworx.com\/magento-2-advanced-product-options-suite.html\" target=\"_blank\"> in our extension<\/a> and certainly recommend you. <br><\/p>\n\n\n<p><a href=\"https:\/\/calendly.com\/kate-volchock\/demo\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-15059 size-full\" src=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2021\/02\/live-demo-1.png\" alt=\"Book a Live Demo with Mageworx\" width=\"690\" height=\"260\" srcset=\"https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2021\/02\/live-demo-1.png 690w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2021\/02\/live-demo-1-600x226.png 600w, https:\/\/www.mageworx.com\/blog\/wp-content\/uploads\/2021\/02\/live-demo-1-250x94.png 250w\" sizes=\"auto, (max-width: 690px) 100vw, 690px\" \/><\/a><\/p>","protected":false},"excerpt":{"rendered":"<p><span class=\"span-reading-time rt-reading-time\" style=\"display: block;\"><span class=\"rt-label rt-prefix\">Reading Time: <\/span> <span class=\"rt-time\"> 5<\/span> <span class=\"rt-label rt-postfix\">minutes<\/span><\/span>You all know how convenient it is to use products\u2019 customizable options. We\u2019ve got a powerful Advanced Product Options Suite that drastically expands the standard functionality of the customizable options. Custom fields are the basis of some of the extension&#8217;s functionality. These fields get added to specific option types, such as a checkbox or text [&hellip;]<\/p>\n","protected":false},"author":37,"featured_media":12386,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[255,425],"tags":[379,436],"class_list":{"0":"post-10845","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-magento-2","8":"category-magento-how-tos","9":"tag-apo","10":"tag-developer-diaries"},"_links":{"self":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/10845","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/users\/37"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/comments?post=10845"}],"version-history":[{"count":11,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/10845\/revisions"}],"predecessor-version":[{"id":15737,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/posts\/10845\/revisions\/15737"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/media\/12386"}],"wp:attachment":[{"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/media?parent=10845"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/categories?post=10845"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mageworx.com\/blog\/wp-json\/wp\/v2\/tags?post=10845"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}