{"id":1886,"date":"2022-12-23T09:16:38","date_gmt":"2022-12-23T09:16:38","guid":{"rendered":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/?page_id=1886"},"modified":"2022-12-28T05:40:13","modified_gmt":"2022-12-28T05:40:13","slug":"documentation-divi-layouts","status":"publish","type":"page","link":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/documentation-divi-layouts\/","title":{"rendered":"Documentation &#8211; Divi Layouts"},"content":{"rendered":"<p>[et_pb_section fb_built=&#8221;1&#8243; specialty=&#8221;on&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; custom_padding=&#8221;1.5rem||||false|false&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column type=&#8221;1_3&#8243; _builder_version=&#8221;4.16&#8243; custom_padding=&#8221;|||&#8221; global_colors_info=&#8221;{}&#8221; custom_padding__hover=&#8221;|||&#8221;][et_pb_accordion closed_toggle_background_color=&#8221;#FFFFFF&#8221; icon_color=&#8221;rgba(10,10,10,0.12)&#8221; use_icon_font_size=&#8221;on&#8221; icon_font_size=&#8221;18px&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; toggle_font=&#8221;|600|||||||&#8221; toggle_font_size=&#8221;16px&#8221; toggle_line_height=&#8221;1.3em&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;||||false|false&#8221; sticky_position=&#8221;top&#8221; sticky_offset_top=&#8221;40px&#8221; sticky_limit_bottom=&#8221;row&#8221; sticky_position_tablet=&#8221;none&#8221; sticky_position_phone=&#8221;none&#8221; sticky_position_last_edited=&#8221;on|tablet&#8221; custom_css_main_element=&#8221;padding:1.1rem;||border-radius:12px;||box-shadow:0px 3px 10px rgba(0,0,0,0.1)&#8221; border_radii=&#8221;on|8px|8px|8px|8px&#8221; border_color_all=&#8221;rgba(10,10,10,0.1)&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_accordion_item title=&#8221;Getting Started&#8221; open=&#8221;off&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<ul style=\"padding-bottom: 0px;\">\n<li><a href=\"#fileStructure\">File structure<\/a><\/li>\n<li><a href=\"#installation\">Installation<\/a><\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=&#8221;WooCommerce Layouts &#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221; open=&#8221;off&#8221;]<\/p>\n<ul style=\"padding-bottom: 0px;\">\n<li><a href=\"#productsLayouts\">Products<\/a><\/li>\n<li><a href=\"#shopLayouts\">Shop<\/a><\/li>\n<li><a href=\"#checkoutLayouts\">Checkout<\/a><\/li>\n<li><a href=\"#cartLayouts\">Cart<\/a><\/li>\n<li><a href=\"#pageLayouts\">My Account<\/a><\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=&#8221;Layout pages &#038; sections&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221; open=&#8221;on&#8221;]<\/p>\n<ul style=\"padding-bottom: 0px;\">\n<li><a href=\"#pageLayouts\">Pages<\/a><\/li>\n<li><a href=\"#sectionsLayouts\">Sections<\/a><\/li>\n<li><a href=\"#headerLayouts\">Header &amp; Footer<\/a><\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][et_pb_accordion_item title=&#8221;FAQs&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221; open=&#8221;off&#8221;]<\/p>\n<ul style=\"padding-bottom: 0px;\">\n<li><a href=\"#missingSidebar\">Missing sidebar content in the layout?<\/a><\/li>\n<\/ul>\n<p>[\/et_pb_accordion_item][\/et_pb_accordion][\/et_pb_column][et_pb_column type=&#8221;2_3&#8243; specialty_columns=&#8221;2&#8243; _builder_version=&#8221;4.16&#8243; custom_padding=&#8221;|||&#8221; global_colors_info=&#8221;{}&#8221; custom_padding__hover=&#8221;|||&#8221;][et_pb_row_inner module_id=&#8221;fileStructure&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; custom_margin=&#8221;||||false|false&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>File structure<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>You can download the product from the My Account &#8211;&gt; Download<\/p>\n<p>After the purchase of the Butterfly WooCommerce Divi layouts, you\u2019ll get the following file.<\/p>\n<ul>\n<li><strong>butterfly-divi-layouts-x.x.zip<\/strong> (where x.x is a version number)<\/li>\n<\/ul>\n<p>Extract the above file and you will get two files as below.<\/p>\n<p>File 1: <strong>product.zip<\/strong><br \/>File 2: <strong>supplementary-files.zip<\/strong><\/p>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>File 1: product.zip<\/h3>\n<p>Extract this zip and you will get the following .json files<\/p>\n<ul>\n<li>Cart.json<\/li>\n<li>Checkout.json<\/li>\n<li>Products.json<\/li>\n<li>Sections.json<\/li>\n<li>Shop.json<\/li>\n<\/ul>\n<p>All the above categories contain their respective layouts in a single JSON file. If you want to use only a single layout of a specific category then import the file from the supplementary files.<\/p>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>File 2: supplementary-files.zip<\/h3>\n<p>Here you will get the .json file of each layout separately.<\/p>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Home<\/h4>\n<p>In this folder, you will get 8 separate .json Divi Page files of each home layout.<\/p>\n<ul>\n<li>Home Page 01.json<\/li>\n<li>Home Page 02.json<\/li>\n<li>Home Page 03.json<\/li>\n<li>Home Page 04.json<\/li>\n<li>Home Page 05.json<\/li>\n<li>Home Page 06.json<\/li>\n<li>Home Page 07.json<\/li>\n<li>Home Page 08.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>About Us<\/h4>\n<p>In this folder, you will get 2 separate .json Divi Page files of each about layout.<\/p>\n<ul>\n<li>About Page 01.json<\/li>\n<li>About Page 02.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Contact Us<\/h4>\n<p>In this folder, you will get 2 separate .json Divi Page files of each contact layout.<\/p>\n<ul>\n<li>Contact Page 01.json<\/li>\n<li>Contact Page 02.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Blog<\/h4>\n<p>In this folder, you will get 2 separate .json Divi Page files of each category &amp; post layout.<\/p>\n<ul>\n<li>Post Category 01.json<\/li>\n<li>Post Category 02.json<\/li>\n<li>Post Details 02.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Others<\/h4>\n<p>In this folder, you will get 3 separate .json Divi Page files of each contact sigle layout.<\/p>\n<ul>\n<li>FAQs.json<\/li>\n<li>Coming Soon.json<\/li>\n<li>404.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Sections<\/h4>\n<p>In the section, you will get one .json Divi Library Layout file named Butterfly Section.json<\/p>\n<ul>\n<li>Butterfly Section.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;17px&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>In the <strong>supplementary-files.zip<\/strong> you will get all the WooCommerce layouts as in the main product file. But here you will get a single .json file of each layout.<\/p>\n<p>[\/et_pb_text][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;installation&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||0.5rem||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Installation<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; custom_margin=&#8221;||0px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>From now on you will get separate JSON files for each layout.<\/p>\n<p>For the installation documentation of each layout category, links are given below.<\/p>\n<ul>\n<li><a href=\"#cartLayouts\">Cart Layouts<\/a><\/li>\n<li><a href=\"#checkoutLayouts\">Checkout Layouts<\/a><\/li>\n<li><a href=\"#productsLayouts\">Products Layouts<\/a><\/li>\n<li><a href=\"#sectionsLayouts\">Sections Layouts<\/a><\/li>\n<li><a href=\"#blogLayouts\">Blog Layouts<\/a><\/li>\n<li><a href=\"#postLayouts\">Post Layouts<\/a><\/li>\n<li><a href=\"#404Layouts\">404 Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">Page Layouts<\/a>\n<ul>\n<li><a href=\"#PageLayouts\">My account Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">Home Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">About Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">Contact Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">FAQs Page Layouts<\/a><\/li>\n<li><a href=\"#PageLayouts\">Coming Soon Page Layouts<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Divi Theme Builder Templates (Cart, Product, Checkout, Shop, Blog, Post)<\/h3>\n<p>To install all the theme builder layouts at once follow the below steps:<\/p>\n<ul>\n<li>After downloading the <strong>butterfly-divi-layouts.zip<\/strong>, Extract it to get <strong>Divi-Theme-Builder-Templates.json<\/strong>.<\/li>\n<li>Then on <strong>WordPress Dashboard<\/strong> &gt;&gt; go to <strong>Divi<\/strong> &gt;&gt; <strong>Theme Builder<\/strong>.<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/portability-icon.png&#8221; title_text=&#8221;portability-icon&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<ul>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<li>Go to <strong>Import tab<\/strong> &gt;&gt; <strong>Choose File<\/strong> and browse for the <strong>DIVI-Theme-Builder-Templates.json<\/strong><\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/DIVI-Theme-Builder-Templates.png&#8221; title_text=&#8221;DIVI-Theme-Builder-Templates&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; custom_margin=&#8221;||||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<ul>\n<li>Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/li>\n<li>This will import all the layouts to your Divi Theme builder.<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Import-Divi-Theme-Builder-Templates.png&#8221; title_text=&#8221;Import-Divi-Theme-Builder-Templates&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_line_height=&#8221;1.4em&#8221; header_5_line_height=&#8221;1.3em&#8221; custom_margin=&#8221;||0px||false|false&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h5>If you want to install any specific layout type, then please move to the following document link:<\/h5>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; custom_margin=&#8221;||0px||false|false&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<ul>\n<li><a href=\"#cartLayouts\">Cart Layouts<\/a><\/li>\n<li><a href=\"#checkoutLayouts\">Checkout Layouts<\/a><\/li>\n<li><a href=\"#productsLayouts\">Products Layouts<\/a><\/li>\n<li><a href=\"#sectionsLayouts\">Sections Layouts<\/a><\/li>\n<li><a href=\"#blogLayouts\">Blog Layouts<\/a><\/li>\n<li><a href=\"#postLayouts\">Post Layouts<\/a><\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Divi Library Layouts(Pages &amp; Sections)<\/h3>\n<p><a href=\"#Pages\">Click here<\/a> to know the import process of Pages &amp; Sections.<\/p>\n<p>[\/et_pb_text][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;productsLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Products<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Products Layout<\/h3>\n<p><strong>To import all the product layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>Products.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Products-Layout.png&#8221; title_text=&#8221;Products-Layout&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>Products.json<\/strong><\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Products-Layout-2.png&#8221; title_text=&#8221;Products-Layout-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the Products Layouts in your Divi Theme Builder.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Products-Layout-3.png&#8221; title_text=&#8221;Products-Layout-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the specific product layout<\/h3>\n<p>If you want to import a specific product layout then move to the product file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific product layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Product-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a Product Page Layout move to one of the product page layouts, and click on the <strong>Setting<\/strong> icon as shown in the below screenshot.<\/p>\n<p>In the assignment list, choose <strong>All Products<\/strong> and save changes.<\/p>\n<p>This is not necessary to use the same product layout for all products. You can assign different layouts to the specific product as per your need.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Products-Layout-4.png&#8221; title_text=&#8221;Products-Layout-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Products-Layout-5.png&#8221; title_text=&#8221;Products-Layout-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;shopLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Shop<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Shop Layout<\/h3>\n<p><strong>To import all the shop layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>Shop.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/shop.png&#8221; title_text=&#8221;shop&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>Shop.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/shop-2.png&#8221; title_text=&#8221;shop-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the Shop Layouts in your Divi Theme Builder.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/shop-3.png&#8221; title_text=&#8221;shop-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the shop product layout<\/h3>\n<p>If you want to import a specific shop layout then move to the shop file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific shop layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Shop-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a Shop Page Layout move to one of the shop page layouts and click on the <strong>Setting<\/strong> icon of the template, assign that to Shop pages, and save changes.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/shop-4.png&#8221; title_text=&#8221;shop-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/shop-5.png&#8221; title_text=&#8221;shop-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;checkoutLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Checkout<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Checkout Layout<\/h3>\n<p><strong>To import all the checkout layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>Checkout.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/checkout.png&#8221; title_text=&#8221;checkout&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>Checkout.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/checkout-2.png&#8221; title_text=&#8221;checkout-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the Checkout Layouts in your Divi Theme Builder.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/checkout-3.png&#8221; title_text=&#8221;checkout-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the specific checkout layout<\/h3>\n<p>If you want to import a specific checkout layout then move to the checkout file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific checkout layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Checkout-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a checkout layout, choose any checkout layout, click on the <strong>Settings<\/strong> icon of the template, assign that to the checkout page and save changes.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/checkout-4.png&#8221; title_text=&#8221;checkout-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/checkout-5.png&#8221; title_text=&#8221;checkout-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;cartLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Cart<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Cart Layout<\/h3>\n<p><strong>To import all the Cart layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>Cart.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Cartl.png&#8221; title_text=&#8221;Cartl&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>Cart.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Cartl-2.png&#8221; title_text=&#8221;Cartl-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the Cart Layouts in your Divi Theme Builder.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Cartl-3.png&#8221; title_text=&#8221;Cartl-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the Cart layout<\/h3>\n<p>If you want to import a specific cart layout then move to the Cart file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific shop layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Cart-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a cart layout choose any cart layout, click on the <strong>Setting<\/strong> icon of the template, assign that to cart pages and save changes.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Cartl-4.png&#8221; title_text=&#8221;Cartl-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/Cartl-5.png&#8221; title_text=&#8221;Cartl-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;blogLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Blog<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Blog Layout<\/h3>\n<p><strong>To import all the Blog layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>Blog.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/blogl.png&#8221; title_text=&#8221;blogl&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>Blog.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/blogl2.png&#8221; title_text=&#8221;blogl2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the Blog Layouts in your Divi Theme Builder.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/blogl3.png&#8221; title_text=&#8221;blogl3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the specific Blog layout<\/h3>\n<p>If you want to import a specific blog layout then move to the blog file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific blog layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Blog -01.json<\/li>\n<li>Blog -02.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a blog layout, choose any blog layout, click on the <strong>Settings<\/strong> icon of the template, assign that to the blog page and save changes.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/blogl4.png&#8221; title_text=&#8221;blogl4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/blogl5.png&#8221; title_text=&#8221;blogl5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;postLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Posts<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the all post Layout<\/h3>\n<p><strong>To import all the post layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>all-post.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/post.png&#8221; title_text=&#8221;post&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>all-post.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/post-2.png&#8221; title_text=&#8221;post-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the post Layouts in your Divi Theme Builder.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/post-3.png&#8221; title_text=&#8221;post-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the all post layout<\/h3>\n<p>If you want to import a specific post layout then move to the post file that you have in <strong>supplementary-files.zip<\/strong> and choose the specific shop layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>Post-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a all post layout choose any post layout, click on the <strong>Setting<\/strong> icon of the template, assign that to all post pages and save changes.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/post-4.png&#8221; title_text=&#8221;post-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/post-5.png&#8221; title_text=&#8221;post-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;404Layouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text module_id=&#8221;404Layouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>404<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the 404 Layout<\/h3>\n<p><strong>To import all the 404 layouts at once<\/strong><\/p>\n<ol>\n<li>Extract the main product file butterfly-layouts.zip to get the <strong>404.json<\/strong> file.<\/li>\n<li>Import the file into the <strong>Divi Theme Builder<\/strong>.<\/li>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Portability Icon<\/strong>, placed on the top right side of the window.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/404-1.png&#8221; title_text=&#8221;404&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on the top right portability icon<\/h4>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]5. Go to <strong>Import tab &gt;&gt; Choose File<\/strong> and browse for the <strong>404.json<\/strong>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/404-2.png&#8221; title_text=&#8221;404-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]6. Click on <strong>Import Divi Theme Builder Templates<\/strong>.<\/p>\n<p>Now you have all the 404 Layouts in your Divi Theme Builder.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/404-3.png&#8221; title_text=&#8221;404-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>To import the all 404 layout<\/h3>\n<p>If you want to import a specific 404 layout then move to the 404 file that you have in supplementary-files.zip and choose the specific 404 layout\u2019s JSON file to import in the Divi Theme Builder and follow the same process as above.<\/p>\n<ul>\n<li>404-01.json<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Layout Assignment<\/h3>\n<p>To assign a 404 layout choose any 404 layout, click on the <strong>Setting<\/strong> icon of the template, assign that to 404 pages and save changes.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/404-4.png&#8221; title_text=&#8221;404-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/404-5.png&#8221; title_text=&#8221;404-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;pageLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Pages<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h3>Steps to Import the specific page layout<\/h3>\n<ul>\n<li>Extract the main product file <strong>butterfly-layouts.zip <\/strong>to get the <strong>Page-Name.json file<\/strong><\/li>\n<li>Then on WordPress<strong> <\/strong>Dashboard go to <strong>Divi<\/strong>&gt;&gt;<strong>Divi Library.<\/strong><\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; custom_margin=&#8221;||0px||false|false&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h3>Page layouts<\/h3>\n<ul>\n<li>My Account Page.json<\/li>\n<li>Home\n<ul>\n<li>Home Page 01.json<\/li>\n<li>Home Page 02.json<\/li>\n<li>Home Page 03.json<\/li>\n<li>Home Page 04.json<\/li>\n<li>Home Page 05.json<\/li>\n<li>Home Page 06.json<\/li>\n<li>Home Page 07.json<\/li>\n<li>Home Page 08.json<\/li>\n<\/ul>\n<\/li>\n<li>About Us\n<ul>\n<li>About Page 01.json<\/li>\n<li>About Page 02.json<\/li>\n<\/ul>\n<\/li>\n<li>Contact Us\n<ul>\n<li>Contact Page 01.json<\/li>\n<li>Contact Page 02.json<\/li>\n<\/ul>\n<\/li>\n<li>Others\n<ul>\n<li>FAQs.json<\/li>\n<li>Coming Soon.json<\/li>\n<li>404.json<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-1.png&#8221; title_text=&#8221;sections&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<ul>\n<li>Click on <strong>Import and Export<\/strong> tab.<\/li>\n<li>On the pop-up window go to the <strong>Import tab<\/strong> and browse the \u201c<strong>Page-name.json<\/strong>\u201d file from your computer and click on the <strong>Import Divi Builder Layouts<\/strong> button.<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-2.png&#8221; title_text=&#8221;sections-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;24px&#8221; header_2_line_height=&#8221;1.3em&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h2>How to add Butterfly Page Layouts on page from library<\/h2>\n<p>To add the Butterfly Page layouts on the page from the Divi Library follow the instructions described below.<\/p>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; header_5_line_height=&#8221;1.5em&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<ol>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Pages &gt;&gt; All Pages &gt;&gt; Your Page (ex: my account, about, contact, FAQs, etc.)<\/strong>.<\/li>\n<li>Edit the specific page with <strong>DIVI<\/strong><\/li>\n<li>Click on the <strong>Edit With Divi<\/strong><\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/page.png&#8221; title_text=&#8221;page&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; text_orientation=&#8221;center&#8221; hover_enabled=&#8221;0&#8243; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h4>Click on Edit with DIVI<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/page2.png&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; title_text=&#8221;page2&#8243; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on Add From Library<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/page3.png&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; title_text=&#8221;page3&#8243; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Here you can select the section you desired.<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/page4.png&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; title_text=&#8221;page4&#8243; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h4>Here you can view the live demo and edit the page layouts as well as your requirement.<\/h4>\n<p>[\/et_pb_text][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;24px&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; custom_margin=&#8221;||0.5rem||false|false&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Final Output:<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/page5.png&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; title_text=&#8221;page5&#8243; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;sectionsLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Sections<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Divi Library Layouts<\/h3>\n<ul>\n<li>Extract the main product file <strong>butterfly-layouts.zip <\/strong>to get the <strong>Sections.json file<\/strong><\/li>\n<li>Then on WordPress<strong> <\/strong>Dashboard go to <strong>Divi<\/strong>&gt;&gt;<strong>Divi Library.<\/strong><\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-1.png&#8221; title_text=&#8221;sections&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<ul>\n<li>Click on <strong>Import and Export<\/strong> tab.<\/li>\n<li>On the pop-up window go to the <strong>Import tab<\/strong> and browse the \u201c<strong>SECTIONS.json<\/strong>\u201d file from your computer and click on the <strong>Import Divi Builder Layouts<\/strong> button.<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-2.png&#8221; title_text=&#8221;sections-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-3.png&#8221; title_text=&#8221;sections-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;24px&#8221; header_2_line_height=&#8221;1.3em&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>How to add Butterfly Sections on page from library<\/h2>\n<p>To add the Butterfly Sections on the page from the Divi Library follow the instructions described below.<\/p>\n<p>Add a new page or edit the existing page &gt;&gt; Use the Divi Builder &gt;&gt; In wireframe mode of the page click on blue symbol for adding the new section.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-4.png&#8221; title_text=&#8221;sections-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on Add From Library<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-5.png&#8221; title_text=&#8221;sections-5&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Here you can select the section you desired.<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-6.png&#8221; title_text=&#8221;sections-6&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Here you can view the live demo and edit the section as well as your requirement.<\/h4>\n<p>[\/et_pb_text][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;24px&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; custom_margin=&#8221;||0.5rem||false|false&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Final Output:<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-7.png&#8221; title_text=&#8221;sections-7&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;headerLayouts&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_color=&#8221;rgba(61,61,61,0.025)&#8221; custom_padding=&#8221;2.5rem|2.5rem|2.5rem|2.5rem|true|true&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Header &#038; Footer<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h3>Steps to Import the Header or Footer Layouts<\/h3>\n<ul>\n<li>Extract the main product file <strong>butterfly-layouts.zip <\/strong>to get the <strong>Header.json or Footer.json<\/strong><strong>\u00a0file<\/strong><\/li>\n<li>Then on WordPress<strong> <\/strong>Dashboard go to <strong>Divi<\/strong>&gt;&gt;<strong>Divi Library.<\/strong><\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-1.png&#8221; title_text=&#8221;sections&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<ul>\n<li>Click on <strong>Import and Export<\/strong> tab.<\/li>\n<li>On the pop-up window go to the <strong>Import tab<\/strong> and browse the \u201c<strong>footer.json<\/strong>\u201d file from your computer and click on the <strong>Import Divi Builder Layouts<\/strong> button.<\/li>\n<\/ul>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/sections-2.png&#8221; title_text=&#8221;sections-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;24px&#8221; header_2_line_height=&#8221;1.3em&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>How to add Butterfly Header or Footer on page from library<\/h2>\n<p>To add the Butterfly Header \/ Footer on the page from the Divi Library follow the instructions described below.<\/p>\n<ol>\n<li>To do this move to your site <strong>Dashboard &gt;&gt; Divi &gt;&gt; Theme Builder<\/strong>.<\/li>\n<li>Click on the <strong>Global Header \/ Footer or Add Custom Header \/ Footer<\/strong>, of the templates.<\/li>\n<\/ol>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header.png&#8221; title_text=&#8221;header&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-2.png&#8221; title_text=&#8221;header-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-2-1.png&#8221; title_text=&#8221;header-2-1&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-3.png&#8221; title_text=&#8221;header-3&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Click on Add From Library<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-6.png&#8221; title_text=&#8221;header-6&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Here you can select the section you desired.<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-7.png&#8221; title_text=&#8221;header-7&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; hover_enabled=&#8221;0&#8243; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;][\/et_pb_image][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; hover_enabled=&#8221;0&#8243; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221; sticky_enabled=&#8221;0&#8243;]<\/p>\n<h4>Here you can view the live demo and edit the header \/ footer as well as your requirement.<\/h4>\n<p>[\/et_pb_text][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_4_font=&#8221;|600|||||||&#8221; header_4_font_size=&#8221;24px&#8221; header_4_line_height=&#8221;1.3em&#8221; text_orientation=&#8221;center&#8221; custom_margin=&#8221;||0.5rem||false|false&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h4>Final Output:<\/h4>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/header-4.png&#8221; title_text=&#8221;header-4&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][et_pb_row_inner module_id=&#8221;missingSidebar&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_margin=&#8221;||||false|false&#8221; custom_padding=&#8221;2.5rem||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; locked=&#8221;off&#8221; collapsed=&#8221;on&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_column_inner saved_specialty_column_type=&#8221;2_3&#8243; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; background_enable_color=&#8221;off&#8221; custom_padding=&#8221;||||false|false&#8221; border_radii=&#8221;on|15px|15px|15px|15px&#8221; global_colors_info=&#8221;{}&#8221;][et_pb_text _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_2_font=&#8221;|600|||||||&#8221; header_2_font_size=&#8221;32px&#8221; custom_margin=&#8221;||10px||false|false&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<h2>Missing sidebar content in the layout?<\/h2>\n<p>[\/et_pb_text][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; header_4_font=&#8221;|600|||||||&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]While using a template that includes a sidebar, to make the sidebar visible on the page we need to first add widgets in it.[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/widget-2.png&#8221; title_text=&#8221;widget-2&#8243; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][et_pb_text ul_item_indent=&#8221;2rem&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; header_3_font=&#8221;|600|||||||&#8221; header_3_font_size=&#8221;20px&#8221; header_3_line_height=&#8221;1.3em&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;]<\/p>\n<p>In order to add widgets navigate to the site <strong>Dashboard &gt;&gt; Appearance &gt;&gt; Widgets &gt;&gt; Sidebar &gt;&gt; Add the widgets here &gt;<\/strong>&gt; Click on Update.<\/p>\n<p>[\/et_pb_text][et_pb_image src=&#8221;https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-content\/uploads\/2022\/12\/widget.png&#8221; title_text=&#8221;widget&#8221; align=&#8221;center&#8221; _builder_version=&#8221;4.19.3&#8243; _module_preset=&#8221;default&#8221; border_radii=&#8221;on|12px|12px|12px|12px&#8221; locked=&#8221;off&#8221; global_colors_info=&#8221;{}&#8221;][\/et_pb_image][\/et_pb_column_inner][\/et_pb_row_inner][\/et_pb_column][\/et_pb_section]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>File structure Installation Products Shop Checkout Cart My Account Pages Sections Header &amp; Footer Missing sidebar content in the layout? File structureYou can download the product from the My Account &#8211;&gt; Download After the purchase of the Butterfly WooCommerce Divi layouts, you\u2019ll get the following file. butterfly-divi-layouts-x.x.zip (where x.x is a version number) Extract the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_et_pb_use_builder":"on","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"_links":{"self":[{"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/pages\/1886"}],"collection":[{"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/comments?post=1886"}],"version-history":[{"count":140,"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/pages\/1886\/revisions"}],"predecessor-version":[{"id":2266,"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/pages\/1886\/revisions\/2266"}],"wp:attachment":[{"href":"https:\/\/ecommerce-app.imw3.com\/cosmetic\/wp-json\/wp\/v2\/media?parent=1886"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}