kadirahq/meteor-dochead

Name: meteor-dochead

Owner: KADIRA

Description: Isomorphic way to manipulate document.head for Meteor apps

Created: 2015-07-29 09:59:16.0

Updated: 2018-04-23 21:21:16.0

Pushed: 2016-07-06 14:45:35.0

Homepage: null

Size: 28

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

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

or 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.

title = "FlowRouter Rocks";
ead.setTitle(title);

DocHead.getTitle()

Get the document title.

This API is reactive on the client. It only detect changes you made with DocHead.setTitle().

title = DocHead.getTitle();
ole.log("This is the document.title", title);

DocHead.addMeta(metaInfo)

Add a Meta tag.

metaInfo = {name: "description", content: "FlowRouter SSR is Awesome"};
ead.addMeta(metaInfo);

DocHead.addLink(metaInfo)

Add a Link tag.

linkInfo = {rel: "icon", type: "image/png", href: "/icon.png"};
ead.addLink(linkInfo);

DocHead.addLdJsonScript(jsonObj)

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

richSnippet = { '@context': 'http://schema.org', '@type': 'Organization', url: 'http://www.example.com', logo: 'http://www.example.com/images/logo.png' };
ead.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.

gaScript = 'https://www.google-analytics.com/analytics.js';
ead.loadScript(gaScript, function() {
// Google Analytics loaded
ga('create', 'UA-XXXX-Y', 'auto');
ga('send', 'pageview');

DocHead.removeDocHeadAddedTags()

When you add meta tags multiple times, older tags will be kept in the document.head. So, we need to clean them. For that, we can use this API.

Practially, we can use this before a route change happen.

DocHead.removeDocHeadAddedTags() is already added to FlowRouter SSR.

This API only functioning in the client. In the server, this does nothing.

Testing the package

or test-packages ./ --port 3010