Files
react-native/website/layout/PageLayout.js
T
Héctor Ramos db621b03b6 Improve social share previews, expand author bylines
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
2016-08-29 23:13:43 -07:00

44 lines
1.1 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 PageLayout
*/
var React = require('React');
var Site = require('Site');
var Marked = require('Marked');
var support = React.createClass({
childContextTypes: {
permalink: React.PropTypes.string
},
getChildContext: function() {
return {permalink: this.props.metadata.permalink};
},
render: function() {
var metadata = this.props.metadata;
var content = this.props.children;
return (
<Site
section={metadata.section}
title={metadata.title}
description={content.trim().split('\n')[0]} >
<section className="content wrap documentationContent nosidebar">
<div className="inner-content">
<Marked>{content}</Marked>
</div>
</section>
</Site>
);
}
});
module.exports = support;