WordPress.org

1. tripleX2k7
   Member
   Posted 4 years ago #

   Hi,
   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>
     <div class="pic-capt">
       A nice picture
     </div>
   </div>

   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,
   Rob

2. Kafkaesqui
   Moderator
   Posted 4 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):

   http://wordpress.pastebin.ca/896040

3. tripleX2k7
   Member
   Posted 4 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.