Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

Popup box for images

  1. aw1923
    Member

    I know people have asked how to have an image in a separate popup box on your wordpress.COM blog so I'll add how to do it for future reference. you just add class="thickbox" to the html. The thickbox appearance is customizable but only with the CSS upgrade but this is available for most if not all of the themes here. like this,
    <a class=”thickbox” href=”http://sensicology.files.wordpress.com/2009/07/obama-platoon.jpg”><img title=”obama-platoon” src=”http://sensicology.files.wordpress.com/2009/07/obama-platoon.jpg” alt=”obama-platoon” width=”68″ height=”80″ /></a>
    I explain more here but it's pretty much that simple.
    happy blogging.

    The blog I need help with is sensicology.wordpress.com.

  2. thesacredpath
    Member

    Oh way cool. Thanks for posting that.

  3. aw1923
    Member

    np, inspired by Devblog's newest blog, I noticed he was using sandbox theme & had the popup so I looked in the links and that's how I know.

  4. thesacredpath
    Member

    I noticed what appears to be curly quotes in that sample, so I'll post this just incase:

    <a class="thickbox" href="http://sensicology.files.wordpress.com/2009/07/obama-platoon.jpg"><img title="obama-platoon" src="http://sensicology.files.wordpress.com/2009/07/obama-platoon.jpg" alt="obama-platoon" width="68" height="80" /></a>

  5. t3ck
    Member

    Very cool but I'm confused do I need the CSS upgrade for it to work ?

  6. aw1923
    Member

    no, just need it if you want to customize the box appearance. The link I posted to my blog with examples doesn't have the CSS upgrade.

  7. t3ck
    Member

    Okay thank you.

  8. nclinton
    Member

    Does this work for galleries, somehow? I'm looking at the html view, and all I see is [gallery link="file" columns="4"], not the individual photos.

  9. raincoaster
    Member

    No, it does not.

  10. portfoliosarah
    Member

    Where do I copy my CSS code? Sorry, my English is terrible! I'm working on it. hahahah
    bjs. x

  11. 1tess
    Moderator

    @portfoliosarah,

    No CSS is needed! Just insert image as usual. To the html, add " class="thickbox"

    <a class="thickbox" href="http://LINK_TO_IMAGE_FILE.jpg"><img class="alignnone" title="TITLE" src="http://LINK_TO_IMAGE_FILE.jpg.jpg?w=150" alt="" width="150" height="112" /></a>

    This trick will work only if you are using the social vibe widget in your sidebar.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags