{"id":29417,"date":"2019-09-09T08:18:59","date_gmt":"2019-09-09T08:18:59","guid":{"rendered":"https:\/\/codex-themes.com\/thegem-elementor\/?page_id=29417"},"modified":"2019-07-04T13:46:45","modified_gmt":"2019-07-04T13:46:45","slug":"product-grids","status":"publish","type":"page","link":"https:\/\/codex-themes.com\/thegem-elementor\/product-grids\/","title":{"rendered":"Product Grids"},"content":{"rendered":"

[vc_row][vc_column][vc_column_text]<\/p>\n

Grid Layouts <\/span><\/div>\n

[\/vc_column_text][gem_divider margin_top=”35″][\/vc_column][\/vc_row][vc_row el_class=”custom-column”][vc_column width=”1\/4″ el_class=”custom-hover”][gem_divider margin_top=”45″][vc_single_image image=”14323″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”https:\/\/codex-themes.com\/thegem-elementor\/starting_page\/themes.php?page=justified-shop”][gem_divider][vc_column_text]<\/p>\n

Justified<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Various number of columns and a bunch of layout settings like gap sizes, highlighted projects etc.<\/p>\n

[\/vc_column_text][gem_button position=”center” style=”outline” size=”tiny” corner=”3″ border=”2″ icon_pack=”elegant” text=”Show Demo” link=”url:https%3A%2F%2Fcodex-themes.com%2Fthegem%2Fstarting_page%2Fthemes.php%3Fpage%3Djustified-shop||target:%20_blank|”][gem_divider margin_top=”40″][\/vc_column][vc_column width=”1\/4″ el_class=”custom-hover”][gem_divider margin_top=”45″][vc_single_image image=”14317″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”https:\/\/codex-themes.com\/thegem-elementor\/masonry-shop\/”][gem_divider][vc_column_text]<\/p>\n

Masonry<\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Lovely masonry grid overview, perfect for different product image proportions. Flexible layout settings.<\/p>\n

[\/vc_column_text][gem_button position=”center” style=”outline” size=”tiny” corner=”3″ border=”2″ icon_pack=”elegant” text=”Show Demo” link=”url:https%3A%2F%2Fcodex-themes.com%2Fthegem%2Fmasonry-shop%2F||target:%20_blank|”][gem_divider margin_top=”40″][\/vc_column][vc_column width=”1\/4″ el_class=”custom-hover”][gem_divider margin_top=”45″][vc_single_image image=”14315″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”https:\/\/codex-themes.com\/thegem-elementor\/starting_page\/themes.php?page=metro-style-shop”][gem_divider][vc_column_text]<\/p>\n

Metro<\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Product overviews in metro style. Best option for showcasing your products in a modern way.<\/p>\n

[\/vc_column_text][gem_button position=”center” style=”outline” size=”tiny” corner=”3″ border=”2″ icon_pack=”elegant” text=”Show Demo” link=”url:https%3A%2F%2Fcodex-themes.com%2Fthegem%2Fstarting_page%2Fthemes.php%3Fpage%3Dmetro-style-shop||target:%20_blank|”][gem_divider margin_top=”40″][\/vc_column][vc_column width=”1\/4″ el_class=”custom-hover”][gem_divider margin_top=”60″][vc_single_image image=”29442″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”https:\/\/codex-themes.com\/thegem-elementor\/creative-shop\/”][gem_divider margin_top=”47″][vc_column_text]<\/p>\n

Carousel<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Add product carousels on any page for cross-selling, up-selling, promotions etc. With autoscroll option.<\/p>\n

[\/vc_column_text][gem_button position=”center” style=”outline” size=”tiny” corner=”3″ border=”2″ icon_pack=”elegant” text=”Show Demo” link=”url:https%3A%2F%2Fcodex-themes.com%2Fthegem%2Fcreative-shop%2F||target:%20_blank|”][gem_divider margin_top=”40″][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider][vc_text_separator title_light=”1″ title_level=”h3″ title=”Product grid width”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/4″][gem_image position=”centered” disable_lightbox=”1″ src=”14333″][gem_divider][vc_column_text]<\/p>\n

100% Width<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Product overviews, using 100% page width. You can use it in any of grid layouts above.<\/p>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/4″][gem_image position=”centered” disable_lightbox=”1″ src=”14331″][gem_divider][vc_column_text]<\/p>\n

Fullwidth<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Post your products in fullwidth content area. Applicable for any grid layout types.<\/p>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/4″][gem_image position=”centered” disable_lightbox=”1″ src=”14329″][gem_divider][vc_column_text]<\/p>\n

With Sidebar<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

You can use any of grid layouts on pages with any sidebars: left or right or both.<\/p>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/4″][gem_image position=”centered” disable_lightbox=”1″ src=”14327″][gem_divider][vc_column_text]<\/p>\n

In Content<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Mix your content with products. Place any product grid on any position in content you wish.<\/p>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider margin_top=”30″][vc_text_separator title_light=”1″ title_level=”h3″ title=”Grid Columns”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row el_class=”custom-column”][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14346″][gem_divider][vc_column_text]<\/p>\n

2x<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14344″][gem_divider][vc_column_text]<\/p>\n

3x<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14342″][gem_divider][vc_column_text]<\/p>\n

4x<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14340″][gem_divider][vc_column_text]<\/p>\n

5x<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14340″][gem_divider][vc_column_text]<\/p>\n

6x<\/span><\/div>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider margin_top=”30″][vc_text_separator title_light=”1″ title_level=”h3″ title=”Display Product Details”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/2″][gem_image position=”centered” disable_lightbox=”1″ src=”14363″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Outside Image<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Make any of your chosen product details like title, description, price & ratings always visible in product lists.<\/p>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/2″][gem_image position=”centered” disable_lightbox=”1″ src=”14361″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

On Image<\/span><\/div>\n

[\/vc_column_text][vc_column_text]<\/p>\n

Hide your chosen product details by default and display them on image hover.<\/p>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider margin_top=”38″][vc_text_separator title_light=”1″ title_level=”h3″ title=”Hover Types”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14383″][vc_column_text]<\/p>\n

Cyan Breeze<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14381″][vc_column_text css=”.vc_custom_1458555745969{padding-right: 0px !important;padding-left: 0px !important;}”]<\/p>\n

Zooming White<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″ css=”.vc_custom_1458555504558{padding-right: 0px !important;padding-left: 0px !important;}”][gem_image position=”centered” disable_lightbox=”1″ src=”14379″][vc_column_text]<\/p>\n

Horizontal Sliding<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14377″][vc_column_text]<\/p>\n

Vertical Sliding<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14374″][vc_column_text]<\/p>\n

Gradient<\/span><\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″ css=”.vc_custom_1458555522548{padding-right: 0px !important;padding-left: 0px !important;}”][gem_image position=”centered” disable_lightbox=”1″ src=”14372″][vc_column_text]<\/p>\n

Circular Overlay<\/span><\/div>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider margin_top=”34″][vc_text_separator title_light=”1″ title_level=”h3″ title=”Loading Mode & Pagination”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/3″][gem_image position=”centered” disable_lightbox=”1″ src=”14397″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

\u201cLoad More\u201d Button<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/3″][gem_image position=”centered” disable_lightbox=”1″ src=”14395″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Infinite Scroll<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/3″][gem_image position=”centered” disable_lightbox=”1″ src=”14393″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Standard<\/div>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row full_width=”stretch_row_content”][vc_column][gem_divider margin_top=”20″][vc_text_separator title_light=”1″ title_level=”h3″ title=”Loading animation”][gem_divider margin_top=”50″][\/vc_column][\/vc_row][vc_row][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14423″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Fade In<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14421″][gem_divider margin_top=”3″][vc_column_text css=”.vc_custom_1458556199882{padding-right: 0px !important;padding-left: 0px !important;}”]<\/p>\n

Fall Perspective<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″ css=”.vc_custom_1458555504558{padding-right: 0px !important;padding-left: 0px !important;}”][gem_image position=”centered” disable_lightbox=”1″ src=”14419″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Flip<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14417″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Scale<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″][gem_image position=”centered” disable_lightbox=”1″ src=”14415″][gem_divider margin_top=”3″][vc_column_text]<\/p>\n

Bounce<\/div>\n

[\/vc_column_text][\/vc_column][vc_column width=”1\/6″ css=”.vc_custom_1458555522548{padding-right: 0px !important;padding-left: 0px !important;}”][gem_image position=”centered” disable_lightbox=”1″ src=”14425″][gem_divider margin_top=”-3″][vc_column_text]<\/p>\n

Move Up<\/div>\n

[\/vc_column_text][\/vc_column][\/vc_row][vc_row][vc_column][\/vc_column][\/vc_row][vc_row css=”.vc_custom_1458556690578{margin-bottom: 0px !important;}”][vc_column][gem_fullwidth background_style=”cover” container=”1″ background_image=”29426″ padding_top=”100″ padding_bottom=”165″][gem_divider margin_top=”50″][gem_icon pack=”elegant” size=”medium” centered=”1″ icon_elegant=”e035″ color=”#00bcd4″][gem_divider margin_top=”40″][vc_column_text]<\/p>\n

Product list settings<\/span><\/div>\n

[\/vc_column_text][gem_divider margin_top=”60″][vc_row_inner][vc_column_inner width=”1\/3″][gem_list type=”check-style-2″ color=”3″]<\/p>\n

    \n
  • Show \/ hide product titles & excerpts<\/span><\/li>\n
  • Choose product categories<\/span><\/li>\n
  • Define number of products to be displayed<\/span><\/li>\n
  • Enable \/ disable filters<\/span><\/li>\n
  • Set any gaps size between products<\/span><\/li>\n<\/ul>\n

    [\/gem_list][\/vc_column_inner][vc_column_inner width=”1\/3″][gem_list type=”check-style-2″ color=”3″]<\/p>\n

      \n
    • Show \/ hide name & date sorting<\/span><\/li>\n
    • Asc. \/ desc. sorting options<\/span><\/li>\n
    • Enable \/ disable wishlist<\/span><\/li>\n
    • Enable \/ disable sharing<\/span><\/li>\n
    • Define highlighted products<\/span><\/li>\n<\/ul>\n

      [\/gem_list][\/vc_column_inner][vc_column_inner width=”1\/3″][gem_list type=”check-style-2″ color=”3″]<\/p>\n

        \n
      • Enable \/ disable animation<\/span><\/li>\n
      • Choose from 6 animation effects<\/span><\/li>\n
      • Choose from 6 awesome hovers<\/span><\/li>\n
      • Fancy titles or slideshow in header<\/span><\/li>\n
      • Sidebar & footer settings<\/span><\/li>\n<\/ul>\n

        [\/gem_list][\/vc_column_inner][\/vc_row_inner][gem_divider margin_top=”50″][\/gem_fullwidth][\/vc_column][\/vc_row]<\/p>\n","protected":false},"excerpt":{"rendered":"

        [vc_row][vc_column][vc_column_text] Grid Layouts [\/vc_column_text][gem_divider margin_top=”35″][\/vc_column][\/vc_row][vc_row el_class=”custom-column”][vc_column width=”1\/4″ el_class=”custom-hover”][gem_divider margin_top=”45″][vc_single_image image=”14323″ img_size=”full” alignment=”center” onclick=”custom_link” img_link_target=”_blank” link=”https:\/\/codex-themes.com\/thegem-elementor\/starting_page\/themes.php?page=justified-shop”][gem_divider][vc_column_text] Justified [\/vc_column_text][vc_column_text] Various number of…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/pages\/29417"}],"collection":[{"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/comments?post=29417"}],"version-history":[{"count":0,"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/pages\/29417\/revisions"}],"wp:attachment":[{"href":"https:\/\/codex-themes.com\/thegem-elementor\/wp-json\/wp\/v2\/media?parent=29417"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}