Instamagic Meme

Create your own unique memes from your Instagram images.

  • Basic Setup


  • data-im-meme-text-top = "Holy Instamagic..."
    data-im-meme-text-bottom = "Calm Down Robin..."


    data-im-meme-text-top = "Instamagic."
    data-im-meme-text-bottom = "I use it for..."


    data-im-meme-text-top = "Instamagic!!!"
    data-im-meme-text-bottom = "Ahhhmazing!"

  • Getting started with Instamgic Create is really simple. First add the
    im-create
    class to a div. The default
    width
    and
    height
    is set to 300x300px. But you probably have some specific sizes in mind. This is easy. Simply set the
    data-im-create-width
    and
    data-im-create-height
    properties to the pixel size you want. In the example above we have defined an image 800x200px. Remember, Instagram images are square so using round numbers ensures no parts of the image are cropped. Finally set the
    data-im-tags
    property and you're all set.

Options:

Data property Type Default Options Description
data-im-lightboxboolfalsetrue, falseUse this if you want your Instagram images in a popup lightbox. Use with
im-lightbox-group
to group images in to different lightboxes.
data-im-lightbox-groupstringgallery-imgnoneSet a unique name for each lightbox group. Use with
im-lightbox
data-im-img-resstringmediumlow, medium, highSet the resolution for your Instagram images. Use low res for large galleries to speed page loading time.
data-im-show-likesboolfalsetrue, falseShow the Instagram likes on each image.
data-im-show-filterboolfalsetrue, falseShow the Instagram filter used on each image.
data-im-show-usernameboolfalsetrue, falseShow the Instagram username on each image.
data-im-filterstringnoneAdd filter effects to spice up your images. Combine with
data-im-hover
for some cool hover effects.
data-im-hoverstringnoneUse this to add some cool hover effects. Use in conjunction with
data-im-filter
.

And there's more...

Check out even more cool demos and tutorials with tons of more features

  • Fully Responsive
  • HTML5
  • CSS3
  • jQuery
  • Super Lightweight
  • Lightbox
  • Multiple Carousels
  • Hover Effects
  • Color Filters & effects
  • Quick & easy setup
  • Create images on the fly
  • Create personalised memes