status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Link to individual blog posts from post title 

Summary:
Linkify the blog post title when the excerpt is displayed in the blog index.

Update Facebook OpenGraph meta tags for individual blog posts to fix sharing previews.
Closes https://github.com/facebook/react-native/pull/9590

Differential Revision: D3771630

Pulled By: bestander

fbshipit-source-id: dc428ecc2d7939c143f000b8af9d4df9b512d0fc
This commit is contained in:
Héctor Ramos 2016-08-25 11:02:27 -07:00 committed by Facebook Github Bot 8
parent 56dd520824
commit a282be9a18
6 changed files with 22 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
website/core/BlogPost.js
View File

@ -46,7 +46,10 @@ var BlogPost = React.createClass({
return (
<article>
<BlogPostHeader post={post} postedOnDate={postedOnDate} />
<BlogPostHeader
post={post}
postedOnDate={postedOnDate}
excerpt={this.props.excerpt} />
<div className="entry-content">
<Marked>{content}</Marked>
</div>

8
website/core/BlogPostHeader.js
View File

@ -22,6 +22,12 @@ var BlogPostHeader = React.createClass({
hero = <img src={post.hero} />;
}
var title = post.title;
var href = "/react-native/blog/" + post.path;
if (this.props.excerpt) {
title = <a href={href}>{post.title}</a>
}
return (
<header className="entry-header">
{hero}
@ -33,7 +39,7 @@ var BlogPostHeader = React.createClass({
{' — '}
<span className="date">{this.props.postedOnDate}</span>
</h4>
<h1 className="entry-title">{post.title}</h1>
<h1 className="entry-title">{title}</h1>
</header>
);
}

2
website/core/HeaderLinks.js
View File

@ -17,7 +17,7 @@ var HeaderLinks = React.createClass({
{section: 'docs', href: 'docs/getting-started.html', text: 'Docs', target: '.nav-docs'},
{section: 'support', href: 'support.html', text: 'Support'},
{section: 'showcase', href: 'showcase.html', text: 'Showcase'},
{section: 'blog', href: 'blog/', text: 'Blog'},
{section: 'blog', href: '/react-native/blog/', text: 'Blog'},
],
linksExternal: [
{section: 'github', href: 'https://github.com/facebook/react-native', text: 'GitHub'},

8
website/core/Site.js
View File

@ -22,6 +22,10 @@ var Site = React.createClass({
var title = this.props.title ? this.props.title + ' – ' : '';
var currentYear = (new Date()).getFullYear();
title += 'React Native | A framework for building native apps using React';
var description = this.props.description ? this.props.description : 'A framework for building native apps using React';
var shareURL = 'https://facebook.github.io/react-native/';
shareURL += this.props.path ? this.props.path : 'index.html';
return (
<html>
<head>
@ -31,9 +35,9 @@ var Site = React.createClass({
<meta name="viewport" content="width=device-width" />
<meta property="og:title" content={title} />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://facebook.github.io/react-native/index.html" />
<meta property="og:url" content={shareURL} />
<meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2" />
<meta property="og:description" content="A framework for building native apps using React" />
<meta property="og:description" content={description} />
<base href={basePath} />

4
website/layout/BlogPostLayout.js
View File

@ -24,7 +24,9 @@ var BlogPostLayout = React.createClass({
<Site
section="blog"
title={this.props.metadata.title}
description={this.props.children.trim().split('\n')[0]}>
description={this.props.children.trim().split('\n')[0]}
path={'blog/' + this.props.metadata.path}
>
<section className="content wrap documentationContent">
<BlogSidebar title={this.props.metadata.title} />
<div className="inner-content">

2
website/src/react-native/css/react-native.css
View File

@ -1660,7 +1660,7 @@ input#algolia-doc-search:focus {
}
.entry-header h4 {
margin: 0;
margin: 0 0 10px;
font-size: 12px;
line-height: 16px;
}