How do you get images side by side in wordpress?

by kaseyp
11 replies
  • WEB DESIGN
  • |
I'm trying to get 2 images to be side by side in a wordpress page, but when I put the images next to each other the images aren't aligned even though there exactly the same size. The 2nd image is slightly higher than the first one. And the strange thing is that the images look aligned in the post editor but not when it's posted.

Here's the page that I'm talking about:

About Us | PH Electric
#images #page #side #wordpress #wordpress blog
  • Profile picture of the author Rok Solid
    Yea the WP post editor isn't very reliable for this. Something you can try is to create one graphic with both pictures perfectly aligned.
    Signature

    I don't send traffic traffic to opt in pages anymore. I Do This instead...

    {{ DiscussionBoard.errors[8847210].message }}
  • Profile picture of the author savidge4
    that's bad... I would put the 2 photos together in a photo editor, and include the text underneath as well
    Signature
    Success is an ACT not an idea
    {{ DiscussionBoard.errors[8847215].message }}
  • Profile picture of the author Mr Bill
    Or...you could go into the text (HTML) and arrange them however you like. Make sure you save the page in Text mode to save your changes because as soon as you go back to visual mode wordpress will arrange them they way it likes.

    The images are all squashed up and out of proportion. That's the first thing you need to do. Then try removing the whole string of spaces in your paragraph because Wordpress is seeing that as space you want to show under the photos.

    Code:
    <p style="text-align: left;"><a href="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_1rsz_20131124_210828.jpg"><img class="size-full wp-image-312" alt="rsz_1rsz_20131124_210828" src="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_1rsz_20131124_210828.jpg" width="200" height="230" /></a>                         <a href="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_20131215_185652.jpg"><img class="alignnone size-full wp-image-313" alt="rsz_20131215_185652" src="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_20131215_185652.jpg" width="200" height="230" /></a></p>
    The best way to display two photos side by side if wordpress doesn't want to play (and you don't have all week to fight with it and can't get the gallery to play nice) is to build a little 4 celled table (tables are FINE in this context) and arrange your photos and captions exactly how you want them. They might be old fashioned (according to some new kids) but they work perfectly, are robust and will do what you tell them to do.

    P.S. This thread should be moved to --> Website Design
    {{ DiscussionBoard.errors[8847225].message }}
  • Profile picture of the author Tim3
    Funny, copied that to a test page on my site, works fine for me,

    try this little trick...
    post this in your html editor...

    review of this introductory information and the opportunity of personally present
    our qualifications.

    <img alt="rsz_1rsz_20131124_210828" src="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_1rsz_20131124_210828.jpg" width="200" height="230" /><span style="color: #ffffff;">..........</span><img alt="http://georgephelectric.com/wp-content/uploads/2013/01/rsz_20131215_185652.jpg" src="h**p://georgephelectric.com/wp-content/uploads/2013/01/rsz_20131215_185652.jpg" />

    John Apoin, Project Manager<span style="color: #ffffff;">...........</span>. ...Carlos Morales, Technician
    Signature

    {{ DiscussionBoard.errors[8847528].message }}
  • Profile picture of the author joe ferdinando
    Originally Posted by kaseyp View Post

    I'm trying to get 2 images to be side by side in a wordpress page, but when I put the images next to each other the images aren't aligned even though there exactly the same size. The 2nd image is slightly higher than the first one. And the strange thing is that the images look aligned in the post editor but not when it's posted.

    Here's the page that I'm talking about:

    About Us | PH Electric
    EmbedIt Pro by SuperThemes is a plugin that allows you to enter HTML code in the HTML Snippets field then use a shortcode to show your HTML works great!
    Signature
    {{ DiscussionBoard.errors[8847812].message }}
  • Profile picture of the author Mollywhite
    if you use a wordpress theme with drag & drop builder, that would be simple and easy to get images site by side.
    {{ DiscussionBoard.errors[8847843].message }}
  • Profile picture of the author Moneymaker2012
    I'm trying to get 2 images to be side by side in a wordpress page, but when I put the images next to each other the images aren't aligned even though there exactly the same size. The 2nd image is slightly higher than the first one. And the strange thing is that the images look aligned in the post editor but not when it's posted.

    Here's the page that I'm talking about:

    About Us | PH Electric
    Try this plugin WordPress › Raw HTML Snippets « WordPress Plugins Hope this is suitable for you and one thing i also want to tell you if you don't mind that you site theme is not good choose another theme from wordpress.org there many free themes.
    {{ DiscussionBoard.errors[8847872].message }}
  • Profile picture of the author greg80221
    Why don't you just build a html table, then your descriptions and pictures line up correctly

    <table>
    <tr><td>
    your first picture
    </td><td>
    your second picture
    </td><tr>
    </table>
    {{ DiscussionBoard.errors[8849303].message }}
  • Profile picture of the author laurencewins
    Thanks to everyone for this thread as I also have this problem but will try the tips suggested.
    Signature

    Cheers, Laurence. Writer/Editor/Proofreader.
    Visit my site for more info

    {{ DiscussionBoard.errors[8849330].message }}

Trending Topics