Specify a class for IMG inserted with visual editor

  • spiken

    (@spiken)


    15 years, 6 months 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?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Samuel B

    (@samboll)

    15 years, 6 months ago

    Why not just use a plugin?
    http://www.soderlind.no/archives/2006/01/03/imagemanager-20/

    Thread Starter spiken

    (@spiken)

    15 years, 6 months ago

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

    Thread Starter spiken

    (@spiken)

    15 years, 5 months ago

    No one has a clue? 🙁

    comprepairgurus

    (@comprepairgurus)

    14 years, 8 months 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-150×150.png&#8221; 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.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Specify a class for IMG inserted with visual editor’ is closed to new replies.

Tags