diff --git a/package.json b/package.json
index ca7c548d9..2fa61953e 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,8 @@
     "react-komposer": "^1.4.1",
     "react-modal": "^0.6.1",
     "react-mounter": "^1.1.0",
-    "react-no-ssr": "^1.0.1"
+    "react-no-ssr": "^1.0.1",
+    "react-helmet": "^2.3.1"
   },
   "private": true,
   "devDependencies": {
diff --git a/packages/base-components/lib/common/HeadTags.jsx b/packages/base-components/lib/common/HeadTags.jsx
new file mode 100644
index 000000000..df0a55ef4
--- /dev/null
+++ b/packages/base-components/lib/common/HeadTags.jsx
@@ -0,0 +1,31 @@
+import Helmet from 'react-helmet';
+
+const HeadTags = ({url, title, description, image}) => {
+	return (
+		<Helmet
+			title={title}
+			base={{href: Telescope.utils.getSiteUrl()}}
+			meta={[
+				{charset: "utf-8"},
+				{name: "description", content: description},
+				// facebook
+				{property: "og:type", content: "article"},
+				{property: "og:url", content: url},
+				{property: "og:image", content: image},
+				{property: "og:title", content: title},
+				{property: "og:description", content: description},
+				//twitter
+				{name: "twitter:card", content: "summary"},
+				{name: "twitter:image:src", content: image},
+				{name: "twitter:title", content: title},
+				{name: "twitter:description", content: description}
+			]}
+			link={[
+				{rel: "canonical", href: Telescope.utils.getSiteUrl()},
+				{rel: "shortcut icon", href: Telescope.settings.get("favicon", "/img/favicon.ico")}
+			]}
+		/>
+	);
+};
+
+module.exports = HeadTags;
\ No newline at end of file
diff --git a/packages/base-components/lib/common/Header.jsx b/packages/base-components/lib/common/Header.jsx
index d99d49270..ee69846b7 100644
--- a/packages/base-components/lib/common/Header.jsx
+++ b/packages/base-components/lib/common/Header.jsx
@@ -6,7 +6,7 @@ const Messages = Core.Messages;
 
 const Header = ({currentUser}) => {
   
-  ({Logo, ListContainer, CategoriesList, NewPostButton, UserMenu, AccountsMenu} = Telescope.components);
+  ({Logo, ListContainer, CategoriesList, NewPostButton, UserMenu, AccountsMenu, HeadTags} = Telescope.components);
 
   const logoUrl = Telescope.settings.get("logoUrl");
   const siteTitle = Telescope.settings.get("title", "Telescope");
@@ -14,6 +14,9 @@ const Header = ({currentUser}) => {
 
   return (
     <div className="header-wrapper">
+
+      <HeadTags url={Telescope.utils.getSiteUrl()} title={siteTitle} description={tagline} image={logoUrl} />
+
       <header className="header">
 
         <div className="logo">
diff --git a/packages/base-components/lib/components.js b/packages/base-components/lib/components.js
index 7bbfe7ef9..d2ab4e4a2 100644
--- a/packages/base-components/lib/components.js
+++ b/packages/base-components/lib/components.js
@@ -6,6 +6,7 @@ Telescope.registerComponent("Header", require('./common/Header.jsx'));
 Telescope.registerComponent("Layout", require('./common/Layout.jsx'));
 Telescope.registerComponent("Logo", require('./common/Logo.jsx'));
 Telescope.registerComponent("Flash", require('./common/Flash.jsx'));
+Telescope.registerComponent('HeadTags', require('./common/HeadTags.jsx'));
 Telescope.registerComponent("FlashMessages", require('./common/FlashMessages.jsx'));
 Telescope.registerComponent("NewsletterForm", require('./common/NewsletterForm.jsx'));
 Telescope.registerComponent("Icon", require('./common/Icon.jsx'));
diff --git a/packages/base-components/lib/posts/PostPage.jsx b/packages/base-components/lib/posts/PostPage.jsx
index d5c28d80c..965228592 100644
--- a/packages/base-components/lib/posts/PostPage.jsx
+++ b/packages/base-components/lib/posts/PostPage.jsx
@@ -1,6 +1,6 @@
 const PostPage = ({document, currentUser}) => {
   
-  ({ListContainer, CommentList, CommentNew, PostItem, PostCategories, SocialShare, Vote, PostStats} = Telescope.components);
+  ({ListContainer, CommentList, CommentNew, PostItem, PostCategories, SocialShare, Vote, PostStats, HeadTags} = Telescope.components);
 
   const post = document;
   const htmlBody = {__html: post.htmlBody};
@@ -8,6 +8,8 @@ const PostPage = ({document, currentUser}) => {
   return (
     <div className="post-page">
 
+      <HeadTags url={Posts.getLink(post)} title={post.title}/>
+      
       <PostItem post={post}/>
 
       <div className="post-body" dangerouslySetInnerHTML={htmlBody}></div>