I would like to use non-public images from an S3 bucket in my site's meta tag.
My <head> looks like this:
<meta property="og:image" content="<%= asset_path #list.image %>" />
And source like this:
<meta property="og:image" content="//mybucket-main.s3.amazonaws.com/uploads/asdflkj/myimage.jpg" />
My images render perfectly when I include them throughout the site:
<%= image_tag #list.image %> becomes
<img src="//mybucket.s3.amazonaws.com/uploads/asdflkj/myimage.jpg" alt="myimage" />.
(Incidentally, it even renders in this post if I use the real src.)
I receive this error from https://developers.facebook.com/tools/debug/sharing:
Object Invalid Value: Object at URL 'https://example.com/lists/1462' of type 'website' is invalid because the given value '//mybucket.s3.amazonaws.com/uploads/image.jpg' for property 'og:image:url' could not be parsed as type 'url'.
Please help!
Related
I have a page with article, and I can set from back-end an image for the article. In the show action I would like to obtain the meta tag og:image to share the article in facebook also with the image.
I show the image with:
<%= image_tag #article.image_url, :class => "img-fluid" %>
but I am not able to have the image also in facebook post automatically when I copy and paste the url in facebook.
Do you have any suggestion?
Thank you in advance.
According to this article here, you need a bit more setup.
https://www.lewagon.com/blog/setup-meta-tags-rails
Create default meta tags in config/meta.yml and load them in an initializer:
meta_product_name: "Product Name"
meta_title: "Product name - Product tagline"
meta_description: "Relevant description"
meta_image: "cover.png" # should exist in `app/assets/images/`
# config/initializers/default_meta.rb
# Initialize default meta tags.
DEFAULT_META = YAML.load_file(Rails.root.join("config/meta.yml"))
You can use them like this in the application.html.erb
<title><%= meta_title %></title>
<meta name="description" content="<%= meta_description %>">
<!-- Facebook Open Graph data -->
<meta property="og:title" content="<%= meta_title %>" />
<meta property="og:type" content="website" />
...
I shortened it but see the article for the full code.
For dynamic titles or images use Rails' content_for method and create a helper method:
<!-- app/views/any_model/any_view.html.erb -->
<% content_for :meta_image, image_path(#any_model.photo.path) %>
And the helper would look like this:
# app/helpers/meta_tags_helper.rb
module MetaTagsHelper
def meta_image
meta_image = (content_for?(:meta_image) ? content_for(:meta_image) : DEFAULT_META["meta_image"])
# little twist to make it work equally with an asset or a url
meta_image.starts_with?("http") ? meta_image : image_url(meta_image)
end
end
Again, shortened, but you'll find the full code in the source.
I have a Rails personality test app that uses AJAX to render the questions and show the results.
I have been attempting to share personality test results via Facebook by sending the variable to one of my dashboard Rails controller to dynamically create tags.
However, the variable is nil when the page is first loaded (which causes an error), so I fixed it by adding a conditional (in application.html.erb):
<% if #cat %>
<meta property="og:title" content="You got <%= #cat.name %>!"/>
<meta property="og:image" content="<%= #cat.picture %>" />
<meta property="og:description" content="<%= #cat.description%>" />
<meta property="og:url" content="https://mysite" />
<meta property="fb:app_id" content= "<%=ENV['FACEBOOK_APP_ID']%>" />
<meta property="og:type" content="website">
<% end %>
Facebook does not recognize the tags when I checked the sharing debugger. I also tried initializing with another object (home controller):
def index
if params.has_key?("cat")
#cat = Cat.find_by(name: params["cat"])
else
#cat = Cat.find_by(name: "Colonel Meow")
end
end
With this, Facebook does not render the new value, but renders the old value instead. I put a debugger in my application.html to make sure the variables were changing (they did). Facebook did not refresh though.
Is there a way to use a conditional when assigning the tags? Or to refresh the tags so Facebook uses the new variable?
How can you get asset_path to return an absolute URL?
I need the absolute URL for a meta tag like so:
<meta property="og:image" content="<%= asset_path('logo_400x200.jpg') %>" />
The problem with asset_path here is that it outputs a URL with "//site.com/logo_400x200.jpg" and the meta tag needs an absolute path.
Any ideas on how to get an absolute path with the Rails asset_path?
Use asset_url
<meta property="og:image" content="<%=asset_url('logo_400x200.jpg') %>" />
Use asset_url to have the protocol added as well.
I have some dynamic images defined as follows on my page:
<%= image_tag(#recipe.image.url(:fixed), :class => 'recipe_image_show') %>
I am looking for a way to define og:image with this code. The og:description code seen below works perfectly:
<meta property="og:description" content= "<%= #recipe.description %>" />
But if I use the code below then it doesn't want to work:
<meta property="og:image" content='<%= image_tag(#recipe.image.url(:fixed), :class => 'recipe_image_show') %>'/>
Any suggestions? I realised I have used single quotes here but using double quotes for some reason results the page to disregard the '/>' part of the meta tag and display it as text.
As per the chat discussion, OP is hosting the images on S3.
So, define the meta tag as below:
<meta property="og:image" content='<%= #recipe.image.url(:fixed) %>'/>
This will be evaluated to:
<meta property="og:image" content='https://s3....amazonaws.com/path/to/image.jpg'/>
NOTE:
If image was stored on the your own application server then you could use it as:
<meta property="og:image" content='<%= image_url #recipe.image.url(:fixed) %>'/>
if you are on rails 6 with wepback this one worked for me
- meta 'og:image': "#{asset_pack_url "static/image.webp"}"
check asset_pack_url on github for reference
your image path may vary, lookup manifest.json for this manner
Use the tool https://developers.facebook.com/tools/debug/
Click "Scrape Again" to reload Facebook Cache
Use full path with image_url("example.png")
I am developing a Rails application and I wish to use the open graph protocol so that on the "articles" page perople can link to social media (facebook, twitter, and google+) to recommend/like etc the article.
As part of the this I endevour, unsuccessfully to set og metatags for the url, within the head section of the page. From the code partial ogmeta.html.erb
<meta property="og:title" content='<%= meta[:title] || "DrillInvestor" %>'>
<meta property="og:type" content='<%= meta[:type] || "website" %>'>
<meta property="og:image" content='<%= meta[:image] || "http://www.whatever.com/image.jpg" %>'>
<meta property="og:url" content='<%= meta[:url] || "post_url(#post)" %>'>
Which when I view the page source I see
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<meta property="og:title" content='DrillInvestor'>
<meta property="og:type" content='website'>
<meta property="og:image" content='http://www.whatever.com/image.jpg'>
<meta property="og:url" content='post_url(#post)'>
What I am trying to pass as the url I can see from a print statement in the posts controller
puts "==================="
puts "url = " + post_url(#post).to_s
I see url = http://quiet-fortress-3338.herokuapp.com/posts/drill-01-more-updates which is what I am want, in this case, to see as the og:url.
I am a recovering COBOL pogrammer and sometimes (well perhaps more than that) lose my way with this sort of stuff.
If I hardcode the og:url I get the appropriate page. I have tried a numer of dfferent things including#{} enclosing the post_url(#post) etc.
Thanks in advance and any help welcome
Pierre
You need to get rid of the quotes around "post_url(#post)". Just change it to post_url(#post). Note that in your print statement you don't have it enclosed in quotes and it works.
As an aside, you don't need to call to_s in either case - post_url(#post) returns a string.