Dial in your perfect grid portfolio.
Mix and match different portfolio layouts, appearances and settings.
See example of some ideas for your portfolio below.
Portfolio Grid
EXAMPLE 1
[dt_vc_list dividers=”false”]
- Page layout: Full-width
- Text position: Below images
- Text alignment: Center
- Text backgrounds: Enabled
- Hover icons: Enabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Enabled
- Sorting: Enabled
- Loading mode: Lazy loading
- Loading effect: Fall perspective
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/1-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 2
[dt_vc_list dividers=”false”]
- Page layout: Content-width
- Text position: Below images
- Text alignment: Left
- Text backgrounds: Enabled
- Hover icons: Enabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Enabled
- Sorting: Enabled
- Loading mode: AJAX pagination
- Loading effect: Fade in
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/2-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 3
[dt_vc_list dividers=”false”]
- Page layout: Full-width
- Sidebar: Disabled
- Text position: On image
- Text alignment: Center
- Hover icons: Enabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Enabled
- Sorting: Enabled
- Loading mode: AJAX pagination
- Loading effect: Scale up
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/3-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 4
[dt_vc_list dividers=”false”]
- Page layout: Full-width
- Text position: On image
- Text visibility: Always visible
- Text alignment: Left
- Hover: Dark gradient
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Hover icons: Enabled
- Categorization: Disabled
- Sorting: Disabled
- Loading mode: Lazy loading
- Loading effect: Move up
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/4-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 5
[dt_vc_list dividers=”false”]
- Page layout: Content-width
- Text position: On image
- Text alignment: Center
- Hover: Text in the bottom
- Hover icons: Disabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Disabled
- Sorting: Disabled
- Loading mode: AJAX pagination
- Loading effect: Helix
- Sidebar: Enabled
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/5-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 6
[dt_vc_list dividers=”false”]
- Page layout: Content-width
- Text position: On image
- Text alignment: Center
- Hover: Colored background
- Hover animation: Scale in
- Hover icons: Disabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Enabled
- Sorting: Enabled
- Loading mode: AJAX pagination
- Loading effect: None
- Content area: After projects
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/6-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]
Portfolio Grid
EXAMPLE 7
[dt_vc_list dividers=”false”]
- Page layout: Full-width
- Text position: Below images
- Text alignment: Left
- Text backgrounds: Disabled
- Hover icons: Disabled
[/dt_vc_list]
[dt_vc_list dividers=”false”]
- Categorization: Enabled
- Sorting: Disabled
- Loading mode: Load more
- Loading effect: Scale
- Fancy title: Enabled
[/dt_vc_list]
[dt_button link=”http://the7.dream-demo.com/portfolio/portfolio-grid/7-portfolio-grid/” size=”medium” icon=”JTNDaSUyMGNsYXNzJTNEJTIyZmElMjBmYS1hcnJvdy1jaXJjbGUtcmlnaHQlMjIlM0UlM0MlMkZpJTNF” icon_align=”right”]View demo page[/dt_button]