Wrap a very long url

Some time we may need to display a long url in our web-page. On that case, it will break the design as we can’t display a string in multiple lines with there is no space between.

Yes obviously, a link can’t have any space in between them. We can add <br> tag in between url, but the problem is while you are copying the URL, you still need to modify the copied content before using it in browser address bar. So I tried the following solution.

<wbr> tag

Write a helper method as follows:


#This method is used to split the longer urls into few lines.
#We added the tag <wbr> on a regular interval of a string.

def custom_word_wrap(text, max_width=10)
return nil if text.blank?
(text.length < max_width) ?
text :
text.scan(/.{1,#{max_width}}/).join(“<wbr>”)
end

In your view file:

<%= custom_word_wrap(@url_to_display, 55) %>

Outputs:

<%= @url_to_display %>

http://localhost.com/sssssssssssssssssssssoooooooooooooooooommmmmmmmmmmmmmmmmmmmmeeeeeeeeeeeeeeeeeeeeeeeeeebbbbbbbbbbbbbbbbaaaaaaaaaaaaaaaaaaaaaaaadddddddddddddddduuuuuuuuuuuuuuuurrrrrrrrrrrrrrlllllllllllllllll

<%= custom_word_wrap(@url_to_display, 55) %>

http://localhost.com/sssssssssssssssssssssooooooo
ooooooooooommmmmmmmmmmmmmmmmmmmmeeeeeeeeeee
eeeeeeeeeeeeeeebbbbbbbbbbbbbbbbaaaaaaaaaaaaaaaaaaaa
aaaadddddddddddddddduuuuuuuuuuuuuuuurrrrrrrrrrrrrrlllllllllllllllll

Advertisements