Home>Support>PageBuilder will not wrap URLs

PageBuilder will not wrap URLs

By wireb, 8 years ago. Last reply by wireb, 8 years ago.

If you have created multiple columns a long enough URL will overlap into the column right of it. To try to resolve this I am having to hyper-link an abbreviated that URL.

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 4 months ago Alex S
    Hi, I Work Here

    Hi Wire,

    Do you have a public URL where we can take a look at what’s going on? If you need to keep this URL private from other users, just select “Private Reply” on the bottom right of the comment box.

  2. 8 years, 4 months ago Private Message - wireb

    This is a private message.

  3. 8 years, 4 months ago Alex S
    Hi, I Work Here

    Hi Wireb,

    You can fix this with some custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

    .textwidget p a {
      word-wrap: break-word;
}

    You might also need to install the SiteOrigin CSS Editor.

  4. 8 years, 4 months ago wireb

    Should this not be integrated into PB to avoid URLs colliding into the column to the right?

    How do you access PB’s CSS eiditor?

  5. 8 years, 4 months ago Alex S
    Hi, I Work Here

    Hi Wire,

    This isn’t something we’re willing to enforce so we leave it up to the theme. Basically, it can have adverse affects where long words can be broken up at undesired locations as the functionality is, well it’s quite new and not very well regarded at this time. So we’re unwilling to force this on users.

    It should also be noted that your use case is very uncommon.

    As referenced above, as you’re not using one of our themes you’ll have to use a CSS plugin. We personally recommend ours but you could also use Jetpacks Custom CSS module or something similar. Page Builder does not have a CSS included.

  6. 8 years, 4 months ago wireb

    Hi Alex,

    I understand now. Downloaded and activated the CSS Editor and got it working using Siteorigin’s CSS editor. Easy/peasy as long as I use that script you gave me.

    Thank you for your assistance.

    WireB

  7. 8 years, 3 months ago wireb

    Sorry to have to again bring this up, if the content has:

    <ol>
 	<li>TEXACO</li>
 	<li>SHELL ref: http://www.nasdaq.com/article/royal-dutch-shell-saudi-aramco-to-break-up-motiva-partnership-20160316-01135</li>
 	<li>JIFFY LUBE</li>
 	<li>QUAKER STATE</li>
 	<li>PENZOIL</li>
 	<li>RAINEX,CLASSIC CAR WAX</li>
 	<li>FIX A FLAT</li>
 	<li>EQUILLON OIL</li>
 	<li>MOTIVA OIL</li>
</ol>

    The URL overlaps the column to its right – The script:

    does not account for the Increase Indent tag.

  8. 8 years, 3 months ago Alex S
    Hi, I Work Here

    Hi Wire,

    I do not recommend doing this but you can fix this for all instances with the following CSS. Please navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.

    a, p, li, span, div, h1, h2, h3, h4, h5, h6 {      word-wrap: break-word;}

    You might also need to install the SiteOrigin CSS Editor.

  9. 8 years, 3 months ago wireb

    Hi Alex,

    I will just use the tags I need, so no use for the header text tag.

    As always, thank you for your assistance and resolving issues. I am a user of the SO CSS editor.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More