Introduction
The overlay shortcode is used to add an overlay that will show when the user hovers over the image. You can add your own content to show as part of the overlay. Some examples of content you could add include: icons, buttons, text, etc.
Basic Examples
Effect Types
There are dozens of unique effect types to choose from. Hover over each image to view each effect.
Explore More Shortcodes
- Alert
- Animated Popular
- Animated Image
- Animated Scroll New
- Audio
- Badge
- Blockquote
- Blog
- Blur New
- Books
- Button
- Chart
- Clients
- Code
- Collapsibles
- Content Box
- Content Section Popular
- Counter
- Coupons
- Custom Post Type
- Definitions
- Device Mockups
- Divider Popular
- Dropcap
- Emphasis
- Events
- FAQ
- Filler
- Flip Box Popular
- Fullscreen Video
- Gallery Popular
- Google Docs Viewer
- Guests
- Heading
- Highlight
- Hover Box
- Horizontal Ruler
- Icon Popular
- Icon List
- If New
- Image
- Image Compare
- Jobs
- Label
- Lead
- Lightbox
- Locations
- Map
- Masonry
- Members
- Menu
- Post Meta Data
- Movies
- Music
- News
- Overlay Popular
- Panel New
- Parallax Scene Popular
- Permalink
- Person
- Popover
- Portfolio
- Post Fields
- Post Media
- Pricing Table
- Progress
- Project
- Promotional Box
- QR Code
- Quotes
- Recent Books
- Recent Clients
- Recent Coupons
- Recent Events
- Recent Jobs
- Recent Locations
- Recent Movies
- Recent Music
- Recent News
- Recent Portfolios
- Recent Posts
- Recent Projects
- Recent Quotes
- Recent Recipes
[intense_content_section]
<h2>Introduction</h2>
The overlay shortcode is used to add an overlay that will show when the user hovers over the image. You can add your own content to show as part of the overlay. Some examples of content you could add include: icons, buttons, text, etc.
[/intense_content_section]
[intense_content_section background_type="color" background_color="#f9f9f9" border_top="1px solid #ededed" border_bottom="1px solid #ededed"]
<h2>Basic Examples</h2>
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay image="3172" image_size="medium500" title="Start Your Adventure" subtleeffect="apollo"]
[intense_icon source="metrize" type="arrow-curve-right" width="30" color="#fff"] [intense_icon source="metrize" type="social-sharethis" width="30" color="#fff"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay image="3106" image_size="medium500" subtleeffect="ruby"]
[intense_button link="#" border_radius="200px 200px 200px 200px"]
View More
[/intense_button]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay image="2184" image_size="medium500" subtleeffect="sadie" title="Be More"]
Share with your friends
[intense_icon source="flat-social-multicolor" type="facebook" width="30"] [intense_icon source="flat-social-multicolor" type="twitter" width="30"] [intense_icon source="flat-social-multicolor" type="linkedin" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[/intense_content_section]
[intense_content_section]
<h2>Effect Types</h2>
There are dozens of unique effect types to choose from. Hover over each image to view each effect.
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="lily" title="Lily Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="sadie" title="Sadie Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="honey" title="Honey Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="layla" title="Layla Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="zoe" title="Zoe Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="oscar" title="Oscar Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="marley" title="Marley Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="ruby" title="Ruby Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="roxy" title="Roxy Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="bubba" title="Bubba Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="romeo" title="Romeo Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="dexter" title="Dexter Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="sarah" title="Sarah Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="chico" title="Chico Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="milo" title="Milo Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="apollo" title="Apollo Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="duke" title="Duke Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="goliath" title="Goliath Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="hera" title="Hera Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="jazz" title="Jazz Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="julia" title="Julia Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="kira" title="Kira Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="ming" title="Ming Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="moses" title="Moses Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="phoebe" title="Phoebe Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="sarah" title="Sarah Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="selena" title="Selena Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[intense_row]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="steve" title="Steve Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="terry" title="Terry Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[intense_column size="4" medium_size="4" small_size="12" extra_small_size="12"]
[intense_overlay subtleeffect="winston" title="Winston Overlay" image="3142" link="3036"]
[intense_icon source="flat-social-multicolor" type="facebook" width="30"]
[intense_icon source="flat-social-multicolor" type="twitter" width="30"]
[/intense_overlay]
[/intense_column]
[/intense_row]
[/intense_content_section]
[intense_snippet snippet_id="Child Theme | Shortcodes/footer" snippet_title="Shortcode Page Footer"]