Inject a meta tag from a document's body?

Question

I need to add a meta tag (specfically, <meta name="apple-itunes-app" content="app-id=xxxxx">) to a certain page, but the way our templates are set up, it's not possible for me to edit the code for the HEAD tag directly (for corporate, not technical, reasons).

Therefore, is there a way using JQuery within the BODY tag to add this meta tag?

To display an app in the app store in Mobile Safari 6 in a bar at the top of the page. — Steve, Oct 10 '12 at 15:56

Oscar Jara · Accepted Answer · 2016-05-23T19:41:39.880

12

Maybe you can try this:

jQuery:

$('head').append('<meta name="apple-itunes-app" content="app-id=xxxxx">');

Javascript:

document.getElementsByTagName('head')[0].appendChild('<meta name="apple-itunes-app" content="app-id=xxxxx">');

edited May 23 '16 at 19:41

answered Oct 10 '12 at 15:32

Oscar Jara

14,129
10
62
94

1

The jQuery version worked great for me. In my application I _do_ control the head, however I wanted to make this banner dynamic in javaScript. I put the jQuery line here in a script tag as the last thing before and iOS detects it correctly. – benathon Mar 09 '13 at 04:45

score 9 · Answer 2 · answered Oct 10 '12 at 15:33

9

You can add the meta tag but as they're used before the body is even parsed, it's useless.

answered Oct 10 '12 at 15:33

Denys Séguret

372,613
87
782
758

1

I was afraid of that. The above method does write the tag, but as you said it does not work as it should. – Steve Oct 10 '12 at 15:55
Well, technically those would be the correct ways to inject a tag into the head so hopefully if someone wants to do that they'll find the answer. I voted up your answer since there's no way to mark more than one as "right". – Steve Oct 10 '12 at 19:12
That's not entirely true. Certain meta tags work even when they are added after the body has been parsed, see http://stackoverflow.com/questions/3588628/can-i-change-the-viewport-meta-tag-in-mobile-safari-on-the-fly – Johannes Fahrenkrug Oct 14 '15 at 14:05

score 2 · Answer 3 · answered Jul 16 '13 at 09:09

$('head').append(""); << doesn't work, I even saw this in document.ready, like dystroy says: you need the tag before the body is even parsed....

For me, this did the job:

Put this in the head section, it will detect and write the meta before the body is parsed. If you don't have any conditions, just paste the html in the head section:

<script type="text/javascript">
     var isiPad = navigator.userAgent.match(/iPad/i) != null;
        if(isiPad === false){
          document.write('<meta name="apple-itunes-app" content="app-id={xxxxx}">');
        }
</script>

Inject a meta tag from a document's body?

3 Answers3

Linked