og:image vs. apple-touch-icon

Discussion in 'Resolved Suggestions' started by chatloxx, Mar 7, 2015.

  1. chatloxx

    chatloxx Customer

    Hello Pixel Exit team,

    first of all: I bought Core and I really love it up to now. Worth every dollar! :)

    There is one thing, which would be a good feature. Whatever you put in the styles section as Facebook image is set as og:image as well as apple touch icon (meta property="og:image" as content & link rel="apple-touch-icon" as href). If you put in 200x200 pixel, both images are viewed as a square and that's fine. However, facebook recommends 1200x630px as og:image to get a "big" preview picture in the links, which is a great option as it is has a much better appearance in the feeds: https://developers.facebook.com/docs/sharing/best-practices#images

    And now comes the trade-off which one has. It is not a square. Using 1200x630px makes the apple-touch-icon look bad, using a square makes the facebook link preview look bad. (Using 200x200 makes both look good, but it's not retina ready in facebook and automatically uses the old link preview.)

    Therefore I'd recommend to slip this up in two fields:
    • Preview Image for Facebook, 1200x630 recommended
    • Apple Touch Icon for Apple devices, 192x192 (fixed proportion) or bigger recommended
    • (What would be awesome, is an option to remove the "Apple Touch Icon" line from the code)

    Russ likes this.
  2. Russ

    Russ Designer

    I like the idea, we can put it into our next update for 1.4.5. I think it'll be in the same position as the facebook logo(style properties wise) and if you don't fill it out it won't load the code at all.

    Thanks and glad you're liking the style! :)

Let's work together on your next project

Contact us today to talk about how we can help you

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.