{"id":12206,"date":"2017-02-21T09:23:17","date_gmt":"2017-02-21T09:23:17","guid":{"rendered":"http:\/\/nativewptheme.net\/support\/?p=12206"},"modified":"2017-03-07T13:32:31","modified_gmt":"2017-03-07T13:32:31","slug":"full-screen-portfolio","status":"publish","type":"post","link":"https:\/\/nativewptheme.net\/support\/wpbakery\/full-screen-portfolio","title":{"rendered":"Full Screen Portfolio"},"content":{"rendered":"

[vc_row][vc_column css=”.vc_custom_1485963458300{padding-right: 35px !important;padding-left: 35px !important;}” 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=”30″ screen_normal_resolution=”1024″ screen_tablet_resolution=”800″ screen_mobile_resolution=”480″][vc_column_text]Full Screen Portfolio module allows you to create the extra stylish portfolio section on the page arranged into either vertical or horizontal carousel. The portfolio\u00a0featured image is displayed on its background with blur and overlay effect.<\/p>\n

Note, this portfolio\u00a0module is designed to be used inside the full-width containers (rows and columns) for its better displaying.
\nThe portfolio title\u00a0also has the peculiarities of displaying: the first word of the portfolio title is displayed on the first line, while all the others are displayed on the second line by default.<\/strong><\/p>\n

Check the examples of the module variations on this page<\/a>.<\/p>\n

Watch the video tutorial on Full Screen Portfolio module creation<\/a> for more details.<\/h5>\n

[\/vc_column_text][dfd_spacer screen_wide_spacer_size=”30″ screen_normal_resolution=”1024″ screen_tablet_resolution=”800″ screen_mobile_resolution=”480″][dfd_tta_tabs border_radius=”4″ alignment=”left” active_section=”1″ active_tab_background=”#3b55e6″ tab_hover_text_color=”#3b55e6″ tab_active_color_text=”#ffffff” border_color_active=”#3b55e6″][vc_tta_section title=”General settings” tab_id=”1486545572585-2437c7e1-5371″][vc_column_text]<\/p>\n

General settings<\/h3>\n

Portfolio items settings<\/h5>\n

\"\"<\/p>\n

    \n
  • Style<\/strong> – choose the carousel style of the portfolio\u00a0module which suits you most of all.\n
      \n
    • Horizontal<\/b> – select this style to have the portfolio carousel with the horizontal scroll.<\/li>\n
    • Vertical<\/strong> –\u00a0select this style to have the portfolio carousel with the vertical scroll.<\/li>\n<\/ul>\n<\/li>\n
    • Items to show<\/strong> – set the number of works to be displayed in the module.<\/li>\n
    • Categories<\/strong> \u2013 select the categories of the portfolio items to be displayed within the module.<\/li>\n<\/ul>\n
      Extra features<\/h5>\n
        \n
      • Animation<\/strong> \u2013 choose between 14 preset animation effects.<\/li>\n
      • Custom CSS class<\/strong> \u2013\u00a0enter our\u00a0own unique class name for the item \u2013 this is a useful option for those who want to create a specific style. E.g.: you can type custom-style<\/strong> class and then go to Theme options<\/del>\u00a0General options<\/del>\u00a0Custom CSS\/JS<\/del> Custom CSS<\/del> field and write your own CSS code with this class to get your own style.<\/li>\n<\/ul>\n

        [\/vc_column_text][\/vc_tta_section][vc_tta_section title=”Content settings” tab_id=”1486545572829-e1c1304c-ee12″][vc_column_text]<\/p>\n

        Content settings<\/h3>\n

        \"\"<\/p>\n

          \n
        • Title<\/strong> \u2013 set it to Enable<\/strong> to display the category of the portfolio on the\u00a0featured image of the single portfolio item.<\/li>\n
        • Subtitle<\/strong> \u2013\u00a0set it to Enable<\/strong> to display the subtitle of the\u00a0single portfolio item.<\/li>\n
        • Blur <\/b>– set it to Enable\u00a0<\/strong>to enable the blur effect for background image fade carousel.<\/li>\n
        • Content alignment<\/strong> –\u00a0 select the horizontal alignment of the content. Left<\/strong>, right<\/strong> and center<\/strong> positions are available.<\/li>\n<\/ul>\n

          [\/vc_column_text][\/vc_tta_section][vc_tta_section title=”Style settings” tab_id=”1486545573068-02c117a6-3d50″][vc_column_text]<\/p>\n

          Style settings<\/h3>\n

          \"\"<\/p>\n

          Images mask settings<\/h5>\n
            \n
          • Background image mask color<\/strong>\u00a0\u2013 set the color for the background overlay applied to the featured image of the portfolio item displayed as a background.<\/li>\n
          • \u00a0Carousel\u00a0image mask color <\/strong>–\u00a0<\/strong>set the color for the background overlay applied to the featured image of the portfolio item displayed\u00a0inside of the carousel.<\/li>\n<\/ul>\n
            Navigation settings<\/h5>\n
              \n
            • Color<\/strong> – set the color for the navigation arrows. White (#fff) color is set by default.<\/li>\n
            • Hover color<\/strong> – set the color for the navigation arrows on hover. White (#fff) color is set by default.<\/li>\n
            • Background color<\/strong> –\u00a0 set the background color for the navigation arrows. Transparent is set by default.<\/li>\n
            • Hover background<\/strong> – set the background color for the navigation arrows on hover. The default value inherits from\u00a0 Theme Options<\/del> Styling Options<\/del> Main site color<\/del>.<\/li>\n<\/ul>\n
              Idle Border<\/h5>\n
                \n
              • Border style<\/strong> \u2013 select one of the available border styles for the navigation arrows in idle state.\u00a0Dotted<\/strong>, dashed<\/strong> and solid<\/strong> variants are available.<\/li>\n
              • Color<\/strong> \u2013 specify the color of the border.<\/li>\n
              • Border radius<\/strong> \u2013 select the border radius for button module to have rounded corners.<\/li>\n
              • Border width<\/strong> \u2013 set the width of the border. You may set the desired width each border: top, right, left<\/strong> and bottom<\/strong>.<\/li>\n<\/ul>\n
                Border on hover<\/h5>\n
                  \n
                • Border style<\/strong> \u2013 select one of the available border styles for the navigation arrows on hover.\u00a0Dotted<\/strong>, dashed<\/strong> and solid<\/strong> variants are available.<\/li>\n
                • Color<\/strong> \u2013 specify the color of the border.<\/li>\n
                • Border radius<\/strong> \u2013 select the border radius for button module to have rounded corners.<\/li>\n
                • Border width<\/strong> \u2013 set the width of the border. You may set the desired width each border: top, right, left<\/strong> and bottom<\/strong>.<\/li>\n<\/ul>\n

                  [\/vc_column_text][\/vc_tta_section][vc_tta_section title=”Typography settings” tab_id=”1486545573311-423c930f-c6e7″][vc_column_text]<\/p>\n

                  Typography settings<\/h3>\n

                  Title typography<\/h5>\n

                  \"\"<\/p>\n

                  These settings are inherited from\u00a0Theme options<\/del> Typography\/Fonts<\/del> Portfolio typography<\/del>\u00a0Portfolio item title Typography <\/del>with font-size set to 55px, line-height 50px, letter-spacing set to -3px by default.<\/p>\n

                    \n
                  • Font size<\/strong> \u2013 set the font size you need to use in the title.<\/li>\n
                  • Letter spacing<\/strong> \u2013 set the needed distance between letters.<\/li>\n
                  • Line-height<\/strong> \u2013\u00a0set the needed distance between lines in the title text.<\/li>\n
                  • Text color<\/strong> \u2013 set the color of the font.<\/li>\n
                  • Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n
                  • Custom font family<\/strong> \u2013 set it to Enable<\/strong> to use custom Google font.\n
                      \n
                    • Font Family<\/strong> \u2013 select the font family from the drop-down list.<\/li>\n
                    • Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the title.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n
                      Subtitle Typography<\/h5>\n

                      \"\"<\/p>\n

                      These settings are inherited from\u00a0Theme options<\/del>Typography\/Fonts<\/del>Portfolio typography<\/del> Portfolio item subtitle Typography<\/del>.<\/p>\n

                        \n
                      • Font size<\/strong> \u2013 set the font size you need to use in the subtitle.<\/li>\n
                      • Letter spacing<\/strong> \u2013 set the needed distance between letters in the\u00a0subtitle.<\/li>\n
                      • Line-height<\/strong> \u2013\u00a0set the needed distance between lines in the subtitle text.<\/li>\n
                      • Text color<\/strong> \u2013 set the color of the font.<\/li>\n
                      • Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the subtitle.<\/li>\n
                      • Custom font family<\/strong> \u2013 set it to Enable<\/strong> to use custom Google font.\n
                          \n
                        • Font Family<\/strong> \u2013 select the font family for the drop-down list.<\/li>\n
                        • Font style<\/strong> \u2013 select the font weight and style (bold, italic) for the subtitle.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n

                          The pagination typography settings are inherited from\u00a0Theme options<\/del>Typography\/Fonts<\/del>\u00a0Text typography<\/del>\u00a0Default text Typography<\/del>.[\/vc_column_text][\/vc_tta_section][vc_tta_section title=”Responsive settings” tab_id=”1487239662687-1d406ac3-2570″][vc_column_text]<\/p>\n

                          Responsive settings<\/h3>\n

                          Title responsive settings<\/h5>\n

                          \"\"<\/p>\n

                          These settings are inherited from\u00a0Theme options<\/del> Typography\/Fonts<\/del> Portfolio typography<\/del>\u00a0Portfolio item title Typography,<\/del>\u00a0font-size is set to 55px, line-height -50px, letter-spacing is set to -3px by default.<\/p>\n

                            \n
                          • Desktop<\/strong> \u2013 set the title font size, line height and letter spacing for the screen resolutions from 1280px to 1025px.<\/li>\n
                          • Tablet\u00a0<\/strong>\u2013 set the title font size, line height and letter spacing for the screen resolutions from 1024px to 800px.<\/li>\n
                          • Mobile\u00a0<\/strong>\u2013 set the title font size, line height and letter spacing for the screen resolutions less than 800px.<\/li>\n<\/ul>\n

                            [\/vc_column_text][\/vc_tta_section][\/dfd_tta_tabs][\/vc_column][\/vc_row]<\/p>\n<\/section>","protected":false},"excerpt":{"rendered":"

                            Full Screen Portfolio module allows you to create the extra stylish portfolio section on the page arranged into either vertical or horizontal carousel.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[46,22,11,33],"_links":{"self":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12206"}],"collection":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/comments?post=12206"}],"version-history":[{"count":24,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12206\/revisions"}],"predecessor-version":[{"id":12288,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/posts\/12206\/revisions\/12288"}],"wp:attachment":[{"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/media?parent=12206"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/categories?post=12206"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nativewptheme.net\/support\/wp-json\/wp\/v2\/tags?post=12206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}