CODEWITHSUNDEEP
ruby-on-railsrubyregex
Luca Romagnoli
Luca Romagnoli

Reputation: 12475

Automatically link URLs and images within html string

Hi i have a string like this:

"<p class='video'>http://vimeo/2342343</p><p class='image'>http://nerto.it/logo.png</p><p class='text'>try to write</p><p class='video'>http://vimeo/2234923</p>"

i have to transform it in a string like this:

"<p class='video'><a href='http://vimeo/2342343'>http://vimeo/2342343</a></p><p class='image'><img src='http://nerto.it/logo.png' /></p><p class='text'>try to write</p><p class='video'><a href='http://vimeo/2234923'>http://vimeo/2234923</a></p>"

so how i can get every element and transform it?

thanks

Upvotes: 6

Views: 5260

Answers (6)

Pan Thomakos
Pan Thomakos

Reputation: 34350

You can use the auto-link function to convert links into actual anchor tags.

auto_link(text_to_convert)

*Notice: Method deprecated or moved This method is deprecated or moved on the latest stable version. The last existing version (v3.0.9) is shown in the link.

If you have more specific use cases you'll probably want to use gsub with a regular expression. For example:

text.gsub(/\<p\s+class=\'image\'\>(.*?)\<\/p\>/, "<p class='image'><img src='\\1' /></p>")

Upvotes: 6

Marcelo Austria
Marcelo Austria

Reputation: 951

Try this simple best gem convert all the url from the text or string into the links. It also convert image url to image tag.

gem install url_link

string =  "Welcome to my website http://www.mywebsite.com"
url_link(format(string))
result => welcome to my website <a href='http://www.mywebsite.com'>http://www.mywebsite.com</a>

image_string = "http://blogspot.com/images/screenshot.png"
url_link(format(image_string))
result => <img src="http://blogspot.com/images/screenshot.png"/>

string = "Welcome to my website http://www.mywebsite.com see the picture http://media.smashingmagazine.com/images/introduction-to-rails/rails.jpg"
url_link(format(string))
result => welcome to my website <a href='http://www.mywebsite.com'>http://www.mywebsite.com</a>see the picture <img src="http://media.smashingmagazine.com/images/introduction-to-rails/rails.jpg"/>

Or try this another one

Helper

def proper_url_link(url_link)
  unless url_link.blank?
   url_link.gsub( %r{(http|https)://[^\s<]+} ) do |url|
      if url[/(?:png|jpe?g|gif|svg)$/]
        "<img src='#{url}' />"
      else
        "<a href='#{url}' target='_blank'>#{url}</a> "
      end
    end
  end
end

def proper_html(html_format)
  unless html_format.blank?
    html_format.html_safe
  end
end

View

html = "<p class='video'>http://www.vimeo.com/2342343</p>

<=proper_html(proper_url_link(html))%>

Upvotes: 0

CodingNightmare
CodingNightmare

Reputation: 1

The new great gem I wants to suggest you for converting all the url from the text into the links is gem link_url. It also works for www where no gem is available like that.

gem install link_url

Example 1: 
LinkUrl.convert('hello I am on www.stackoverflow.com')
Result => hello I am on <a href='http://www.stackoverflow.com'>www.stackoverflow.com</a>
Example 2:
LinkUrl.convert('hello I am on www.stackoverflow.com and my blog is http://www.clecotech.in')
Result => hello I am on <a href='http://www.stackoverflow.com'>www.stackoverflow.com</a> and my blog is <a href='http://www.clecotech.in'>http://www.clecotech.in</a>

Upvotes: 0

Pratik Khadloya
Pratik Khadloya

Reputation: 12889

The auto_link function has been moved to a separate gem here

Upvotes: 5

Rishav Rastogi
Rishav Rastogi

Reputation: 15492

Instead of writing complicated regex, use Nokogiri. The solution below,will convert the links and images perfectly.

require 'rubygems'
require 'nokogiri'

#replace with your string
str = "...."

doc = Nokogiri::HTML.parse(str)
video_nodes = doc.css('.video')
video_nodes.each do |v|
  content = v.content
  link_node = Nokogiri::XML::Node.new('a',doc)
  link_node['href'] = content
  link_node.content = content 
  v.add_child(link_node)
end

img_nodes = doc.css('.image')

img_nodes.each do |img|
  content = img.content
  image_node = Nokogiri::XML::Node.new('img',doc)
  image_node['src'] = content
  img.add_child(image_node)
end
puts doc.to_html

Upvotes: 2

Phrogz
Phrogz

Reputation: 303530

html = "<p class='video'>http://vimeo/2342343</p>
        <p class='image'>http://nerto.it/logo.png</p>
        <p class='text'>try to write</p>
        <p class='video'>http://vimeo/2234923</p>"

linked = html.gsub( %r{http://[^\s<]+} ) do |url|
  if url[/(?:png|jpe?g|gif|svg)$/]
    "<img src='#{url}' />"
  else
    "<a href='#{url}'>#{url}</a>"
  end
end

puts linked
#=> <p class='video'><a href='http://vimeo/2342343'>http://vimeo/2342343</a></p>
#=> <p class='image'><img src='http://nerto.it/logo.png' /></p>
#=> <p class='text'>try to write</p>
#=> <p class='video'><a href='http://vimeo/2234923'>http://vimeo/2234923</a></p>

Upvotes: 5

Related Questions