Changes to og:image following best practices from https://github.com/…

[KarlAustin]

…thedaviddias/Front-End-Checklist

If og:image size is less than recommend a warning is printed

If og:image size is larger than recommended a warning is printed and the image resized

The og_image is also used in the schema output, as the image specification didn't work as things were anyway

og:image:width and og:image:height are also set to help when posting links to social media

[lukeorth]

@KarlAustin, thanks for another contribution!

For the og_image param, you mentioned in the updated README that For this to work though og_image and brand_url must be a path inside the assets directory. It doesn't look like Hugo creates an assets directory on site build, so I'm just wondering - is this a new directory that users will need to add to the project before building with Hugo?

[KarlAustin]

Yes it is, assets is supposed to replace static really as static is the older way of doing things. Similarly CSS/JS should go in assets in the theme to be run through minify etc. and then the built CSS gets out into public along with proper fingerprinting/SRI for increased security (on my list to look at this with some configurable options).

[lukeorth]

Thank you, @KarlAustin, that is good info for sure. I did some digging into the Hugo docs regarding the Resources.Get function you're using and this was the first thing that popped up. In the very first sentence they confirm your statement that the /assets directory is used as the default for global Resources, so there's certainly some restructuring I need to do.

Your code looks great, so I'm going to go ahead and merge it. I'm just leaving this comment as a note to myself that I need to come back later and change /static directory to /assets and try to incorporate some of the other changes you recommended.

Thanks again for the great work!