1. Home
  2. Vino WordPress
  3. Organizing Content
  4. Portfolio / Gallery

Portfolio / Gallery

Step 1. Create “Single Portfolio”

Start with creating categories Portfolio -> Categories. To create a single portfolio post, go to Portfolio -> Add Portfolio, fill in the details (title, featured image) and choose styles for it. All settings you can see at the bottom of page.

Single Portfolio Settings:

  • Select navigation – change navigation for this page or use default style.
  • Upload image for intro section – if you don’t upload image but intro section is turn on (Theme Settings -> Default page settings -> Page intro section), featured image will appear above single portfolio content.
  • Portfolio style – you have a choice of content view one of 3 template styles (fullwidth gallery, large gallery, small gallery) or create a page with Visual Composer builder (blank).
    Note: Other settings not applicable for Portfolio style -> Blank
  • Add Gallery – upload images to your portfolio post
  • Gallery view – assign one of 4 gallery view (Images, Slider, Grid, Masonry)
  • Gallery position – if you chose portfolio style “large gallery” or “fullwidth gallery”, you can add gallery under or below content
  • Portfolio text – add content to portfolio
  • Add attributes – additional information below text eg. date of photos
  • Back to page – page will be loaded after click in link

Portfolio Settings (for Visual Composer) – change settings to achieve the look of portfolio elements you want.

  • Grid size – option is available only for type masonry and masonry layout “from elements” in Vino Portfolio Masonry. Assign one of 4 sizes (small square, tall rectangle, wide rectangle, large rectangle).
  • Custom link – add link to page which will be opened after click in portfolio item. Option is available only for “Open portfolio -> in portfolio page”.
  • Background color for slide – select background color to different colors on each slides for split slider element (Vino Portfolio Split Slider).
  • Text color for slide – select color for split slider element (Vino Portfolio Split Slider).
  • Image opacity – select opacity for image on split slider element (Vino Portfolio Split Slider).

 

Step 2. Create “Portfolio” page

From your site WP dashboard, add a new page, assign one of portfolio VC element to it. We have 4 elements (3 portfolio elements and 1 single portfolio element), each presenting different looks.

  • Vino Portfolio
  • Vino Portfolio Carousel
  • Vino Portfolio Split Slider
  • Vino Single Portfolio Item

You can create multiple portfolio pages.

Step 3. “Portfolio” settings overview

 

Vino Portfolio

Grid 3 columns

Options in Portfolio element:

  1. Select query criteria (categories or posts) – choose which of portfolios will be shown in element.
  2. Show filters and filters position – lets you decide if filter should be shown and there’s position.
  3. Posts per page – lets you define number of items per page
  4. Select type – we created 19 types of portfolio. You have 4 main styles (Grid, Masonry,
    Masonry scattered, Pinterest, Parallax) with different number of columns.
  5. Select style – select where you want to show title and categories (on hover or below images). Assign one of 4 hover types to portfolio: text on hover (small), text on hover (large), text follows cursor, text below portfolio item.
  6. Select header size
  7. Open portfolio – decide how portfolio images will be shown.
  8. Show spacing between elements – lets you decide if any space should be present between elements
  9. Colors & Button – change settings to achieve the look you want.

 

Vino Portfolio Carousel

Options in Portfolio Carousel:

  1. Select query criteria (categories or posts) – choose which of portfolios will be shown in element.
  2. Posts per page – lets you define number of items per page
  3. Image size – enter image size: “thumbnail”, “medium”, “large”, “full”, “vino-vertical-slide” (810×1080), “vino-square” (800×800). Alternatively enter size in pixels (Example: 200×100 (Width x Height)).
  4. Select style – select where you want to show title and categories (on hover or below images). Assign one of 4 hover types to portfolio: text on hover (small), text on hover (large), text follows cursor, text below portfolio item.
  5. Carousel height – select fullheight or add custom height.
  6. Select header size
  7. Open portfolio – decide how portfolio images will be shown.
  8. Show arrows – decide if portfolio carousel should contain arrows
  9. Show pagination – decide if portfolio carousel should contain pagination
  10. Mouse wheel control – decide if slides should change on mouse wheel function
  11. Autoplay – decide if autoplay should be active.
  12. Color – change colors to achieve the look you want.

 

Vino Portfolio Split Slider

Options in Portfolio Split Splider:

  1. Select query criteria (categories or posts) – choose which of portfolios will be shown in element.
  2. How many posts to display – set “-1” to display all posts
  3. Autoplay – decide if autoplay should be active.
  4. Select links size
  5. Show arrows – decide if portfolio should contain arrows
  6. Show pagination – decide if portfolio should contain pagination
  7. Mouse wheel – decide if slide should change on mouse wheel function
  8. Show categories – decide if portfolio should contain categories
  9. Show button – decide if portfolio should contain “See project” button

 

Vino Single Portfolio Item

Options in Single Portfolio Item:

  1. Insert portfolio ID – ID you can find in 5th column in Portfolio (image below).

  2. Select header size
  3. Open portfolio – decide how portfolio images will be shown.
  4. Select style – select where you want to show title and categories (on hover or below images). Assign one of 4 hover types to portfolio: text on hover (small), text on hover (large), text follows cursor, text below portfolio item.
  5. Color – change colors to achieve the look you want.

 

Was this article helpful to you? Yes No 1