DocHead for Meteor

DocHead is an isomorphic way to manipulate document.head for Meteor apps.

With DocHead, you can easily set title and meta tags both in client and server using a single API. In the server side it'll use FlowRouter SSR.

Installation

meteor add kadira:dochead

Usage

In the Client Side, you can use DocHead anywhere in your app. But in the server, you need to use DocHead inside a React Component. Otherwise, it can't work properly.

In the server, you need to use kadira:flow-router-ssr

API

DocHead.setTitle(titleName)

Set title to the page.

1var title = "FlowRouter Rocks";
2DocHead.setTitle(title);

DocHead.getTitle()

Get the document title.

1var title = DocHead.getTitle();
2console.log("This is the document.title", title);

DocHead.addMeta(metaInfo)

Add a Meta tag.

1var metaInfo = {name: "description", content: "FlowRouter SSR is Awesome"};
2DocHead.addMeta(metaInfo);

DocHead.addLink(metaInfo)

Add a Link tag.

1var linkInfo = {rel: "icon", type: "image/png", href: "/icon.png"};
2DocHead.addLink(linkInfo);

DocHead.addLdJsonScript(jsonObj)

Add a Script tag with type of application/ld+json.

1var richSnippet = { '@context': 'http://schema.org', '@type': 'Organization', url: 'http://www.example.com', logo: 'http://www.example.com/images/logo.png' };
2DocHead.addLdJsonScript(richSnippet);

DocHead.loadScript(scriptName, options, callback) - [client only]

Load an script dynamically from the client side of your app. Both options and callback are optional.

Behind the scene DocHead.loadScript uses load-script npm module. Visit here to learn more about options.

1var gaScript = 'https://www.google-analytics.com/analytics.js';
2DocHead.loadScript(gaScript, function() {
3    // Google Analytics loaded
4    ga('create', 'UA-XXXX-Y', 'auto');
5    ga('send', 'pageview');
6});

Testing the package

meteor test-packages ./ --port 3010