How do I reliably inject a meta tag onto a SharePoint page without editing the master page?

Question

I don't want to edit any master pages for obvious reasons given that I am on SharePoint Online. But I am trying to achieve responsiveness on my sites. For this, I would really like to use the viewport meta tag.

Something like <meta name="viewport" content="width=device-width, initial-scale=1.0">

How could I inject that? I've seen some javascript to inject a meta tag, but my fear is this would occur "too late" and even if it works in some of my tests... I may not know when it isn't working in production (or, I could write some more JS to check this, but I wouldn't want faulty code in production anyway).

Answer 1

Use the built in Search Engine optimization settings (Settings > Site Collection Administration > Search Engine Optimization). These options allow for added SEO tags but can be "hijacked" for any metadata tag ;-)

More info here

Answer 2

This solution is working very well for me. I was unaware some meta tags can still be appended after the head is parsed with the desired effect.

https://stackoverflow.com/questions/3588628/can-i-change-the-viewport-meta-tag-in-mobile-safari-on-the-fly

var metaTag=document.createElement('meta');
metaTag.name = "viewport"
metaTag.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
document.getElementsByTagName('head')[0].appendChild(metaTag);