{"id":32467,"date":"2025-10-10T11:54:40","date_gmt":"2025-10-10T06:24:40","guid":{"rendered":"https:\/\/themehunk.com\/?post_type=docs&#038;p=32467"},"modified":"2026-02-21T17:16:43","modified_gmt":"2026-02-21T11:46:43","slug":"th-product-compare-pro","status":"publish","type":"docs","link":"https:\/\/themehunk.com\/fr\/docs\/th-product-compare-pro\/","title":{"rendered":"Th Product Compare Pro"},"content":{"rendered":"\n<section class=\"wp-block-group Install-plugin has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Plugin Installation<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Th Product Compare plugin<\/strong> helps you to create interactive product comparison tables and allow customers to compare their products.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Step 1:<\/strong> Go to your WordPress Dashboard and navigate to&nbsp;<strong>wp-admin &gt; Plugins &gt; Add Plugin<\/strong>. In the Right most side you&#8217;ll see the search box,&nbsp; enter the keyword &#8220;<strong>Th Product Compare<\/strong>&#8220;. Plugin will appear.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" height=\"495\" width=\"1024\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-Add-Compare.png?resize=1024%2C495&#038;ssl=1\" alt=\"\" class=\"wp-image-98227\"\/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Then click on the \u2018Install Now\u2019 button.<\/li>\n\n\n\n<li><strong>Step 2<\/strong>:&nbsp;After the installation is completed, click on the&nbsp;\u2018<strong>Activate<\/strong>\u2019 button and &#8220;<strong>Th Product Compare<\/strong>&#8221; will be activated.<\/li>\n\n\n\n<li><strong>Step 3<\/strong>: After activating &#8220;Th Product Compare&#8221; in your dashboard, you can see the &#8220;Themehunk&#8221; tab in the dashboard Menu. Under it, you&#8217;ll find Th Product Compare tab, click on it. Now you can start customizing it.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"469\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=1024%2C469&#038;ssl=1\" alt=\"\" class=\"wp-image-98135\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=1024%2C469&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=300%2C137&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=768%2C352&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=1536%2C703&amp;ssl=1 1536w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?resize=48%2C22&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Dashboard_-compare-1.png?w=1584&amp;ssl=1 1584w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group Install-pro has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to Purchase &amp; Install Pro Plugin<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Th Product Compare Pro Plugin Allows customers to compare products. Using this WooCommerce plugin customers can compare their selected products and make a better decision before buying them.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Step 1:<\/strong> Navigate to the ThemeHunk homepage, You will see &#8220;Plugins&#8221; menus on the top, when you hover over it you&#8217;ll see <strong>Th Product Compare Pro, <\/strong>click on it. You can find the Pro plugin here- <a href=\"https:\/\/themehunk.com\/fr\/plugins\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/themehunk.com\/plugins\/<\/a><\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?ssl=1\"><img data-recalc-dims=\"1\" decoding=\"async\" width=\"1024\" height=\"561\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?resize=1024%2C561&#038;ssl=1\" alt=\"\" class=\"wp-image-48605\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?resize=1024%2C561&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?resize=300%2C164&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?resize=768%2C421&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?resize=150%2C82&amp;ssl=1 150w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-3-213.png?w=1440&amp;ssl=1 1440w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Step 2<\/strong>: Afterward, just simply hit the <strong>\u2018Get Started\u2019<\/strong>&nbsp;button and it will directly take you to the&nbsp;<strong>\u2018Pricing\u2018&nbsp;<\/strong>section of Th Product Compare Pro Plugin.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" decoding=\"async\" width=\"1024\" height=\"542\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?resize=1024%2C542&#038;ssl=1\" alt=\"\" class=\"wp-image-98141\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?resize=1024%2C542&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?resize=300%2C159&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?resize=768%2C407&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?resize=48%2C25&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-homepage.png?w=1460&amp;ssl=1 1460w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><br>&lt;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Step 3<\/strong>: Now choose your desired plan from here and hit the button <strong>Buy Now <\/strong>from the desired table.<\/li>\n\n\n\n<li><strong>Step 4<\/strong>: Purchase your plugin from here, and fill in all the required details. Log in to your member\u2019s area. Your pro plugin has been added to your <a href=\"https:\/\/members.themehunk.com\/member\" target=\"_blank\" rel=\"noreferrer noopener\">member\u2019s area<\/a> dashboard.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-installation-pro-3.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"663\" height=\"813\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-installation-pro-3.png?resize=663%2C813&#038;ssl=1\" alt=\"\" class=\"wp-image-34854\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-installation-pro-3.png?w=663&amp;ssl=1 663w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-installation-pro-3.png?resize=245%2C300&amp;ssl=1 245w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/th-product-compare-installation-pro-3.png?resize=150%2C184&amp;ssl=1 150w\" sizes=\"(max-width: 663px) 100vw, 663px\" \/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Step 5<\/strong>: You\u2019ll see a Th Product Compare Pro plugin zip file in your Member&#8217;s area. Download the zip file of the plugin.<\/li>\n\n\n\n<li><strong>Step 6<\/strong>: Now, Open your <strong>WP Dashboard &gt; Plugins &gt; Add New &gt; Upload the Plugin Zip file and Activate it<\/strong>.<\/li>\n\n\n\n<li>You can see the \u201c<strong>Th Product Compare Pro<\/strong>\u201d panel in your dashboard.<\/li>\n<\/ul>\n<\/section>\n\n\n\n<section class=\"wp-block-group button-appearance has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Appearance Setting of Compare Button ( Basic Setting )<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>For Button Appearance button settings, Go to your <strong>Dashboard &gt; Th Product Compare Pro &gt; Basic Settings<\/strong>.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"608\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?resize=1024%2C608&#038;ssl=1\" alt=\"\" class=\"wp-image-98960\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?resize=1024%2C608&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?resize=300%2C178&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?resize=768%2C456&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?resize=48%2C28&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Basic.png?w=1415&amp;ssl=1 1415w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Compare Button Type and Text<\/strong> &#8211; This allows you to choose whether you want to choose an Icon or a Checkbox. You can write the text to be shown in the button.<\/li>\n\n\n\n<li><strong>Product Compare Button Redirection &#8211;<\/strong> This gives you 2 options: if you select Popup, the compare button will redirect to a pop-up where the comparison table will appear. If you select a page, the Compare button will redirect to a new page for comparison.<\/li>\n\n\n\n<li><strong>Comparison Limit &#8211;<\/strong> You can set the limit to which products can be compared. <\/li>\n\n\n\n<li><strong>Comparison Limit Tooltip<\/strong> &#8211; Change the text that appear when product limit is reached from here.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Limit-gif.gif?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"388\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Limit-gif.gif?resize=800%2C388&#038;ssl=1\" alt=\"\" class=\"wp-image-98977\"\/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Visibility &#8211;<\/strong> Mark the boxes if you want to show the compare button. If you don&#8217;t want to show the compare button on the listed page, leave the box unchecked.<\/li>\n\n\n\n<li><strong>Button Placements &#8211;<\/strong> You can select whether you want to show the compare button &#8216;Before cart&#8217; or &#8216;After cart&#8217; on the single product page.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"663\" height=\"352\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/appereance-setting-result.png?resize=663%2C352&#038;ssl=1\" alt=\"\" class=\"wp-image-34359\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/appereance-setting-result.png?w=663&amp;ssl=1 663w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/appereance-setting-result.png?resize=300%2C159&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/appereance-setting-result.png?resize=150%2C80&amp;ssl=1 150w\" sizes=\"(max-width: 663px) 100vw, 663px\" \/><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group advanced-setting has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Compare button Advance Setting<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">For Compare button Advance Setting, Go to your <strong>Dashboard &gt; Th Product Compare &gt; Advanced<\/strong>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Compare Same Category Product &#8211;<\/strong> If you enable this option, products&#8217; category will be shown at the top of the table. You can click on the categories to show products of that category only.<\/li>\n\n\n\n<li><strong>Similarities &amp; Differences &#8211;<\/strong> If you enable this button, you will see two buttons saying &#8220;Hide Similarities&#8221; and &#8220;Highlight Differences&#8221;. Users can enable these buttons to see the differences and hide similarities.<\/li>\n\n\n\n<li><strong>Field To Show in comparison table &#8211;<\/strong> You can display the following fields in your compare table &#8211; Image, Title, Price, Rating, Add To Cart, Description, SKU, Availability and Product attributes too. <\/li>\n\n\n\n<li><strong>Dynamic Attributes &#8211;<\/strong> Check this option to allow the custom fields to show in the table. You will need to create the attributes from the dashboard before this.<\/li>\n\n\n\n<li><strong>Repeat Fields &#8211;<\/strong> You can Repeat the &#8220;Price&#8221; field and Repeat the &#8220;Add to cart&#8221; field in your comparison table.<\/li>\n\n\n\n<li><strong>Product Image Size -Pro<\/strong>&nbsp;You can add the desired image size of your product and display it in your table.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1006\" height=\"1024\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?resize=1006%2C1024&#038;ssl=1\" alt=\"\" class=\"wp-image-98968\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?resize=1006%2C1024&amp;ssl=1 1006w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?resize=295%2C300&amp;ssl=1 295w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?resize=768%2C781&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?resize=48%2C49&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced.png?w=1431&amp;ssl=1 1431w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group category-product has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to Compare the same category product? PRO<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>To create a Category, Navigate to Dashboard &gt; In the left side panel you&#8217;ll see Products &gt; Categories.<\/li>\n\n\n\n<li>Click on Category, Add a new Product category name and upload a thumbnail image here. Click on the &#8220;Add New Category&#8221; Button.<\/li>\n\n\n\n<li>To edit a pre-existing category, select a category on the right side of the screen.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"663\" height=\"315\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2020\/07\/Product-categories-top-store.png?resize=663%2C315&#038;ssl=1\" alt=\"Product-categories-top-store\" class=\"wp-image-20987\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2020\/07\/Product-categories-top-store.png?w=663&amp;ssl=1 663w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2020\/07\/Product-categories-top-store.png?resize=300%2C143&amp;ssl=1 300w\" sizes=\"(max-width: 663px) 100vw, 663px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Go to your <strong>Dashboard &gt; Th Product Compare &gt; Advance Setting &gt; Compare Same Category Product<\/strong><\/li>\n\n\n\n<li>Using this option you can enable or disable the Category Tab in the Comparison Table. The products added to the comparison table will be divided by category so that the comparison will be made only for products of the same category.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"337\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?resize=1024%2C337&#038;ssl=1\" alt=\"\" class=\"wp-image-98970\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?resize=1024%2C337&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?resize=300%2C99&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?resize=768%2C253&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?resize=48%2C16&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-2.png?w=1431&amp;ssl=1 1431w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group similarities-differences has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to display Similarities &amp; Differences? PRO<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>This option will be useful in highlighting the Similarities and differences between your products. You can easily compare similar products in a table that highlights differences or Similarities and focuses on product features.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"337\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?resize=1024%2C337&#038;ssl=1\" alt=\"\" class=\"wp-image-98971\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?resize=1024%2C337&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?resize=300%2C99&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?resize=768%2C253&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?resize=48%2C16&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Advanced-3.png?w=1431&amp;ssl=1 1431w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Enable or disable Product Highlight Button-<\/strong> Using this option you can enable or disable Product Highlight Button. This will display the &#8220;Hide Similarities&#8221; &amp; &#8220;Highlight Differences&#8221; Buttons in the Comparison Table.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"496\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=1024%2C496&#038;ssl=1\" alt=\"\" class=\"wp-image-98144\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=1024%2C496&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=300%2C145&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=768%2C372&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=1536%2C744&amp;ssl=1 1536w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?resize=48%2C23&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare_-similarities-differences-1.jpg?w=1596&amp;ssl=1 1596w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group order-fields has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to order Product fields? PRO<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>You can easily drag &amp; drop desired fields of your product. You can interchange place fields and show them in your comparison table.<\/li>\n\n\n\n<li>You can display the following fields of your products &#8211; Image, Title, Price, Rating, Add To Cart, Description and SKU.<\/li>\n\n\n\n<li>Along with these fields, you can also display Global attributes and Custom attributes.<\/li>\n\n\n\n<li><strong>Global Attributes &#8211;<\/strong> These attributes are created for all the products.<\/li>\n\n\n\n<li><strong>Custom attributes &#8211;<\/strong> You can display custom attributes (attributes created for individual products). To know how to create Attributes for your product. Go with this <a href=\"https:\/\/themehunk.com\/fr\/docs\/th-variation-swatches-plugin\/#assign-attributes\" target=\"_blank\" rel=\"noreferrer noopener\">link<\/a>.<\/li>\n\n\n\n<li><strong>Dynamic Attributes &#8211;<\/strong> Using this option you can enable or disable Product Dynamic Attributes in your comparison table.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/12\/field-comparison.gif?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"250\" height=\"442\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/12\/field-comparison.gif?resize=250%2C442&#038;ssl=1\" alt=\"ordering\" class=\"wp-image-34764\"\/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group table-styling has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Comparison Table Preview \u200bStyling PRO<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To style your product comparison table, Go to your <strong>Dashboard &gt; Th Product Compare &gt; Style<\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">These styling settings are given to design your comparison table. The live preview of the Comparison Bar and Table is given on the right side of the page.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Compare Bar<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>{Selected} {Products}<\/strong> &#8211; This format is to set the text you can see in the bottom left of the Comparison Bar. You can change the text and alter the position. <\/li>\n\n\n\n<li><strong>Background<\/strong> &#8211; You can change the color of the background of the Comparison Bar. <\/li>\n\n\n\n<li><strong>Content Color<\/strong> &#8211; This is to set the color of the content and the delete icon on the left side of the <strong>Compare<\/strong> button.<\/li>\n\n\n\n<li><strong>Button Color<\/strong> &#8211; With this, you can change the color of the button text.<\/li>\n\n\n\n<li><strong>Button Background Color<\/strong> &#8211; This setting is used to change the color of the background of the button.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"378\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?resize=1024%2C378&#038;ssl=1\" alt=\"\" class=\"wp-image-98972\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?resize=1024%2C378&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?resize=300%2C111&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?resize=768%2C283&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?resize=48%2C18&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style.png?w=1405&amp;ssl=1 1405w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Popup Setting<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Popup Heading Text<\/strong> &#8211; This box is used to change the text of the heading of the pop-up. <\/li>\n\n\n\n<li><strong>Popup Count Text<\/strong> &#8211; You can set the format and text for the text shown below <strong>Popup Heading Text<\/strong>.<\/li>\n\n\n\n<li><strong>Popup Animation<\/strong> &#8211; There are several animation options to set. The animation will take place when the user clicks onthe  Compare button of the Compare Bar. <\/li>\n\n\n\n<li><strong>Global Colors<\/strong> &#8211; These color settings will help you set up the color of components of the pop-up. These components include header, table, add to cart, and close button.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"516\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?resize=1024%2C516&#038;ssl=1\" alt=\"\" class=\"wp-image-98973\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?resize=1024%2C516&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?resize=300%2C151&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?resize=768%2C387&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?resize=48%2C24&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Style-2.png?w=1405&amp;ssl=1 1405w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group mobile-settings has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Mobile Settings<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">This setting is especifically designed set up the mobile appearance of the comparison table. You can also see the live preview on right side.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"534\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?resize=1024%2C534&#038;ssl=1\" alt=\"\" class=\"wp-image-98962\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?resize=1024%2C534&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?resize=300%2C156&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?resize=768%2C401&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?resize=48%2C25&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Mobile.png?w=1415&amp;ssl=1 1415w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Table Style in Mobile<\/strong> &#8211; Select whether you want to show Mobile Responsive or Desktop Style table.<\/li>\n\n\n\n<li><strong>Colors<\/strong> &#8211; Change the various component&#8217;s colors from here. You can edit the colors of button, rating, and background separately.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_mobile-gif.gif?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"776\" height=\"576\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_mobile-gif.gif?resize=776%2C576&#038;ssl=1\" alt=\"\" class=\"wp-image-98966\"\/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group create-shortcode has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to Generate Shortcode PRO<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Go to your <strong>Dashboard &gt; Th Product Compare &gt; Shortcode <strong>Generat<\/strong>or<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1405\" height=\"731\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?resize=1405%2C731&#038;ssl=1\" alt=\"\" class=\"wp-image-98974\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?w=1405&amp;ssl=1 1405w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?resize=300%2C156&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?resize=1024%2C533&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?resize=768%2C400&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Shortcode.png?resize=48%2C25&amp;ssl=1 48w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Choose Products<\/strong> &#8211; Using this option, you can create a shortcode with the desired products. When You can use this shortcode anywhere in the pages &amp; posts. Search for your products in the search box, and it will automatically create a shortcode for your product. Copy that shortcode and place it on your page or post.<\/li>\n<\/ul>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Display via Shortcode<\/strong> &#8211; Add a compare anywhere on the page using shortcode. You will need to enter the product ID in the shortcode. When the user clicks on the Compare button, the compare bar will appear on the page with the same product whose id you entered in the shortcode.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Display-via-Shortcode_-gif.gif?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"390\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Display-via-Shortcode_-gif.gif?resize=800%2C390&#038;ssl=1\" alt=\"\" class=\"wp-image-98161\"\/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Display Compare Product List via Shortcode<\/strong> &#8211; Put several Product Ids in the shortcode, and they will appear in the comparison table on the desired page you paste the shortcode on.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-List-via-Shortcode_-gif.gif?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"800\" height=\"390\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-List-via-Shortcode_-gif.gif?resize=800%2C390&#038;ssl=1\" alt=\"\" class=\"wp-image-98162\"\/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group single-page has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">How to display the Comparison table on Product single page PRO<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Go to your <strong>Dashboard &gt; Th Product Compare &gt; Single Page Settings.<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"489\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?resize=1024%2C489&#038;ssl=1\" alt=\"\" class=\"wp-image-98975\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?resize=1024%2C489&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?resize=300%2C143&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?resize=768%2C367&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?resize=48%2C23&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare_-Single-Page.png?w=1405&amp;ssl=1 1405w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Automated Comparison Table<\/strong> &#8211; This option will add a Comparison Table to the single pages of All Products.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"625\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?resize=1024%2C625&#038;ssl=1\" alt=\"\" class=\"wp-image-98211\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?resize=1024%2C625&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?resize=300%2C183&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?resize=768%2C469&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?resize=48%2C29&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Single-page_-compare-table.png?w=1307&amp;ssl=1 1307w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Product Compare By<\/strong> &#8211; This option will be useful to display comparisons using Category, Tag, or Related products in your Single Product Page. <em>For example<\/em>, if Category is selected, then products of the same category will appear in the Comparison Table.<\/li>\n\n\n\n<li><strong>Number Of&nbsp; Products <\/strong>&#8211; From this option, you can add the Number of products limit to show on a single product comparison page. <em>For example<\/em>, if 2 is set in the box, then 3 products will be shown in the table, including the product itself.<\/li>\n\n\n\n<li><strong>Exclude Product<\/strong> &#8211; You can exclude products from a single product comparison page. If you exclude any product, then on the excluded product, the comparison table will not appear.<\/li>\n\n\n\n<li><strong>Manual Method<\/strong> &#8211; Manual option available to display the table only on the desired product page with selected products.<\/li>\n\n\n\n<li>To get this option, just go to your products &gt; When you scroll down the product page editor, you\u2019ll see Product Data panel &gt; Compare option &gt; Show Compare Product &gt; Select manual. It will open options for you. Now you can include the Compare Product that you want to show on that particular single product page.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1102\" height=\"418\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?resize=1102%2C418&#038;ssl=1\" alt=\"\" class=\"wp-image-34968\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?w=1102&amp;ssl=1 1102w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?resize=300%2C114&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?resize=1024%2C388&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?resize=768%2C291&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2021\/10\/manual-setup-single-page-th-compare-product-2.png?resize=150%2C57&amp;ssl=1 150w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group custom-fields has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Custom Fields &amp; Hooks<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Add your own custom product fields to Product Compare Pro. The plugin reads native WooCommerce post meta, Advanced Custom Fields (ACF), and Secure Custom Fields (SCF). Developers can also register fields programmatically with the <mark style=\"background-color:#eaeaea\" class=\"has-inline-color has-prim-color-color\"><strong>th-product-compare-field<\/strong> <\/mark>filter so any desired custom field appears in the compare table.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">At a glance<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Supported sources: WooCommerce post meta, ACF, SCF<\/li>\n\n\n\n<li>Programmatic hook: <mark style=\"background-color:#eaeaea\" class=\"has-inline-color\"><code><strong>th-product-compare-field<\/strong><\/code> <\/mark><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Quick user steps<\/h2>\n\n\n\n<ul start=\"1\" class=\"wp-block-list\">\n<li>Create the custom field in ACF, SCF, or the native custom fields box and assign it to the Product post type. Note the field name (meta key).<\/li>\n\n\n\n<li>Add the field to Product Compare. You can either add it via the plugin Field Map UI or register it programmatically with the filter shown below.<\/li>\n\n\n\n<li>Clear any caches and open the compare popup or table. The new field will appear in the field list and can be reordered like other fields.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Programmatic registration<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Use the <strong><mark style=\"background-color:#eaeaea\" class=\"has-inline-color\"><code>th-product-compare-field<\/code> <\/mark><\/strong>filter to add custom fields. Product Compare will merge your fields with the default set, so your callback should accept the existing fields array and return the merged result.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Filter details<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Filter name: <mark style=\"background-color:#eaeaea\" class=\"has-inline-color\"><strong><code>th-product-compare-field<\/code> <\/strong><\/mark><\/li>\n\n\n\n<li>Purpose: Register or extend compare fields programmatically<\/li>\n\n\n\n<li>Expected return shape: associative array where keys are internal field keys, and values are arrays with at least <code><strong>title<\/strong><\/code> and <code><strong>field_key<\/strong><\/code> values<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Example<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Note:<\/strong> Add this code to <strong>functions.php<\/strong> or <strong>Code Snippets<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>add_filter( 'th-product-compare-field', 'theme_name_callback' );\n\nfunction my_callback(){\nreturn array('key1'=&gt;&#91;'title'=&gt;'Memory','field_key'=&gt;'key1'],\n'key2'=&gt;&#91;'title'=&gt;'Memory','field_key'=&gt;'key2'],\n);\n}\nadd_filter( 'th-product-compare-field', 'my_callback' );\n\n\n&#91;\n'key1' =&gt; &#91; \/\/ \u2190 U WordPress post meta key (custom field key)\n'title' =&gt; 'Label', \/\/ \u2190 Shown in the compare table header\/UI\n'key1' =&gt; 'meta_key', \/\/ \u2190 WordPress post meta key (custom field key) to fetch from the product\n],\n...\n]<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">After adding the code to your <strong>functions.php<\/strong> file, you will now see the extra fields added to your <strong>Product Compare Table<\/strong>, as shown in the screenshot below.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large is-resized\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"552\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313.png?resize=1024%2C552&#038;ssl=1\" alt=\"\" class=\"wp-image-93067\" style=\"width:746px;height:auto\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=1024%2C552&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=300%2C162&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=768%2C414&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=1536%2C828&amp;ssl=1 1536w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=2048%2C1103&amp;ssl=1 2048w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/compare-fields-313-scaled.png?resize=48%2C26&amp;ssl=1 48w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">As you can see in the above image, we have added the custom fields.<\/p>\n<\/section>\n\n\n\n<section class=\"wp-block-group custom-attributes has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Custom Attributes<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Follow these steps to create attributes<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 1<\/strong>: Go to the WordPress dashboard and navigate to <strong>Products &gt; Attributes<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"565\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?resize=1024%2C565&#038;ssl=1\" alt=\"\" class=\"wp-image-98594\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?resize=1024%2C565&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?resize=300%2C165&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?resize=768%2C423&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?resize=48%2C26&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-dashboard.png?w=1072&amp;ssl=1 1072w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 2<\/strong>: Create a <strong>Size attribute<\/strong> and click the <strong>Add Attribute<\/strong> button.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"425\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?resize=1024%2C425&#038;ssl=1\" alt=\"\" class=\"wp-image-98595\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?resize=1024%2C425&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?resize=300%2C124&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?resize=768%2C319&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?resize=48%2C20&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Add-Attribute.png?w=1422&amp;ssl=1 1422w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 3<\/strong>: After creating the attribute, you will see an option called <strong>Configure terms<\/strong> for the attribute you created.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"426\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?resize=1024%2C426&#038;ssl=1\" alt=\"\" class=\"wp-image-98596\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?resize=1024%2C426&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?resize=300%2C125&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?resize=768%2C319&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?resize=48%2C20&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute_-configure-terms.png?w=1426&amp;ssl=1 1426w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 4<\/strong>: Click Configure terms and add the Size values one by one.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"438\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?resize=1024%2C438&#038;ssl=1\" alt=\"\" class=\"wp-image-98597\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?resize=1024%2C438&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?resize=300%2C128&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?resize=768%2C328&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?resize=48%2C21&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Attribute-Values.png?w=1458&amp;ssl=1 1458w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 5<\/strong>: After creating the attribute, go to <strong>Products &gt; All Products<\/strong> and edit the product where you want to add the Size. Scroll down to the <strong>Product data<\/strong> section and click on <strong>Attributes<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"346\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?resize=1024%2C346&#038;ssl=1\" alt=\"\" class=\"wp-image-98599\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?resize=1024%2C346&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?resize=300%2C101&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?resize=768%2C259&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?resize=48%2C16&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product-dash_-Attributes.png?w=1116&amp;ssl=1 1116w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 6<\/strong>: Click <strong>Add existing<\/strong>, select the Weight attribute, and choose the appropriate weight for the product.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"1013\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=1024%2C1013&#038;ssl=1\" alt=\"\" class=\"wp-image-98598\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=1024%2C1013&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=300%2C297&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=768%2C760&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=100%2C100&amp;ssl=1 100w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?resize=48%2C47&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Product_-Attributes.png?w=1116&amp;ssl=1 1116w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Step 7<\/strong>: To display this custom attribute in the comparison table, go to <strong>Product Compare Pro &gt; Advanced &gt; Fields to Show in Comparison Table<\/strong>, check the Size option, and click Save changes.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"429\" src=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?resize=1024%2C429&#038;ssl=1\" alt=\"\" class=\"wp-image-98600\" srcset=\"https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?resize=1024%2C429&amp;ssl=1 1024w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?resize=300%2C126&amp;ssl=1 300w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?resize=768%2C322&amp;ssl=1 768w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?resize=48%2C20&amp;ssl=1 48w, https:\/\/i0.wp.com\/themehunk.com\/wp-content\/uploads\/2025\/10\/Compare-Fields_-Attribute.png?w=1420&amp;ssl=1 1420w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/a><\/figure>\n<\/section>\n\n\n\n<section class=\"wp-block-group get-support has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h2 class=\"wp-block-heading\">Get Help<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>If you encounter any difficulties, please don&#8217;t hesitate to contact our support team through the <a href=\"https:\/\/www.support.themehunk.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">support forum<\/a>.<\/li>\n\n\n\n<li>You can also <a href=\"https:\/\/themehunk.com\/fr\/contact-us\/\" target=\"_blank\" rel=\"noreferrer noopener\">contact<\/a> us by filling out the form or by pinging us at our Live chat for pre-sales queries.<\/li>\n<\/ul>\n<\/section>\n","protected":false},"excerpt":{"rendered":"<p>Plugin Installation Th Product Compare plugin helps you to create interactive product comparison tables and allow customers to compare their products. How to Purchase &amp; Install Pro Plugin Th Product Compare Pro Plugin Allows customers to compare products. Using this WooCommerce plugin customers can compare their selected products and make a better decision before buying [&hellip;]<\/p>\n","protected":false},"author":7288,"featured_media":0,"template":"","meta":{"footnotes":""},"class_list":["post-32467","docs","type-docs","status-publish","hentry","docscate-lite-plugin","docscate-pro-plugin"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/32467","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/users\/7288"}],"version-history":[{"count":49,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/32467\/revisions"}],"predecessor-version":[{"id":98978,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/32467\/revisions\/98978"}],"wp:attachment":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/media?parent=32467"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}