Image Frames

Image Frames Shortcodes

You can show your images in different layout styles.


Default

By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.

Project Image
Project Image
Project Image

HTML Shortcode

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
<p>By default, Bootstrap's thumbnails are designed to showcase linked images with minimal required markup.</p>
<div class="row">
    <div class="col-md-4">
        <img class="img-responsive img-rounded mb-lg" src="/portals/2/img/projects/project.jpg" alt="Project Image" />
    </div>
    <div class="col-md-4">
        <img class="img-responsive img-circle mb-lg" src="/portals/2/img/projects/project-1.jpg" alt="Project Image" />
    </div>
    <div class="col-md-4">
        <span class="img-thumbnail">
            <img class="img-responsive" src="/portals/2/img/projects/project-2.jpg" alt="Project Image" />
        </span>
    </div>
</div>

Hover Styles

The thumbnail details can be displayed in different styles.

Default
Default Lighten
No Zoom
With Title and Type
Project Title Project Type
Centered Icons
Icons Colors
Bottom Info
Project Title Project Type
Bottom Info Dark
Project Title Project Type
With Captions
Project Title Project Type Lorem ipsum dolor sit amet, consectetur adipiscing elit. Facebook Twitter Linkedin
No Borders

Grid


Newsletter

Keep up on our always evolving product features and technology. Enter your e-mail and subscribe to our newsletter.

About Our Company

Pellentesque consequat viverra ipsum, sed placerat ligula aliquam eu nam sapien stibulum ridiculus pellentesque eros!

Get in touch

  • Address: 1234 Street, United States

  • Phone: (123) 456-7890

  • Email: mail@example.com