Available with Extra Shortcodes add-on.

This shortcode allows you to create beautiful panels with large photo on top.

Photos by Matt Palmer

This is photo panel
This is photo panel
This is photo panel
This is photo panel
[su_photo_panel color="#F73F43" border="1px solid #F73F43" radius="3" text_align="center" photo="https://getshortcodes.com/wp-content/uploads/sites/2/2017/08/slider-image-1.jpg" url="https://getshortcodes.com/shortcodes/photo_panel/"]This is photo panel[/su_photo_panel]

[su_row]
[su_column size="1/3"]
[su_photo_panel photo="https://getshortcodes.com/wp-content/uploads/sites/2/2017/08/slider-image-1.jpg"]This is photo panel[/su_photo_panel]
[/su_column]
[su_column size="1/3"]
[su_photo_panel photo="https://getshortcodes.com/wp-content/uploads/sites/2/2017/08/slider-image-2.jpg"]This is photo panel[/su_photo_panel]
[/su_column]
[su_column size="1/3"]
[su_photo_panel photo="https://getshortcodes.com/wp-content/uploads/sites/2/2017/08/slider-image-3.jpg"]This is photo panel[/su_photo_panel]
[/su_column]
[/su_row]
Option name Possible values Default value
background
Panel background color
#HEX color #ffffff
color
Panel text color
#HEX color #333333
border
Panel border
CSS border shorthand property 1px solid #cccccc
shadow
Panel shadow
CSS box/text-shadow shorthand property 0 1px 2px #eeeeee
radius
Panel border radius (px)
Number from 0 to 60 0
text_align
Text alignment for panel content
left (Left)
center (Center)
right (Right)
left
photo
Select the photo for this panel
The URL of uploaded file http://lorempixel.com/400/300/food/
alt
Alternative image text (alt attribute)
Any text value

none

url
You can type here any hyperlink to make this panel clickable
Any text value

none

class
Additional CSS class name(s) separated by space(s)
CSS class name(s) separated by space(s)

none