WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Word Wrap on text is not working... Please help (7 posts)

  1. schudegroup
    Member
    Posted 5 years ago #

    I'm new to wordpress and I have created a new blog them. The site is still under construction and I'm trying to upload the content. The issue i'm having is that my text is not wrapping around images.

    I have tried using Microsoft live writer and the text will wrap in that program just fine. When I upload the changes the text wrap does not stay. It posts a picture then puts the text at the base of the picture.

    Is there some code that I need to install since my layout is a custom theme? Here is a page to my site so you can see an example of the issue i'm having. http://schudegroup.com/buyers/

    Thanks for everyone's help!

  2. fldtrace
    Member
    Posted 5 years ago #

    Select the photo and align it to left, you will see the option while you are in image editing mode. The text will wrap around.

    You need to do that for every picture mannually inside the wordpress text editor.

  3. schudegroup
    Member
    Posted 5 years ago #

    Thanks fldtrace but I first tried that several times and it did not work. That is why I went to windows live writer to see if that would fix it. Any other suggestions people?

  4. fldtrace
    Member
    Posted 5 years ago #

    It doesn't work because the way the wordpress does it, is to assign a paragraph to each element.

    If you want to have your image aligned to left, after you applied that setting, make sure image is located in the same paragraph with the text that need to wrap the image.
    As example:

    <p>
    <img class="alignleft size-full wp-image-83" width="100" height="100" align="left" alt="aboelata_manal_edit21" src="http://www.jointuse.org/wp-content/uploads/2009/05/aboelata_manal_edit21.jpg" title="aboelata_manal_edit21" style="margin: 0px 10px 0px 0px;"/>
    <strong>Example/strong>
    <br />
    This text will wrap the image.
    </p>

    How do you know that image is in the same paragraph? Just click it and it will show the selector, under text area. Make sure you click somewhere in interior of the text, and upload the image there.

    Another way to do it, if you want to keep the image in a separate paragraph, is to go in code view and apply next code to paragraph in discussion:

    style="float="left"

    over there:

    <p style="float="left">
    
       <img src="path to image" />
    
    </p>

    If you want image to the right:
    style="float="right"

  5. alexanderblake
    Member
    Posted 4 years ago #

    I'm having the same issue. It wraps beautifully in the 'Visual' tab of the editor, but on the itself, it wraps only one line. I've edited the code with so many parameters that I'm beginning to get lost.

    CODE:

    <img class="alignleft" src="http://www.appliedhappiness.org/mediaz/happy_map.jpg" alt="Happiness Mind Map" width="330" height="245" img style="margin: 0px 10px 0px 0px;" /><p style="text-align: left;"><span style="color: #006699;">"Are you happy?" Wow, what a loaded question! That could mean a million different things to a million different people, right? .....etc

    Please, please, please help me get this thing to work.

    http://www.appliedhappiness.org/home/?page_id=121

    I have to finish these last two pages!

    Thanks!

    Blake

  6. alexanderblake
    Member
    Posted 4 years ago #

    Again, in the wp-admin 'Visual' editor, it wraps and looks great, but the only line that wraps it the first few words down at the bottom corner of the picture. Oh, how frustrating.

    This is going to bug the hell out of me.

  7. alexanderblake
    Member
    Posted 4 years ago #

    [Resolved]

    I had to add:

    img.alignright {float:right; margin:0 0 1em 1em}
    img.alignleft {float:left; margin:0 1em 1em 0}
    img.aligncenter {display: block; margin-left: auto; margin-right: auto}
    a img.alignright {float:right; margin:0 0 1em 1em}
    a img.alignleft {float:left; margin:0 1em 1em 0}
    a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

    To my theme's stylesheet.

Topic Closed

This topic has been closed to new replies.

About this Topic