{"id":3114,"date":"2017-09-15T08:02:05","date_gmt":"2017-09-15T08:02:05","guid":{"rendered":"https:\/\/ombra.pikarthouse.com\/documentation\/?page_id=3114"},"modified":"2018-03-10T10:07:55","modified_gmt":"2018-03-10T10:07:55","slug":"woocommerce","status":"publish","type":"page","link":"https:\/\/ombra.pikarthouse.com\/documentation\/miscellaneous\/woocommerce\/","title":{"rendered":"WooCommerce"},"content":{"rendered":"<p>Your shopping experience should be fun and OMBRA totally agrees with you. This is why, the theme is compatible with the most well-known ecommerce plugin in WordPress market\u00a0\u2014 <strong><a href=\"https:\/\/woocommerce.com\/\" target=\"_blank\" rel=\"noopener\"><em>WooCommerce<\/em><\/a><\/strong>.<\/p>\n<div class=\"pikode pikode--cols cols \" style=\"margin-left: -36px;\" ><div class=\"pikode--column pikode--column--8\" style=\"border-left-width: 36px;\"><p>WooCommerce comes with plethora of sophisticated options that you could explore by using the <em><a href=\"https:\/\/docs.woocommerce.com\/\" target=\"_blank\" rel=\"noopener\">plugin documentation<\/a>\u00a0<\/em>or by experimenting them directly in <em>WordPress Dashboard\u00a0\u2192 WooCommerce<\/em>.<\/p>\n<p>In this chapter, we will focus your attention just on elements that OMBRA brings up to enhance your shopping experience beyond what WooCommerce could offer by default. In order to do so, go to <em>Appearance \u2192 Customize\u00a0\u2192 WooCommerce<\/em>.<\/p><\/div><div class=\"pikode--column pikode--column--4\" style=\"border-left-width: 36px;\">\n<div \t\tclass=\"pikode pikode--row  summary-box\" style=\"padding: 0px 0px 36px 0px; margin: 0px -36px 0px 0px;\" >\n\t<div class=\"pikode--row__wrapper pikode--row--height-auto\"  >\n\t\t<div class=\"pikode--row-inner\">\n\n\t\t\t\n\t\t\t\t<div class=\"pikode--row__background\">\n\n\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"color-overlay\" style=\"opacity: 1; background-color: #4b917d;\" ><\/div>\n\t\t\t\t\t\n\t\t\t\t<\/div>\n\n\t\t\t\n\t\t\t<div class=\"pikode--row__content pikode--row__content--skin-light\"\n\t\t\t\tstyle=\"vertical-align: middle;\" >\n\n\t\t\t\t<div class=\"pikode--row__content__wrapper pikode--row__content--center\"  >\n\t\t\t\t\t<div class=\"pikode--row__content-inner pikode--row--width-auto\" style=\"padding: 0px 30px 0px 30px;\" >\n\t\t\t\t\t\t<div class=\"pikode pikode--custom-content  custom-content--28\" style=\"font-weight: 700; line-height: 1.0; text-decoration: none; color: #ffffff; padding: 36px 0px 0px 0px;\"><p>Summary<\/p><\/div>\n<p><a href=\"#theme-options\">Theme Options<\/a><br \/>\n<a href=\"#single-product\">Single Product<\/a><br \/>\n<a href=\"#products-shortcode\">Products Shortcode<\/a><\/p>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\n\t\t\t<\/div>\n\n\t\t<\/div>\n\t<\/div>\n<\/div>\n<\/div><\/div>\n\n<div id=\"theme-options\"\t\tclass=\"pikode pikode--row \"  >\n\t<div class=\"pikode--row__wrapper pikode--row--height-auto\"  >\n\t\t<div class=\"pikode--row-inner\">\n\n\t\t\t\n\t\t\t<div class=\"pikode--row__content pikode--row__content--skin-none\"\n\t\t\t\tstyle=\"vertical-align: middle;\" >\n\n\t\t\t\t<div class=\"pikode--row__content__wrapper pikode--row__content--center\"  >\n\t\t\t\t\t<div class=\"pikode--row__content-inner pikode--row--width-auto\"  >\n\t\t\t\t\t\t<div class=\"pikode pikode--custom-content  custom-content--28\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #4b917d; padding: 24px 0px 0px 0px;\"><p>Theme Options<\/p><\/div>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\n\t\t\t<\/div>\n\n\t\t<\/div>\n\t<\/div>\n<\/div>\n\n<p>The features from Theme Options affect globally the Shop overall experience. Let&#8217;s explore them:<\/p>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: underline; color: #959595; padding: 12px 0px 0px 0px;\"><p>Shop Page<\/p><\/div>\n<ul>\n<li><strong>Display options\u00a0<\/strong>\u2014\u00a0the options below affect just the look of shop page\n<ul>\n<li><strong>Display type\u00a0<\/strong>\u2014 choose between 6 types of cards: <em>Shadow<\/em>, <em>Move<\/em>, <em>Fade<\/em>,\u00a0<em>Rising, Plain <\/em>or<em> List<\/em>. Read more about <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#cards\" target=\"_blank\" rel=\"noopener\"><em>cards<\/em><\/a>.<\/li>\n<li><strong>*Transparency\u00a0<\/strong>\u2014 overlay color transparency <em>while hovering by mouse<\/em>. The overlay color is set up in Theme Options when choosing <em>General \u2192\u00a0Colors \u2192\u00a0Feature color.<\/em>\u00a0<em>It affects\u00a0just <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#move\" target=\"_blank\" rel=\"noopener\">Move<\/a> and <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#fade\" target=\"_blank\" rel=\"noopener\">Fade<\/a>\u00a0Types<\/em><\/li>\n<li><strong>Columns number\u00a0<\/strong>\u2014 the way products on Shop Page are displayed; choose how many columns of products to showcase:\u00a01, 2, 3, 4, 5 or 6<\/li>\n<li><strong>Columns spacing\u00a0<\/strong>\u2014 enter the spacing between columns, <em>measured in pixels<\/em><\/li>\n<\/ul>\n<\/li>\n<li><strong>Categories filter\u00a0<\/strong>\u2014 it refers to products categories filter on shop page\n<ul>\n<li><strong>Position\u00a0<\/strong>\u2014 position the filter either on <em>right, center<\/em> or <em>left<\/em> side of the shop page<\/li>\n<\/ul>\n<\/li>\n<li><strong>Result Count &amp; Product Sorting <\/strong>\u2014 they appear above the products on shop page<\/li>\n<li><strong>Full width\u00a0<\/strong>\u2014\u00a0shop page takes screen full width size<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-3230 size-full\" src=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/ShopPage.jpg\" alt=\"\" width=\"1000\" height=\"750\" srcset=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/ShopPage.jpg 1000w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/ShopPage-300x225.jpg 300w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/ShopPage-768x576.jpg 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/p>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: underline; color: #959595; padding: 12px 0px 0px 0px;\"><p>Product<\/p><\/div>\n<ul>\n<li><b>Spacing\u00a0<\/b>represents\u00a0the amount of space <em>Product elements<\/em>\u00a0fills up from the total width\u00a0of browser window. When\u00a0adding\u00a0spacing, the width of content is reduced\u00a0with a certain amount of pixels, either by left or by right side.\n<ul>\n<li><strong>left <\/strong>\u2014\u00a0add spacing to the left side of Product Content<\/li>\n<li><strong>right <\/strong>\u2014 add spacing to the right side of Product Content<\/li>\n<\/ul>\n<\/li>\n<li><strong>V<\/strong><strong>isibility<\/strong> section helps you to\u00a0decide which elements of Single Product will be visible to visitors. See more about\u00a0<a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/theme-options\/content\/#visibility-items\" target=\"_blank\" rel=\"noopener\"><em>visibility items.<\/em><\/a> It has the following options:\n<ul>\n<li><strong>Related Products\u00a0<\/strong>\u2014 located almost at the bottom of\u00a0Product, there are showcased products that has the same categories as the actual\u00a0one. Find out more about <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/managing-content\/layout-structure\/#related-items\" target=\"_blank\" rel=\"noopener\"><em>Related Items<\/em><\/a>.<\/li>\n<li><strong>Navigation\u00a0<\/strong>\u2014 located at the bottom of Product page,\u00a0the link is conceived to redirect the visitor to Shop page. It includes the <strong><em>Previous Product\u00a0<\/em><\/strong>link, the <strong><em>Next Product\u00a0<\/em><\/strong>link and <em><strong>All Products\u00a0<\/strong><\/em>link<\/li>\n<\/ul>\n<\/li>\n<li><strong>Related Products\u00a0<\/strong>\u2014\u00a0the options below take effect just on Single Product page\n<ul>\n<li><strong>Display type\u00a0<\/strong>\u2014 choose between 6 types of cards: <em>Shadow<\/em>, <em>Move<\/em>, <em>Fade<\/em>,\u00a0<em>Rising, Plain <\/em>or<em> List<\/em>. Read more about <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#cards\" target=\"_blank\" rel=\"noopener\"><em>cards<\/em><\/a>.<\/li>\n<li><strong>*Transparency\u00a0<\/strong>\u2014 overlay color transparency <em>while hovering by mouse<\/em>. The overlay color is set up in Theme Options when choosing <em>General \u2192\u00a0Colors \u2192\u00a0Feature color.<\/em>\u00a0<em>It affects\u00a0just <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#move\" target=\"_blank\" rel=\"noopener\">Move<\/a> and <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#fade\" target=\"_blank\" rel=\"noopener\">Fade<\/a>\u00a0Types<\/em><\/li>\n<li><strong>Columns number\u00a0<\/strong>\u2014 the way Related Products on Single Product Page are displayed; choose how many columns of products to showcase:\u00a01, 2, 3, 4, 5 or 6<\/li>\n<li><strong>Columns spacing\u00a0<\/strong>\u2014 enter the spacing between columns, <em>measured in pixels<\/em><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: underline; color: #959595; padding: 12px 0px 0px 0px;\"><p>Header<\/p><\/div>\n<ul>\n<li><strong>Menu Icon<\/strong>\u00a0\u2014 the Shopping Cart icon located in\u00a0<em>Main menu<\/em>\u00a0of theme\n<ul>\n<li><strong>Font size<\/strong>\u00a0\u2014\u00a0Cart icon could have a certain font-size,\u00a0measured\u00a0<em>in pixels<\/em><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n\n<div id=\"single-product\"\t\tclass=\"pikode pikode--row \"  >\n\t<div class=\"pikode--row__wrapper pikode--row--height-auto\"  >\n\t\t<div class=\"pikode--row-inner\">\n\n\t\t\t\n\t\t\t<div class=\"pikode--row__content pikode--row__content--skin-none\"\n\t\t\t\tstyle=\"vertical-align: middle;\" >\n\n\t\t\t\t<div class=\"pikode--row__content__wrapper pikode--row__content--center\"  >\n\t\t\t\t\t<div class=\"pikode--row__content-inner pikode--row--width-auto\"  >\n\t\t\t\t\t\t<div class=\"pikode pikode--custom-content  custom-content--28\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #4b917d; padding: 24px 0px 0px 0px;\"><p><a href=\"https:\/\/ombra.pikarthouse.com\/main\/product\/fusion-chair-by-boconcept\/\" target=\"_blank\" rel=\"noopener\"><span style=\"color: #4b917d;\">Single Product<\/span><\/a><\/p><\/div>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\n\t\t\t<\/div>\n\n\t\t<\/div>\n\t<\/div>\n<\/div>\n\n<p>Beyond General Options and Masonry Archive Options that are well-described and explained in <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/managing-content\/general-options\/\" target=\"_blank\" rel=\"noopener\"><em>General Options chapter<\/em><\/a>, Single Product page features one more panel of options that is called <em><strong>Product Options<\/strong><\/em>:<\/p>\n<ul>\n<li><strong>Product Image &amp; Gallery\u00a0<\/strong>\u2014\u00a0you can enable\/disable the Product Image &amp; Gallery on Single Product Page<\/li>\n<li><strong>Full width\u00a0<\/strong>\u2014 Product Header takes screen full width size<\/li>\n<li><strong>Hero Header\u00a0<\/strong>\u2014 \u00a0it represent the element you could\u00a0<strong><em>emphasize your product\u00a0<\/em><em>with<\/em><\/strong> and\u00a0<strong><em>make it unique<\/em><\/strong>. You can add any type of content here \u2014 from media items to shortcodes\u00a0\u2014 the perfect opportunity to unleash your shop creativity.<\/li>\n<li><strong>Details position\u00a0<\/strong>\u2014\u00a0choose the position for Product Details. It works the same way as <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/managing-projects\/#project-details\" target=\"_blank\" rel=\"noopener\"><strong><em>Project Details<\/em><\/strong><\/a>.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3249\" src=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/Shop-Single_Product.jpg\" alt=\"\" width=\"1200\" height=\"900\" srcset=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/Shop-Single_Product.jpg 1200w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/Shop-Single_Product-300x225.jpg 300w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/Shop-Single_Product-768x576.jpg 768w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2017\/09\/Shop-Single_Product-1024x768.jpg 1024w\" sizes=\"auto, (max-width: 1200px) 100vw, 1200px\" \/><\/p>\n\n<div id=\"products-shortcode\"\t\tclass=\"pikode pikode--row \"  >\n\t<div class=\"pikode--row__wrapper pikode--row--height-auto\"  >\n\t\t<div class=\"pikode--row-inner\">\n\n\t\t\t\n\t\t\t<div class=\"pikode--row__content pikode--row__content--skin-none\"\n\t\t\t\tstyle=\"vertical-align: middle;\" >\n\n\t\t\t\t<div class=\"pikode--row__content__wrapper pikode--row__content--center\"  >\n\t\t\t\t\t<div class=\"pikode--row__content-inner pikode--row--width-auto\"  >\n\t\t\t\t\t\t<div class=\"pikode pikode--custom-content  custom-content--28\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #4b917d; padding: 24px 0px 0px 0px;\"><p><span style=\"color: #4b917d;\">Products<\/span><\/p><\/div>\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\n\t\t\t<\/div>\n\n\t\t<\/div>\n\t<\/div>\n<\/div>\n\n<p><strong>Products\u00a0<\/strong>represent\u00a0a powerful and flexible shortcode that allows you to\u00a0showcase creatively the content, initialized before in Products section. It consists of two parts <em>(as general principle, it is quite similar to <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/shortcodes\/media-elements\/#projects\" target=\"_blank\" rel=\"noopener\">Projects Shortcodes<\/a>):<\/em><\/p>\n<ul>\n<li><strong>information data<\/strong> \u2014 it\u00a0is connected with Products Post Type, where Products Shortcode\u00a0takes data from, like\u00a0Title and Subtitle (represented by Reviews and Price)<\/li>\n<li><strong>display data<\/strong> \u2014 it\u00a0is composed of own options that allows to choose what type of content to\u00a0show and how to display it<\/li>\n<\/ul>\n<p>The Products options are classified in two main groups:<\/p>\n<ul>\n<li><strong>General Properties<\/strong><em>\u00a0\u2014 <\/em>common for almost all types of\u00a0Products<\/li>\n<li><strong>Display\u00a0Typologies<\/strong><em> \u2014 <\/em>depending on Products type, these options are different<\/li>\n<\/ul>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: underline; color: #959595; padding: 12px 0px 0px 0px;\"><p>General Properties<\/p><\/div>\n<ul>\n<li><strong>Products Categories<\/strong>\u00a0\u2014\u00a0filter products by categories; leave empty to select all products<\/li>\n<li><strong>Items\u00a0<\/strong>\u2014\u00a0you can choose specific products to display, by entering their ID&#8217;s, separated by comma. The ID could be taken from Product URL<\/li>\n<\/ul>\n<p style=\"padding-left: 30px;\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-3788\" src=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2018\/03\/id_product.jpg\" alt=\"\" width=\"700\" height=\"334\" srcset=\"https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2018\/03\/id_product.jpg 768w, https:\/\/ombra.pikarthouse.com\/documentation\/wp-content\/uploads\/sites\/5\/2018\/03\/id_product-300x143.jpg 300w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/p>\n<ul>\n<li><strong>Order by<\/strong>\u00a0\u2014 products can be organized by\u00a0<em>Date<\/em>, <em>Title<\/em>, <em>Author<\/em>, <em>ID<\/em>, <em>Last modified date<\/em> and <em>Parent ID<\/em><\/li>\n<li><strong>Order\u00a0<\/strong>\u2014\u00a0choose between <em>Ascending<\/em> and <em>Descending<\/em> order<\/li>\n<li><strong>Number of items<\/strong>\u00a0\u2014\u00a0enter the number if products to display<\/li>\n<li><strong>CSS class<\/strong>\u00a0\u2014 in case there is a need\u00a0to add more style rules<\/li>\n<\/ul>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: underline; color: #959595; padding: 12px 0px 0px 0px;\"><p>Display Typologies<\/p><\/div>\n<p>There are three\u00a0ways the Products will showcase on a site page, depending on your needs <em>(for more visual details, please <a href=\"#display-typologies\">see<\/a>)<\/em>:<\/p>\n<ul>\n<li><strong>Masonry<\/strong> \u2014\u00a0a grid with multiple columns<\/li>\n<li><strong>Slider\u00a0<\/strong>\u2014\u00a0a single item showcased at a time, embellished with smooth effects.\u00a0Read more about <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#sliders\" target=\"_blank\" rel=\"noopener\"><em>sliders<\/em><\/a>.<\/li>\n<li><strong>Carousel\u00a0<\/strong>\u2014 similar to slider, but carousel is able to showcase more than one items at one time.\u00a0Read more about <a href=\"https:\/\/ombra.pikarthouse.com\/documentation\/portfolio\/create-exquisite-items\/#carousels\" target=\"_blank\" rel=\"noopener\"><em>carousels<\/em><\/a>.<\/li>\n<\/ul>\n<div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #ffffff; padding: 12px 12px 1px 12px; margin: 0px 0px -18px 0px; background-color: #4b917d;\"><p style=\"text-align: center;\">Common Options<\/p><\/div>\n<div class=\"pikode pikode--custom-content with-borders custom-content--14\" style=\"font-weight: 400; line-height: 1.68; text-decoration: none; color: #636363; padding: 24px 18px 0px 0px; border-width: 3px 0px 3px 0px; border-color: #ffffff; background-color: #f1f1f1;\"><ul>\n<li><strong>Overlay color\u00a0<\/strong>\u2014\u00a0color layer that covers the product when possible (exceptions: Shadow, Rising, Plain and List cards)<\/li>\n<li><strong>Overlay color transparency<\/strong> \u2014\u00a0color layer transparency (100% means the color is transparent)<\/li>\n<li><strong>Animation<\/strong>\u00a0\u2014\u00a0the way items appear on page while scrolling<\/li>\n<li><strong>Animation delay<\/strong> \u2014 set a delay time for animation, in <em>seconds<\/em> \u2014\u00a0<em>Minimum: 0 seconds, Maximum: 3 seconds<\/em><\/li>\n<\/ul><\/div>\n<div class=\"pikode pikode--cols cols \" style=\"margin-left: -3px;\" ><div class=\"pikode--column pikode--column--4\" style=\"border-left-width: 3px;\"><div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #ffffff; padding: 12px 12px 1px 12px; margin: 0px 0px -18px 0px; background-color: #4b917d;\"><p style=\"text-align: center;\">Masonry<\/p><\/div>\n<div class=\"pikode pikode--custom-content with-borders custom-content--14\" style=\"font-weight: 400; line-height: 1.68; text-decoration: none; color: #636363; padding: 24px 18px 0px 0px; border-width: 3px 0px 3px 0px; border-color: #ffffff; background-color: #f1f1f1;\"><ul>\n<li><strong>Categories filter<\/strong>\u00a0\u2014\u00a0positioned inside <em>General Properties<\/em> panel because of technical reasons, it helps to sort products based on categories: <em>Main Categories<\/em> shows just the categories without its child-categories, if comparing to <em>All Categories<\/em><\/li>\n<li><strong>Display<\/strong>\u00a0\u2014\u00a0the way products are displayed:\u00a0<em>Shadow, Move, Fade, Rising<\/em><em>, Plain, List<\/em><\/li>\n<li><strong>Columns<\/strong>\u00a0\u2014\u00a0how many products columns are displayed (1, 2, 3, 4 or 6)<\/li>\n<li><strong>Columns spacing<\/strong> \u2014\u00a0spacing between columns (pixels)<\/li>\n<\/ul><\/div><\/div><div class=\"pikode--column pikode--column--4\" style=\"border-left-width: 3px;\"><div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #ffffff; padding: 12px 12px 1px 12px; margin: 0px 0px -18px 0px; background-color: #4b917d;\"><p style=\"text-align: center;\">Slider<\/p><\/div>\n<div class=\"pikode pikode--custom-content with-borders custom-content--14\" style=\"font-weight: 400; line-height: 1.68; text-decoration: none; color: #636363; padding: 24px 18px 0px 0px; border-width: 3px 0px 3px 0px; border-color: #ffffff; background-color: #f1f1f1;\"><ul>\n<li><strong>Height<\/strong>\u00a0\u2014\u00a0slider height in pixels<\/li>\n<li><strong>Full-height<\/strong>\u00a0\u2014\u00a0slider height takes Window full-height. It overwrites height\u00a0specified at <em>Height<\/em> option mentioned before<\/li>\n<li><strong>Image scaling<\/strong>\u00a0\u2014\u00a0the way images scale on slider. Its two options have specific behaviours: \u00a0<em>Fill<\/em> &#8211; recommended for landscape images and\u00a0<em>Fit<\/em> &#8211; recommended for portrait images<\/li>\n<li><strong>Scroll down arrow<\/strong>\u00a0\u2014 useful when you use a fullscreen slider and you want to point out that below slider there is more content to see<\/li>\n<li><b>Title font-size<\/b> \u2014\u00a0set a custom font-size for Title you already specified in Products Post Type<\/li>\n<li><strong>Subtitle font-size<\/strong>\u00a0\u2014 set a custom font-size for Subtitle you already specified in Products Post Type<\/li>\n<li><strong>Show content<\/strong>\u00a0\u2014\u00a0content includes any text element slider might showcase: title, subtitle, description or button<\/li>\n<li><strong>Delay content<\/strong>\u00a0\u2014\u00a0timing delay before content shows up\u00a0after slide appearance\u00a0\u2014\u00a0<em>Minimum: 0 seconds, Maximum: 3 seconds<\/em><\/li>\n<li><strong>Parallax effect\u00a0<\/strong>\u2014 smooth scrolling effect\u00a0applied to\u00a0slider images<\/li>\n<\/ul><\/div><\/div><div class=\"pikode--column pikode--column--4\" style=\"border-left-width: 3px;\"><div class=\"pikode pikode--custom-content  custom-content--21\" style=\"font-weight: 700; letter-spacing: -1px; line-height: 1.68; text-decoration: none; color: #ffffff; padding: 12px 12px 1px 12px; margin: 0px 0px -18px 0px; background-color: #4b917d;\"><p style=\"text-align: center;\">Carousel<\/p><\/div>\n<div class=\"pikode pikode--custom-content with-borders custom-content--14\" style=\"font-weight: 400; line-height: 1.68; text-decoration: none; color: #636363; padding: 24px 18px 0px 0px; border-width: 3px 0px 3px 0px; border-color: #ffffff; background-color: #f1f1f1;\"><ul>\n<li><strong>Height<\/strong>\u00a0\u2014\u00a0carousel height in pixels<\/li>\n<li><strong>Full-height<\/strong>\u00a0\u2014\u00a0carousel\u00a0height takes Window full-height. It overwrites height\u00a0specified at <em>Height<\/em> option mentioned before<\/li>\n<li><strong>Image scaling<\/strong>\u00a0\u2014 the way images scale on carousel. Its two options have specific behaviours: \u00a0<em>Fill<\/em> &#8211; recommended for landscape images and\u00a0<em>Fit<\/em> &#8211; recommended for portrait images<\/li>\n<li><strong>Scroll down arrow<\/strong>\u00a0\u2014 useful when you use a fullscreen slider and you want to point out that below slider there is more content to see<\/li>\n<li><strong>Slides\u00a0<\/strong>\u2014 how many\u00a0items slides are displayed at a time (3, 5 or 7)<\/li>\n<li><b>Slides spacing<\/b>\u00a0\u2014 spacing between\u00a0slides (pixels)<\/li>\n<\/ul><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Your shopping experience should be fun and OMBRA totally agrees with you. This is why, the theme is compatible with the most well-known ecommerce plugin in WordPress market\u00a0\u2014 WooCommerce. The features from Theme Options affect globally the Shop overall experience. Let&#8217;s explore them: Display options\u00a0\u2014\u00a0the options below affect just the look of shop page Display [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":1663,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3114","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/pages\/3114","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/comments?post=3114"}],"version-history":[{"count":52,"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/pages\/3114\/revisions"}],"predecessor-version":[{"id":3794,"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/pages\/3114\/revisions\/3794"}],"up":[{"embeddable":true,"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/pages\/1663"}],"wp:attachment":[{"href":"https:\/\/ombra.pikarthouse.com\/documentation\/wp-json\/wp\/v2\/media?parent=3114"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}