WordPress.org

Ready to get started?Download WordPress

Forums

How to insert extra bits of html when you insert an image into post? (2 posts)

  1. automagical
    Member
    Posted 5 years ago #

    Hello, I have made a theme pretty much from scratch, and things seems to be working fine, but I have a minor problem with how I want my images inside my posts to be displayed. Basically I want a gradient background which require four background images, and because of this each image require more classes than I can put on the single image tag. Therefore I have to add a couple of extra div-tags. I normally never do this, but for this paticular effect I can not find any other workarounds, since the image needs to display the background correct no matter the image size. I can do this with a css hack and have all the html and css figured out. The problem is that I want wordpress to insert all of this code when I insert an image into a post:

    <div class='frame-outside'>
    <div class='frame-top-outside'>
    <div class='frame-top-inside'>
    </div>
    </div>
    <div class='frame-bottom-outside'>
    <div class='frame-bottom-inside'>
    <img src='http://url.com/image.jpg' alt='' />
    </div>
    </div>
    </div>

    Can I change the insert image tag to make it insert these extra lines of code when I click the insert image tag? Of course I could paste all of this in manually in each post, but it would be awesome if there is some way to automate it.

    Thank you very much in advance for help with this matter.

  2. esmi
    Forum Moderator
    Posted 5 years ago #

    Personally, I'd add a quicktag button to deal with the extra markup using the Quicktag Extender plugin and code all of the additional markup into that button. I've done this for clients before and it seems to work quite well.

Topic Closed

This topic has been closed to new replies.

About this Topic