{"id":20814,"date":"2016-09-30T11:41:35","date_gmt":"2016-09-30T11:41:35","guid":{"rendered":"http:\/\/nativewptheme.net\/shortcodes\/?page_id=20814"},"modified":"2023-03-29T12:30:44","modified_gmt":"2023-03-29T12:30:44","slug":"gallery-metro","status":"publish","type":"page","link":"https:\/\/nativewptheme.net\/elements\/gallery-metro\/","title":{"rendered":"Gallery metro"},"content":{"rendered":"

[vc_row][vc_column][dfd_spacer screen_wide_spacer_size=”80″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”70″ screen_tablet_spacer_size=”60″ screen_mobile_spacer_size=”50″][\/vc_column][vc_column width=”1\/3″ dfd_column_responsive_enable=”dfd-column-responsive-enable” el_class=”dfd_col-tablet-12″ css=”.vc_custom_1474359155455{padding-right: 5% !important;}” offset=”vc_col-lg-4 vc_col-md-4 vc_col-xs-12″ responsive_styles=”padding_left_desktop:20|padding_left_tablet:20|padding_right_tablet:20|padding_left_mobile:20|padding_right_mobile:20″][dfd_heading subtitle=”Present your galleries in an noticeable and great looking metro style. Impress the visitors.” content_alignment=”text-left” module_animation=”transition.slideLeftBigIn” enable_delimiter=”” title_font_options=”tag:h3|font_size:45|line_height:45|letter_spacing:0″ subtitle_font_options=”tag:div|font_size:15|color:%234c4c4c|line_height:32″ subheading_margin=”margin-top:20″ undefined=”” title_responsive=”font_size_desktop:36|line_height_desktop:36|font_size_tablet:36|line_height_tablet:36|font_size_mobile:36|line_height_mobile:36″]Gallery metro
\nshortcode[\/dfd_heading][dfd_spacer screen_wide_spacer_size=”20″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”20″ screen_tablet_spacer_size=”20″ screen_mobile_spacer_size=”20″][dfd_button button_text=”Read documentation” alignment=”text-left” module_animation=”transition.slideLeftBigIn” select_icon=”dfd_icons” border=”border_style:dashed|border_width:1|border_radius:50|border_color:%23d3d3d3″ main_style=”style-3″ buttom_link_src=”url:https%3A%2F%2Fnativewptheme.net%2Ftheme-support%2Fwpbackery%2Fgallery-metro|target:_blank” box_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” hover_box_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” padding_top=”17″ padding_bottom=”17″ ic_dfd_icons=”dfd-socicon-paper” text_color=”#2d2d2d” ic_color=”#232323″ background=”rgba(255,255,255,0.01)” hover_text_color=”#ffffff” hover_ic_color=”#333333″ hover_background=”#3498db” tutorials=”” undefined=””][dfd_spacer screen_wide_spacer_size=”60″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”40″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”40″][dfd_progressbar percent=”82″ title=”Usage frequency” height_progress_line=”36″ back_line_border=”border_style:none” main_layout=”layout-3″ font_options=”tag:div|font_size:13″ number_font_options=”tag:div” back_line_background=”rgba(255,255,255,0.01)” progress_background_color=”#6ac3ff” animate_progress=”anim_progress” undefined=””][dfd_progressbar percent=”87″ title=”Preset amount” height_progress_line=”36″ back_line_border=”border_style:none” main_layout=”layout-3″ font_options=”tag:div|font_size:13″ number_font_options=”tag:div” back_line_background=”rgba(255,255,255,0.01)” progress_background_color=”#49a9e9″ animate_progress=”anim_progress” undefined=””][dfd_progressbar percent=”93″ title=”Customizability” height_progress_line=”36″ back_line_border=”border_style:none” background_style=”gradient_background” main_layout=”layout-3″ font_options=”tag:div|font_size:13″ number_font_options=”tag:div” back_line_background=”rgba(255,255,255,0.01)” animate_progress=”anim_progress” progress_background_gradient=”gradient_style:left|gradient_css:background%3A%20url(data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxkZWZzPjxsaW5lYXJHcmFkaWVudCBpZD0iZ3JhZGllbnQiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdHlsZT0ic3RvcC1jb2xvcjojMzQ5OERCOyIgLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0eWxlPSJzdG9wLWNvbG9yOiNFRTM2NTg7IiAvPjwvbGluZWFyR3JhZGllbnQ%2BPC9kZWZzPjxyZWN0IGZpbGw9InVybCgjZ3JhZGllbnQpIiBoZWlnaHQ9IjEwMCUiIHdpZHRoPSIxMDAlIiAvPjwvc3ZnPg%3D%3D)%3B%0Abackground%3A%20-webkit-gradient(linear%2C%20left%20top%2C%20left%20bottom%2C%20color-stop(0%25%2C%20%233498DB)%2C%20color-stop(100%25%2C%20%23EE3658))%3B%0Abackground%3A%20-moz-linear-gradient(left%2C%233498DB%200%25%2C%23EE3658%20100%25)%3B%0Abackground%3A%20-webkit-linear-gradient(left%2C%233498DB%200%25%2C%23EE3658%20100%25)%3B%0Abackground%3A%20-o-linear-gradient(left%2C%233498DB%200%25%2C%23EE3658%20100%25)%3B%0Abackground%3A%20-ms-linear-gradient(left%2C%233498DB%200%25%2C%23EE3658%20100%25)%3B%0Abackground%3A%20linear-gradient(left%2C%233498DB%200%25%2C%23EE3658%20100%25)%3B|gradient_value:0%25%20%233498DB%2C100%25%20%23EE3658″ undefined=””][dfd_spacer screen_wide_spacer_size=”0″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”0″ screen_tablet_spacer_size=”60″ screen_mobile_spacer_size=”40″][\/vc_column][vc_column width=”2\/3″ dfd_column_responsive_enable=”dfd-column-responsive-enable” el_class=”dfd_col-tablet-12″ css=”.vc_custom_1474360163502{border-left-width: 1px !important;padding-left: 5% !important;border-left-color: #e2e2e2 !important;border-left-style: dashed !important;}” responsive_styles=”padding_right_desktop:20|border_left_tablet:0|padding_left_tablet:20|padding_right_tablet:20|border_left_mobile:0|padding_left_mobile:20|padding_right_mobile:20″ offset=”vc_col-lg-8 vc_col-md-8 vc_col-xs-12″][dfd_heading style=”style_09″ subtitle=”” content_alignment=”text-left” module_animation=”transition.slideRightBigIn” enable_delimiter=”” title_font_options=”tag:h3|font_size:21″ subtitle_font_options=”tag:h6″ undefined=””]Available options[\/dfd_heading][dfd_spacer screen_wide_spacer_size=”20″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”20″ screen_tablet_spacer_size=”20″ screen_mobile_spacer_size=”20″][dfd_announcement module_animation=”transition.slideRightBigIn” content_announcement=”Default code: `{`dfd_gallery_metro_module items=“single“ columns=“3“ gallery_show_top_cat=“on“`}`” select_icon=”fontawesome” ic_fontawesome=”fa fa-code” main_border=”border_style:none” icon_size=”14″ main_style=”style-1″ full_width_background=”show” undefined=””][dfd_spacer screen_wide_spacer_size=”20″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”20″ screen_tablet_spacer_size=”20″ screen_mobile_spacer_size=”20″][vc_column_text item_animation=”transition.slideRightBigIn” css_animation=”right-to-left”]Content<\/strong>\u00a0\u2013 Allows you to choose the content to display. You can set loop to choose the definite categories or single item to show;<\/p>\n

Categories<\/strong>\u00a0\u2013 Select the categories to show;<\/p>\n

Item to display<\/strong>\u2013 Choose the item you’d like to show;<\/p>\n

Item size<\/strong>\u00a0\u2013 Standard, tall, large or wide sizes for the single gallery item are available for choosing;<\/p>\n

Number of columns<\/strong>\u00a0\u2013 Set the number of columns you\u2019d like to display;<\/p>\n

Animation<\/strong> \u2013 Select among 14 appear effects;<\/p>\n

Custom CSS Class<\/strong> \u2013 Type your own unique class name for the item \u2013 this is a useful option for those who want to create a specific style.
\nFor example, you can type custom-style<\/em> class and then go to Theme options -> General Options -> Custom CSS \/ JS -> Custom CSS and write your own CSS code with this class to get your own style;<\/p>\n

Content elements\u00a0<\/strong>\u2013 Choose the content elements you’d like to display;<\/p>\n

Sort panel alignment<\/strong> \u2013 Allows you to align the sort panel horizontally;<\/p>\n

Content alignment\u00a0\u2013\u00a0<\/strong>Choose the horizontal alignment for the gallery info;<\/p>\n

Content style\u00a0\u2013\u00a0<\/strong>This option allows you to choose the content hover style. Simple style allows you to have transparent background without hover effect. Tiled style allows you to have white background with shadow hover effect;<\/p>\n

Hover<\/strong>\u00a0\u2013 Allows you to enable or disable the hover effect for the gallery items;<\/p>\n

Mask appear effect\u00a0<\/strong>\u2013 Select the hover effect for the mask appearing;<\/p>\n

Image hover effect<\/strong>\u00a0\u2013 Allows you to choose the image behaviour on hover;<\/p>\n

Hover mask settings<\/strong>\u00a0\u2013 Customize the mask style, color,\u00a0opacity, set the color for the content on hover. You can also enable the frame decoration and customize it;<\/p>\n

Hover decoration settings<\/strong>\u00a0\u2013 Allow you to add the main decoration and choose the behaviour for the decoration link;<\/p>\n

Typography<\/strong> \u2013 Select letter spacing, font size and element tag. You can also choose the custom font family.[\/vc_column_text][\/vc_column][\/vc_row][vc_row dfd_row_config=”full_width_content”][vc_column col_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” col_shadow_hover=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)”][dfd_spacer screen_wide_spacer_size=”120″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”70″ screen_tablet_spacer_size=”60″ screen_mobile_spacer_size=”40″][vc_row_inner dfd_row_responsive_enable=”dfd-row-responsive-enable” responsive_styles=”padding_left_mobile:20|padding_right_mobile:20″][vc_column_inner][dfd_heading subtitle=”Sample of preset styles without custom changes” module_animation=”transition.expandIn” enable_delimiter=”” title_font_options=”tag:h3″ subtitle_font_options=”tag:div|font_size:14|color:%23606060|line_height:30″ subheading_margin=”margin-bottom:25″ undefined=”” title_responsive=”font_size_tablet:26|font_size_mobile:24″ subtitle_responsive=”font_size_mobile:13|line_height_mobile:26″]Default styles[\/dfd_heading][\/vc_column_inner][\/vc_row_inner][dfd_delimiter delimiter_style=”dfd-delimiter-with-text” text_delimiter=”loop content” undefined=””][dfd_spacer screen_wide_spacer_size=”40″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”40″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”40″][vc_row_inner][vc_column_inner col_inner_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” col_inner_shadow_hover=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)”][dfd_gallery_metro_module posts_to_show=”5″ columns=”4″ module_animation=”transition.slideUpBigIn”][\/vc_column_inner][\/vc_row_inner][dfd_spacer screen_wide_spacer_size=”40″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”40″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”40″][\/vc_column][\/vc_row][vc_row dfd_row_config=”full_width_content”][vc_column col_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” col_shadow_hover=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)”][dfd_spacer screen_wide_spacer_size=”120″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”50″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”20″][vc_row_inner dfd_row_responsive_enable=”dfd-row-responsive-enable” responsive_styles=”padding_left_mobile:20|padding_right_mobile:20″][vc_column_inner][dfd_heading subtitle=”Variation of style customizations of the shortcode” module_animation=”transition.expandIn” enable_delimiter=”” title_font_options=”tag:h3″ subtitle_font_options=”tag:div|font_size:14|color:%23606060|line_height:30″ subheading_margin=”margin-bottom:25″ undefined=”” title_responsive=”font_size_tablet:26|font_size_mobile:24″ subtitle_responsive=”font_size_mobile:13|line_height_mobile:26″]Customized styles[\/dfd_heading][\/vc_column_inner][\/vc_row_inner][dfd_delimiter delimiter_style=”dfd-delimiter-with-text” text_delimiter=”with category” undefined=””][dfd_spacer screen_wide_spacer_size=”40″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”40″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”40″][vc_row_inner][vc_column_inner col_inner_shadow=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)” col_inner_shadow_hover=”box_shadow_enable:disable|shadow_horizontal:0|shadow_vertical:15|shadow_blur:50|shadow_spread:0|box_shadow_color:rgba(0%2C0%2C0%2C0.35)”][dfd_gallery_metro_module items=”single” columns=”4″ module_animation=”transition.slideUpBigIn” gallery_show_top_cat=”on” gallery_hover_image_effect=”dfd-image-blur” title_google_fonts=”yes” title_custom_fonts=”font_family:Lora%3Aregular%2Citalic%2C700%2C700italic|font_style:700%20bold%20regular%3A700%3Anormal” selected_items=”%5B%7B%22post_id%22%3A%2218682%22%2C%22post_size%22%3A%22default%22%7D%2C%7B%22post_id%22%3A%2218689%22%2C%22post_size%22%3A%22tall%22%7D%2C%7B%22post_id%22%3A%2218647%22%2C%22post_size%22%3A%22default%22%7D%2C%7B%22post_id%22%3A%2218591%22%2C%22post_size%22%3A%22default%22%7D%2C%7B%22post_id%22%3A%2218640%22%2C%22post_size%22%3A%22default%22%7D%2C%7B%22post_id%22%3A%2218626%22%2C%22post_size%22%3A%22wide%22%7D%5D”][\/vc_column_inner][\/vc_row_inner][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"

[vc_row][vc_column][dfd_spacer screen_wide_spacer_size=”80″ screen_normal_resolution=”1280″ screen_tablet_resolution=”1024″ screen_mobile_resolution=”800″ screen_wide_resolution=”1280″ screen_normal_spacer_size=”70″ screen_tablet_spacer_size=”60″ screen_mobile_spacer_size=”50″][\/vc_column][vc_column width=”1\/3″ dfd_column_responsive_enable=”dfd-column-responsive-enable” el_class=”dfd_col-tablet-12″ css=”.vc_custom_1474359155455{padding-right: 5% !important;}” offset=”vc_col-lg-4 vc_col-md-4 vc_col-xs-12″ responsive_styles=”padding_left_desktop:20|padding_left_tablet:20|padding_right_tablet:20|padding_left_mobile:20|padding_right_mobile:20″][dfd_heading subtitle=”Present your galleries in an noticeable and great looking metro style.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"tmp-page.php","meta":{"footnotes":""},"class_list":["post-20814","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20814","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/comments?post=20814"}],"version-history":[{"count":2,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20814\/revisions"}],"predecessor-version":[{"id":25261,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20814\/revisions\/25261"}],"wp:attachment":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/media?parent=20814"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}