Layout

There are four available layout types: Tiles, Masonry, Justified, and Slider. Select one of them, each type includes its own settings.

These settings are common for every layout type:

Gap: this slider allows you to set a needed spacing between your portfolio items.

Items per Page: this slider allows you to set the number of items shown in the list of portfolio items per one page.

Stretch: this option allows your portfolio to break its page container, so it will be shown full-width.

Tiles

The Tiles layout allows you to select a predefined layout type for your portfolio items.

Type: this list contains layout types.

Masonry

Masonry is a special type of portfolio layout where portfolio items are shown in an optimal position based on their size and available space on a page.

Columns: this slider allows you to set the needed number of columns for your portfolio items.

Justified

This type of portfolio layout shows your portfolio items in rows that have a certain height.

Row height: set the row height for your layout by adjusting this slider.

Row height tolerance: this slider allows to set the coefficientfor the Row height to deviate from the set Row height value. 

Slider

The slider layout is aimed to show your portfolio items in a carousel.

Effect: Visual Portfolio supports three slider effects: Slide, Coverflow, and Fade.

Speed(seconds): adjust this value to set the effect duration while changing a slide.

Autoplay(seconds): Interval of changing the slides. Set as zero to turn the autoplay feature off.

Items Height: This list has three options: Auto, Static(px), and Dynamic(%).

  • The Auto option allows showing of the original aspect ratio. 
  • The Static option allows to set the height of the of slides in pixels. This height will be fixed.
  • The Dynamic option allows to set the height of the slides in percents, so the height of slider will be changed depending on the size of a browser window. 

The width of a portfolio item is fixed and depends on the number of slides shown per page if the Slides per view option is set as Custom.

If the Slides per view option is set as Auto, the width of slides is calculated automatically, and the dynamic height is counted from the width of a slider.

The two following options are not present for a slider that uses the Fade effect.

  • Slides per view: select the Custom option in the list to set the number of slides seen on the screen at the same time. 
  • Centered Slides: check this option to show an active portfolio item centered, otherwise the active slider will be on the left side.

Other settings that are available for the Slider layout: 

  • Loop: check this option if you want to loop your slider (it won’t have the end).
  • Free scroll: enable this option and slides will not have fixed positions. 
  • Show arrows: check this option to show arrows for your slider. You can set other icons as arrows. The Font Awesome is installed with the plugin. The list of icons is available here: https://fontawesome.com/icons?d=gallery&m=free
  • Show bullets: check this option to show bullets for your slider. They will appear below the slider by default.
  • Dynamic bullets(if the Bullets are shown): check this option to show bullets only for the slides shown on the page.
Was this page helpful?