{"id":20781,"date":"2016-09-30T07:55:16","date_gmt":"2016-09-30T07:55:16","guid":{"rendered":"http:\/\/nativewptheme.net\/shortcodes\/?page_id=20781"},"modified":"2023-03-29T12:47:11","modified_gmt":"2023-03-29T12:47:11","slug":"portfolio-metro","status":"publish","type":"page","link":"https:\/\/nativewptheme.net\/elements\/portfolio-metro\/","title":{"rendered":"Portfolio 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 portfolios in noticeable and great looking metro style. Impress the visitors with extremely popular design.” content_alignment=”text-left” module_animation=”transition.slideLeftBigIn” enable_delimiter=”” title_font_options=”tag:h3|font_size:40|line_height:40|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″]Portfolio 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=”65″ 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”][dfd_progressbar percent=”75″ 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”][dfd_progressbar percent=”94″ 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″][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=”50″][\/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_portfolio_module posts_to_show=“6“ items_offset=“20“ columns=“3“`}`” 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 display multiple works of different categories, or select single item to combine portfolio works manually;<\/p>\n

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

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

Item size<\/strong>\u00a0\u2013 Choose standard, tall, large or wide sizes for the single portfolio item;<\/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> – 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\u2019d like to display;<\/p>\n

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

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

Content style<\/strong>\u00a0\u2013\u00a0This 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 hover effect for the portfolio items;<\/p>\n

Mask appear effect<\/strong> \u2013 Select the mask appearing hover effect;<\/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_responsive_enable=”dfd-row-responsive-enable” responsive_styles=”padding_left_tablet:20|padding_right_tablet:20|padding_left_mobile:20|padding_right_mobile:20″][vc_column dfd_column_responsive_enable=”dfd-column-responsive-enable” responsive_styles=”padding_left_desktop:20|padding_right_desktop:20|padding_left_tablet:0|padding_right_tablet:0″][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=”80″ screen_tablet_spacer_size=”60″ screen_mobile_spacer_size=”50″][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][dfd_delimiter delimiter_style=”dfd-delimiter-with-text” text_delimiter=”Loop” 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][dfd_portfolio_metro_module posts_to_show=”4″ columns=”3″ 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” dfd_row_responsive_enable=”dfd-row-responsive-enable”][vc_column dfd_column_responsive_enable=”dfd-column-responsive-enable” 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=”60″ screen_tablet_spacer_size=”40″ screen_mobile_spacer_size=”30″][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][dfd_delimiter delimiter_style=”dfd-delimiter-with-text” text_delimiter=”custom hover” 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][dfd_portfolio_metro_module posts_to_show=”11″ columns=”4″ module_animation=”transition.slideUpBigIn” portfolio_hover_mask_bordered_style=”offset” title_google_fonts=”yes” portfolio_hover_mask_border=”on” title_custom_fonts=”font_family:Oleo%20Script%3Aregular%2C700|font_style:400%20regular%3A400%3Anormal” portfolio_hover_mask_background_opacity=”80″ portfolio_hover_mask_bordered_size=”20″][\/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 portfolios in noticeable and great looking metro style. Impress<\/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-20781","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20781","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=20781"}],"version-history":[{"count":2,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20781\/revisions"}],"predecessor-version":[{"id":25279,"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/pages\/20781\/revisions\/25279"}],"wp:attachment":[{"href":"https:\/\/nativewptheme.net\/elements\/wp-json\/wp\/v2\/media?parent=20781"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}