Inserting and Formatting Images in Wordpress

Discussion in 'HTML & Website Design' started by kevb8ll, Jan 25, 2008.

  1. #1
    Hi guys, I hope this is the correct place.

    I have a problem with my site, in that all inserted images are forced left justified.

    I posted on the WP forum and someone showed me this code:

    /* Begin Images */
    .png { behavior: url(http://weswapu.com/swap/wp-content/themes/mandigo/js/iepngfix.htc.php?blank=http://weswapu.com/swap/wp-content/themes/mandigo/images/1x1.gif); }

    p img { max-width: 95%; }

    .entry img {
    float: left;
    margin: 3px 10px 3px 0px;
    background: #fff;
    border: 1px solid #333;
    padding: 3px;
    }

    img.nofloat, img.nowrap, .nofloat img, .nowrap img, .smallattachment img, .attachment img, .entry img.wp-smiley { float: none; }

    .entry img.wp-smiley {
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    }

    img.noborder {
    background: inherit;
    border: 0;
    padding: inherit;
    }

    img.centered {
    display: block;
    margin-left: auto;
    margin-right: auto;
    float: none;
    }

    img.alignright, img.alignleft {
    display: inline;
    }

    .alignright { float: right; }

    .alignleft { float: left }
    /* End Images */


    I want some images left, some right.

    The same person then told me to do this:

    You just need to use the classes (as I said above) to position your images.

    I assume all your posts/entries are inside a div class "entry" and inside that ALL your images ae floated to the left, by default - see the
    .entry img { etc....
    rule in your stylesheet.

    Next, if you want your image centered, you add the "centered" class to the code:
    <img src="whatever.jpg" class="centered" alt="" />
    For right:
    <img src="whatever.jpg" class="alignright" alt="" />
    Also, you can add the class "noborder" if you wish so.


    The thing is, I'm new to this and my response of asking for clarification was greated with if you want to maintain a site find out how to do it. Well that's what I thought I was doing!!

    Anyway - can anyone help understand what I need to do and where the first style sheet info is as I can't find it.

    Thanks.
     
    kevb8ll, Jan 25, 2008 IP
  2. QiSoftware

    QiSoftware Well-Known Member

    Messages:
    805
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    158
    #2
    I think what the helper was trying to say is it is kind of trial and error. Make backups of your original template and css files. To find the name of your css file search on css while viewing your blog's source.

    You may also try an override within the post:

    
    <div>
    
    <img src=whatever.jpg align="right">  text of the blog post....
    
    </div>
    
    Q...
    
    Code (markup):
     
    QiSoftware, Jan 25, 2008 IP
  3. kevb8ll

    kevb8ll Active Member

    Messages:
    44
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    93
    #3
    Thanks Q - I tried the div work around and that was no good.

    I can only find 2 css files, neither of which have the above - however matey from the other forum must have found something!

    Doing my head in.
     
    kevb8ll, Jan 25, 2008 IP
  4. Valve-Hosting

    Valve-Hosting Peon

    Messages:
    1,071
    Likes Received:
    31
    Best Answers:
    0
    Trophy Points:
    0
    #4
    It's this

    p img { max-width: 95%; }

    It's forcing all imgs to float to the left.

    Delete

    float:left;

    ;)
     
    Valve-Hosting, Jan 26, 2008 IP
  5. kevb8ll

    kevb8ll Active Member

    Messages:
    44
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    93
    #5
    Thanks for replying, my problem is I can't find that section of code to remove the float command.

    Does anyone know where I'd find it.

    As I said the only css files I can find don't have it in.
     
    kevb8ll, Jan 26, 2008 IP
  6. Valve-Hosting

    Valve-Hosting Peon

    Messages:
    1,071
    Likes Received:
    31
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Give me the URL and i'll find it for you ;)
     
    Valve-Hosting, Jan 26, 2008 IP
  7. kevb8ll

    kevb8ll Active Member

    Messages:
    44
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    93
    #7


    Thanks for that.
     
    kevb8ll, Jan 26, 2008 IP
  8. Valve-Hosting

    Valve-Hosting Peon

    Messages:
    1,071
    Likes Received:
    31
    Best Answers:
    0
    Trophy Points:
    0
    #8
    It's in a file called 'style.css.php' in a folder called


    ;)
     
    Valve-Hosting, Jan 26, 2008 IP
  9. kevb8ll

    kevb8ll Active Member

    Messages:
    44
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    93
    #9
    Thanks very much
     
    kevb8ll, Jan 26, 2008 IP