WordPress.org

Ready to get started?Download WordPress

Forums

Specify a class for IMG inserted with visual editor (5 posts)

  1. Spiken
    Member
    Posted 5 years ago #

    How do I specify a certain class for all images inserted with the visual editor / the [img]-button when I'm in the admin-part, with an older browser? Say I want all IMG-tags to have the class "milk".

    The IMG-tags I get now are like: <a href="path/imgname"><img class="alignnone size-full wp-image-425" title="imgname" src="path/imgname" alt="" width="500" height="334" /></a>

    The IMG-tag I want is: <a href="path/imgname"><img class="alignnone size-full wp-image-425 <strong>milk</strong>" title="imgname" src="path/imgname" alt="" width="500" height="334" /></a>

    To be clear: I want this done automagicly, so I don't have to do it in the html editor each and every time. I guess I should be editing wp-include/media.php or something?

  2. Samuel B
    moderator
    Posted 5 years ago #

  3. Spiken
    Member
    Posted 5 years ago #

    I don't really want a big plugin, just change the code for the insertion.

  4. Spiken
    Member
    Posted 5 years ago #

    No one has a clue? :(

  5. comprepairgurus
    Member
    Posted 4 years ago #

    When you say "Visual Editor", are you saying you don't have the ability to choose HTML view in your posts? If so thats a whole nother problem. But if you do have HTML view, read on.

    This is actually pretty simple. All you need to do is style your images using your style sheet. Here's how...

    If you don't have an img class setup in your style sheet, you should first add something like...

    .entrybody img{
    margin:0;
    padding:0;
    border:none;
    }

    Note, The div class on my posts is entrybody, yours may be different. Also this will style every image, in all your posts.

    Next to style your images differently, ie. float left, float right, etc. You'll want to use a class selector, as follows....

    .entrybody img.leftfloat{
    margin:0 10px;
    padding:0;
    border:none;
    float:left;
    }

    Now to call to this class selector in your post, your img tag will look something like this.

    <img src="http://www.yoursite.com/wp-content/uploads/2009/08/myprettyimage-150x150.png" alt="MyPrettyImage" title="MyPrettyImage" width="150" height="150" class="leftfloat" />

    I realize the original poster asked for this almost a year ago, but I'm sure it will still prove helpful to someone. Good luck.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags