mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-23 22:17:00 +02:00
Enable Facebook comments on blog posts (#673)
* Enable comment on blog post * adjust css * Tweak
This commit is contained in:
parent
24da6bfba0
commit
aae106c018
4 changed files with 100 additions and 73 deletions
lib/core
|
@ -16,46 +16,66 @@ class BlogPostLayout extends React.Component {
|
|||
renderSocialButtons() {
|
||||
const post = this.props.metadata;
|
||||
|
||||
const fbLike = this.props.config.facebookAppId ? (
|
||||
<div
|
||||
className="fb-like"
|
||||
data-layout="standard"
|
||||
data-share="true"
|
||||
data-width="225"
|
||||
data-show-faces="false"
|
||||
/>
|
||||
) : null;
|
||||
const fbComment = this.props.config.facebookAppId &&
|
||||
this.props.config.facebookComments && (
|
||||
<div className="blogSocialSectionItem">
|
||||
<div
|
||||
className="fb-comments"
|
||||
data-href={
|
||||
this.props.config.url +
|
||||
this.props.config.baseUrl +
|
||||
'blog/' +
|
||||
post.path
|
||||
}
|
||||
data-width="100%"
|
||||
data-numposts="5"
|
||||
data-order-by="time"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
const twitterShare = this.props.config.twitter ? (
|
||||
<a
|
||||
href="https://twitter.com/share"
|
||||
className="twitter-share-button"
|
||||
data-text={post.title}
|
||||
data-url={
|
||||
this.props.config.url +
|
||||
this.props.config.baseUrl +
|
||||
'blog/' +
|
||||
post.path
|
||||
}
|
||||
data-related={this.props.config.twitter}
|
||||
data-via={post.authorTwitter}
|
||||
data-show-count="false">
|
||||
Tweet
|
||||
</a>
|
||||
) : null;
|
||||
const fbLike = this.props.config.facebookAppId && (
|
||||
<div className="blogSocialSectionItem">
|
||||
<div
|
||||
className="fb-like"
|
||||
data-href={
|
||||
this.props.config.url +
|
||||
this.props.config.baseUrl +
|
||||
'blog/' +
|
||||
post.path
|
||||
}
|
||||
data-layout="standard"
|
||||
data-share="true"
|
||||
data-width="225"
|
||||
data-show-faces="false"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
if (!fbLike && !twitterShare) {
|
||||
return;
|
||||
}
|
||||
const twitterShare = this.props.config.twitter && (
|
||||
<div className="blogSocialSectionItem">
|
||||
<a
|
||||
href="https://twitter.com/share"
|
||||
className="twitter-share-button"
|
||||
data-text={post.title}
|
||||
data-url={
|
||||
this.props.config.url +
|
||||
this.props.config.baseUrl +
|
||||
'blog/' +
|
||||
post.path
|
||||
}
|
||||
data-related={this.props.config.twitter}
|
||||
data-via={post.authorTwitter}
|
||||
data-show-count="false"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<aside className="entry-share">
|
||||
<div className="social-buttons">
|
||||
{fbLike}
|
||||
{twitterShare}
|
||||
</div>
|
||||
</aside>
|
||||
<div className="blogSocialSection">
|
||||
{twitterShare}
|
||||
{fbLike}
|
||||
{fbComment}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue