New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is there any way to have a proper thumbnail for twitter? #7

Closed
thodorisbais opened this Issue Oct 20, 2017 · 23 comments

Comments

Projects
None yet
4 participants
@thodorisbais

thodorisbais commented Oct 20, 2017

Right now it is displayed like this, which I am not that fond of
screen shot 2017-10-20 at 21 55 25

@artemsheludko

This comment has been minimized.

Owner

artemsheludko commented Oct 29, 2017

To be honest, I do not know. I never thought about it. If I find a solution I will write to you.

@thodorisbais

This comment has been minimized.

thodorisbais commented Oct 30, 2017

Yes, I believe it would be a great step for this project to also support such a feature.
Let me know if you need any help.

@artemsheludko

This comment has been minimized.

Owner

artemsheludko commented Oct 31, 2017

Okay, thanks!

@kentonh

This comment has been minimized.

Contributor

kentonh commented Nov 9, 2017

This should probably be done through Twitter cards and if that's being added, it might be good to add Facebook Open Graph data

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 10, 2017

I will take a look until EOD and close the issue if it is the case!
Thanks a lot @kentonh anyways!

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 11, 2017

Was a bit late (Friday hah), will do it today.

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 11, 2017

Solution looks good, but how could we enhance it so that the image of the post is being displayed in the thumbnail? @kentonh
screen shot 2017-11-11 at 22 04 59

@kentonh

This comment has been minimized.

Contributor

kentonh commented Nov 11, 2017

I️ think I️ need to update the image url in the code. It’s working on my local fork, but it must be correct for file structure.

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 11, 2017

@kentonh since I noticed it was merged, I thought it would be "plug'n'play", but of course, the project itself is mostly specific to Artem's details.
However, I'm still facing some trouble. Could you please help? https://github.com/toubou91/toubou91.github.io

@kentonh

This comment has been minimized.

Contributor

kentonh commented Nov 12, 2017

@artemsheludko I've made a new PR #12 to clean up the implementation.

@kentonh

This comment has been minimized.

Contributor

kentonh commented Nov 12, 2017

@toubou91 I've made a new PR that removes the need to edit _includes/head.html for your specific site implementation. Once merged, you should be able to update and all social graph and twitter card meta information will be determined via Jekyll's _config.yml file

@artemsheludko

This comment has been minimized.

Owner

artemsheludko commented Nov 12, 2017

@kentonh Thank you for your time. Good job!

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 12, 2017

Gonna check in a bit, thanks a lot!

@thodorisbais

This comment has been minimized.

thodorisbais commented Nov 12, 2017

@kentonh for facebook and linkedin it seems to work fine, but for twitter I keep having the same issue, as depicted above.

@thodorisbais

This comment has been minimized.

thodorisbais commented Dec 11, 2017

Wow @artemsheludko , 29 days ago I left this repo with less than 90 forks, good job man 👍 .
Sorry for my inactivity guys, other stuff kept me away from testing this feature.
Hopefully, I will find some time during this weekend.

@artemsheludko

This comment has been minimized.

Owner

artemsheludko commented Dec 11, 2017

@toubou91 Thank you for your active participation in the project.

@thodorisbais

This comment has been minimized.

thodorisbais commented Jan 8, 2018

Still the same. It doesn't work for twitter. I have merged the latest changes, but of course something might have gone wrong again. Could you please check?

@gutblog

This comment has been minimized.

Contributor

gutblog commented Feb 11, 2018

I think I just solved this issue with my pull request: #24

Example tweet with card: https://twitter.com/gutfeelingblog/status/962733501429592064

@thodorisbais

This comment has been minimized.

thodorisbais commented Feb 25, 2018

I just synced my fork, but it still doesn't work for Twitter:

screen shot 2018-02-25 at 21 32 17

I mean, it only displays a card, instead of the post's image, as you showed in your last comment @gutblog

@gutblog

This comment has been minimized.

Contributor

gutblog commented Feb 25, 2018

@thodorisbais Please try your article's URL in https://cards-dev.twitter.com/validator and see if it shows you a valid card. AFAIK The validator will pull the most recent version of your site, so if you get a valid card using the validator, it should propagate to the rest of Twitter within a few minutes.

Otherwise, we might be able to help if you post the error from the Twitter validator, along with the final HTML meta tag snippet that it is reading in your site to try to construct the card.

@thodorisbais

This comment has been minimized.

thodorisbais commented Feb 25, 2018

@gutblog the card is said to be properly validated from the site:

screen shot 2018-02-25 at 22 56 57

Am I configuring the post images in a wrong way maybe in my fork?

@gutblog

This comment has been minimized.

Contributor

gutblog commented Feb 25, 2018

@thodorisbais Your final, compiled code:

<meta name="twitter:image:src" content="/assets/img/git-logo.png">

Twitter images need to be absolute URLs if I am not mistaken (they must include your website's domain name). The culprit is your _config.yml file, which does not have your site's URL defined. Change your _config.yml line 6 from:

url: "" # the base hostname & protocol for your site, e.g. http://example.com

to

url: "https://thodorisbais.github.io" # the base hostname & protocol for your site, e.g. http://example.com

and your Twitter photo should start working!

@thodorisbais

This comment has been minimized.

thodorisbais commented Feb 25, 2018

OH. MY. GAD.
We learned something today!
Many thanks @gutblog 😃
(Finally) closing (after 4 months 😆 )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment