Image Gallery

Image Gallery Shortcodes

You can show your images in different layout styles with Porto Sort Filters, Sort Filter, Sort Container, Sort Item, Grid Container, Grid Item shortcodes.

Default

[porto_sort_filters container= »shortcode-portfolios »][porto_sort_filter sort_by= »original-order » active= »yes » label= »Show All » filter_by= »* »][porto_sort_filter label= »Websites » filter_by= ».websites »][porto_sort_filter label= »Logos » filter_by= ».logos »][porto_sort_filter label= »Brands » filter_by= ».brands »][/porto_sort_filters]
[porto_sort_container id= »shortcode-portfolios »][porto_sort_item width_lg= »3″ width_md= »4″ width_sm= »6″ filter= »websites »][porto_image_frame type= »hover-style » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project.jpg »][/porto_image_frame][/porto_sort_item][porto_sort_item width_lg= »3″ width_md= »4″ width_sm= »6″ filter= »logos »][porto_image_frame type= »hover-style » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-2.jpg »][/porto_image_frame][/porto_sort_item][porto_sort_item width_lg= »3″ width_md= »4″ width_sm= »6″ filter= »brands »][porto_image_frame type= »hover-style » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-4.jpg »][/porto_image_frame][/porto_sort_item][porto_sort_item width_lg= »3″ width_md= »4″ width_sm= »6″ filter= »websites »][porto_image_frame type= »hover-style » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-5.jpg »][/porto_image_frame][/porto_sort_item][/porto_sort_container]

Full Width

[porto_grid_container gutter_size= »0″][porto_grid_item width= »20% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project.jpg » el_class= »m-b-none »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »20% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-2.jpg » el_class= »m-b-none »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »20% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-4.jpg » el_class= »m-b-none »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »20% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-5.jpg » el_class= »m-b-none »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »20% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/project-6.jpg » el_class= »m-b-none »][/porto_image_frame][/porto_grid_item][/porto_grid_container]

Masonry

[porto_grid_container gutter_size= »0″][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-1.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-2.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-4.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-3.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-6.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-5.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-7.jpg »][/porto_image_frame][/porto_grid_item][porto_grid_item width= »25% »][porto_image_frame type= »hover-style » view_type= »centered-info » noborders= »yes » link= »url:%23|| » title= »Project Title » sub_title= »Project Type » el_class= »m-b-none » image_url= »http://sw-themes.com/porto_dummy/wp-content/uploads/images/gallery-8.jpg »][/porto_image_frame][/porto_grid_item][/porto_grid_container]
X