Gravatar image not displaying

Question

I'm working through the Michael Hartl's Ruby on Rails Tutorial, and I've added code to display a user's Gravatar image. But it doesn't display.

This is my users helper

module UsersHelper
  # Returns the Gravatar (http://gravatar.com/) for the given user.
  def gravatar_for(user)
    gravatar_id = Digest::MD5::hexdigest(user.email.downcase)
    gravatar_url = "https://secure.gravatar.com/avatar/#{gravatar_id}"
    image_tag(gravatar_url, alt: user.name, class: "gravatar")
  end
end

And this is my show.html.erb

<% provide(:title, @user.name) %>
<div class="row">
  <aside class="col-md-4">
    <section class="user_info">
      <h1>
        <%= gravatar_for @user %>
        <%= @user.name %>
      </h1>
    </section>
  </aside>
</div>

This is the code when i inspect the element

    <img alt="humber" class="gravatar" src="https://secure.gravatar.com/avatar/8e92292186fbb306e253b08d0f3eb993">
    humber

this is the image

The code looks correct so you'll need to provide some additional info? What does the generated `` tag look like? What happens when you visit the gravatar url you're using directly? — Bart Jedrocha, Jul 06 '16 at 12:21
The email i'm using for the user is example@railstutorial.org which is on tutorial. and when i inspect the element on the browser i can see the image src. — helloworld, Jul 06 '16 at 16:00
Hmm, that looks good to me. Do you perhaps have some weird styling on the `.gravatar` CSS class that could be hiding it? Also, it could have something to do with the fact that you're trying to request a HTTPS resource from a non-HTTPS endpoint (e.g. http://localhost:3000) so try changing `gravatar_url` to be `"http://gravatar.com/avatar/#{gravatar_id}"` — Bart Jedrocha, Jul 06 '16 at 17:55

score 10 · Answer 1 · answered Sep 16 '16 at 17:10

10

Probably you did one of exercises in tutorial and wrote custom class to hide images

img {
  display: none;
}

answered Sep 16 '16 at 17:10

150Years

101
1
7

1

That was my problem, thanks for the pointer, I was banging my head for an hour trying to figure this one out. – Allen Wang Jun 04 '17 at 17:57
1

This worked for me too - for people following Hartl's tutorial this is the most likely fix – Adam Nov 05 '18 at 11:58

score 1 · Answer 2 · answered Aug 22 '16 at 04:50

Hmmm.... I tried adding an image tag and added the hash to it to see if it renders(please remove this and use gravatar_for once it works). It did, so here are the steps I did to improve the gravatar_for method. and I hope it helps.

Change the source of the gravatar to http:// from https://
Add more classes to gravatar in the gravatar_for method. It should read image_tag(gravatar_url, alt: user.name, class: "gravatar img img-responsive")

score 1 · Answer 3 · answered May 19 '17 at 10:38

I've solved it!

The tutorial directs you to download the image using curl; but this can results in a corrupt file. Why? When the book was written, the file on the website was a '.png' and today it is a '.svg'. The name has also changed from rails.png to rails-logo.svg.

By following the guide, you download a blank file and save it as a .png, and then rails gives you the middle finger.

score 0 · Answer 4 · answered Jul 06 '16 at 13:17

The email is fetching correctly? I have a method that does something similar, with a default url as param (in case the user email is not registered in gravatar. Check if it can help you:

  def avatar        
    default_url = "http://pcdoctorti.com.br/wp-content/plugins/all-in-one-seo-pack/images/default-user-image.png"
    gravatar_id = Digest::MD5::hexdigest(self.email).downcase
    "http://gravatar.com/avatar/#{gravatar_id}.png?d=#{CGI.escape(default_url)}"
  end

Ps: this is an instance method in User model

score 0 · Accepted Answer · answered Jul 06 '16 at 15:00

0

your code is correct, maybe the user that you are using has no email, or the email don't have an image in gravatar. I would suggest that you validate if the user have an email

def gravatar_for(user)
    if user.email?
        gravatar_id = Digest::MD5::hexdigest(user.email.downcase)
        gravatar_url = "https://secure.gravatar.com/avatar/#{gravatar_id}"
        image_tag(gravatar_url, alt: user.name, class: "gravatar")
    else
        image_tag("/img/avatar_default.png", alt: user.name, class: "gravatar")
    end
end

answered Jul 06 '16 at 15:00

xploshioOn

4,035
2
28
37

I used your code still it doesn't show. is there any gem associated with this that am missing? – helloworld Jul 06 '16 at 16:24
are you sure that you have a gravatar account? try with this email humber.m23@gmail.com in the user. – xploshioOn Jul 06 '16 at 16:26
I added some details in the question. Can you take a look at it? – helloworld Jul 06 '16 at 17:00
seems like everything is ok, if you put the html generated in a html file, it works, then try removing the class in the image_tag. maybe is css issues then – xploshioOn Jul 06 '16 at 18:15
1

Yes i had a problem with css, i set the img-display to none. Thanks – helloworld Jul 06 '16 at 19:23

score 0 · Answer 6 · answered Nov 08 '16 at 19:29

0

I had the same problem, and tried all the solutions given this far (well, the first three anyway) but was left scratching my head. Then I removed the 'secure' from the URL and if worked just fine-- or at least for a link not associated with a gravatar. I mean, i was expecting the default gravatar image to show, and it did!

(I am also following Michael Hartl's course.)

<% hex_digest = Digest::MD5::hexdigest('my_name@gmail.com') %>
<% gravatar_url = "https://gravatar.com/avatar/#{hex_digest}" %>
<%= image_tag(gravatar_url, alt: 'gravatar image') %>

answered Nov 08 '16 at 19:29

PakiPat

1,020
14
27

On reading the comments above, I found one that explained the need to remove the 'secure' bit in the URL. Bart Jedrocha explained that this change is needed when you're trying to access the gravatar from a non-secure (non-HTTPS) endpoint (like your local rails server, localhost:3000. However, when you deploy your app to a secure endpoint (say, Heroku) you might need to reinsert the 'secure' bit. You could do this dynamically by using Rails.evn.production? check. [link](http://stackoverflow.com/questions/1967809/how-to-tell-if-rails-is-in-production). – PakiPat Nov 08 '16 at 19:39

score 0 · Answer 7 · answered Feb 26 '18 at 22:39

I am working through this course currently (Feb 2018) using the online version of the Ruby on Rails Tutorial (Rails 5) book. I found the error to be a left over code in:

/sample_app/app/assets/stylesheets/custom.scss

/* hide all images */
img {
  display: none;
}

Removing that allowed the gravatar image to display correctly for me

score 0 · Answer 8 · answered Oct 31 '18 at 12:51

As of 2018 Michael's helper function gravatar_for has the URL variable defined as:

gravatar_url = "https://secure.gravatar.com/gravatar/#{gravatar_id}"

However Gravatar's documentation instructs you to use:

gravatar_url = "https://www.gravatar.com/avatar/#{gravatar_id}"

The former did not work for me I was getting (404) and the image was appearing broken. The latter worked fine for me.

score 0 · Answer 9 · answered Sep 08 '19 at 19:29

0

In your custom.scss file comment out or remove the lines:

img {
    display: none;
}

answered Sep 08 '19 at 19:29

user3068048

1

Gravatar image not displaying

9 Answers9