mirror of
https://github.com/status-im/react-native.git
synced 2025-01-10 01:25:39 +00:00
db621b03b6
Summary: Several blog and sharing improvements are included in this update. * A larger default preview image is used when a blog post or doc is shared on social media as recommended by [best practices](https://developers.facebook.com/docs/sharing/best-practices#images). * Follow other Facebook Sharing best practices such as associating the site with a Facebook Page (React) and a Page Admin (121800083 is my fbid, and I am an admin for the React page). * If the shared blog post contains a hero image, use it as a share preview image. * Use actual doc content instead of generic site description when sharing docs. * Update existing hero images to use the larger recommended size. * Add titles to each author's byline. * Add author's avatar to their byline. * Add Twitter Card support. * Link to individual blog posts from the title and hero image in the blog index. Old metadata tags (blog post): ``` <meta property="og:title" content="Toward Better Documentation – React Native | A framework for building native Closes https://github.com/facebook/react-native/pull/9648 Differential Revision: D3790332 Pulled By: hramos fbshipit-source-id: 4f284c6440482df8a42a2b8467ccf56b1fd725d1
50 lines
1.2 KiB
JavaScript
50 lines
1.2 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*
|
|
* @providesModule BlogPostHeader
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
var React = require('React');
|
|
|
|
var BlogPostHeader = React.createClass({
|
|
render: function() {
|
|
var post = this.props.post;
|
|
|
|
var hero;
|
|
if (post.hero) {
|
|
hero = <img src={post.hero} width="650"/>;
|
|
}
|
|
|
|
var title = post.title;
|
|
var href = "/react-native/blog/" + post.path;
|
|
if (this.props.excerpt) {
|
|
title = <a href={href}>{post.title}</a>;
|
|
hero = <a href={href}>{hero}</a>;
|
|
}
|
|
|
|
return (
|
|
<header className="entry-header">
|
|
{hero}
|
|
<h4 className="entry-authordate">
|
|
<a href={post.authorURL} target="_blank"
|
|
className="author">
|
|
{post.author}
|
|
</a>
|
|
{' — '}
|
|
<span className="date">{this.props.postedOnDate}</span>
|
|
</h4>
|
|
<h1 className="entry-title">{title}</h1>
|
|
</header>
|
|
);
|
|
}
|
|
});
|
|
|
|
module.exports = BlogPostHeader;
|