Skip to content
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

More control over Opengraph/twitter card #936

Closed
thomasp85 opened this issue Dec 18, 2018 · 6 comments
Closed

More control over Opengraph/twitter card #936

thomasp85 opened this issue Dec 18, 2018 · 6 comments
Labels
feature a feature request or enhancement front end 🌷 General HTML, CSS, and JS issues
Milestone

Comments

@thomasp85
Copy link
Member

The automatic generation of og/twitter card metadata is nice, but it would be great to be able to supply alternative default (and potentially page specific) pictures. The use of logo.png is suboptimal, as this file is best tightly cropped and with a transparent background when used in docs and readme, but this leads to poor look on twitter, where the optimal is a square, slightly padded image with white background.

An example of current look:
screenshot 2018-12-18 at 09 08 43

@jayhesselberth
Copy link
Collaborator

This should be straightforward via params in _pkgdown.yml. A global setting is easy, per-page is harder.

template:
  opengraph:
    img: path/to/img

Change:

og$image <- paste0(site_url, "logo.png")

to, e.g. (need to handle the fig path):

og$image <- pkg$meta$opengraph$img %||% paste0(site_url, "logo.png")

@jayhesselberth jayhesselberth added the feature a feature request or enhancement label Dec 18, 2018
@maelle
Copy link
Collaborator

maelle commented Apr 29, 2019

@jayhesselberth Interested in a PR at least for the global option?

Regarding the page-specific images, can one add such an argument to the vignette YAML header? And then tweak the code somewhere near

opengraph = list(description = "$description$"),
?

@thomasp85 what would you use as an image for gganimate instead of the hex logo? A square logo, or a padded version of the hex with a white background? If the latter is a good default, I wonder where a function helping make and save the padded version (like usethis::use_logo()) could live.

@thomasp85
Copy link
Member Author

I’d use a padded version over white background

@maelle
Copy link
Collaborator

maelle commented Apr 29, 2019

So would a function producing that version, and saving it at the right location (maybe man/figures/og-logo.png), make any sense anywhere? Then pkgdown could use, by order of priority,

  • the logo path indicated in _pkgdown.yml
  • og-logo.png if it exists,
  • logo.png otherwise if it exists,
  • nothing :-)

@thomasp85
Copy link
Member Author

My dream scenario would be that pkgdown did the padding automatically - the requirements for OpenGraph is so different from what is expected from logo.png, that it will only be by chance that it can be used unmodified in OpenGraph...

But in the lack of such automation I'd like what you propose...

@maelle
Copy link
Collaborator

maelle commented May 8, 2019

My dream scenario would be that pkgdown did the padding automatically - the requirements for OpenGraph is so different from what is expected from logo.png, that it will only be by chance that it can be used unmodified in OpenGraph...

From what I've seen in the history of this repo the dependency on magick was dropped though, so I'm not sure doing the conversion here is feasible?

@jayhesselberth & others in charge, are you interested in a PR such that pkgdown could use, by order of priority,

  • the logo path indicated in _pkgdown.yml
  • og-logo.png if it exists,
  • logo.png otherwise if it exists,
  • nothing :-) ?

And maybe a different PR after that to try and make it possible to set per page for articles?

And regarding a helper function that'd pad logo.png+add a white background (using magick), where could it be added? If not here, I could ask over in usethis repo. If not welcome there either, I'm not too sure where it should live.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feature a feature request or enhancement front end 🌷 General HTML, CSS, and JS issues
Projects
None yet
Development

No branches or pull requests

4 participants