[resolved] Server side image captions (3 posts)

  1. tripleX2k7
    Posted 8 years ago #

    Sorry if this has been asked before - I wasn't exactly sure what to search for so didn't find much.

    The easiest way to explain what I want to do is by using the example of smilies on wordpress. Enter :) or :grin: etc. and WordPress will convert it to an img tag on the server side.

    What I want to do is use this feature to add a script that will convert something like this:
    <img src="xyz.jpg" alt="A nice picture />
    to something like this:

    <div class="pic">
      <div class="pic-img">
        <img src="xyz.jpg" alt="A nice picture">
      <div class="pic-capt">
        A nice picture

    Does anybody know how I could achieve this? I know it can be done on the client side with Javascript but I would prefer it done on the server side (at the same time as the smilies are done - see my example above).

    Thanks a lot,

  2. Kafkaesqui

    Posted 8 years ago #

    The following bit of code could work as a plugin, but could also just be dropped into your theme's functions.php (if it sports one -- if not, you can add one):


  3. tripleX2k7
    Posted 8 years ago #

    Thanks - that's exactly what I wanted.

    My problem now in the CSS, is that I don't have a set width for my images. I want my '.pic' div to only be as wide as the image itself and for the '.pic-capt' div to be 100% of the width of '.pic' so I can center the caption.
    But I can't figure out how to do this (preferably without using any 'style' attributes in the XHTML).

Topic Closed

This topic has been closed to new replies.

About this Topic