Add share.js support #1095

GetToSet · 2019-08-15T13:45:27Z

PR Checklist

Please check if your PR fulfills the following requirements:

The commit message follows our guidelines.
Tests for the changes was maked (for bug fixes / features).
- Muse | Mist have been tested.
- Pisces | Gemini have been tested.
Docs in NexT website have been added / updated (for features).

PR Type

What kind of change does this PR introduce?

What is the current behavior?

Added support for share.js.

Issue resolved: N/A

What is the new behavior?

Screenshots with this changes:

Link to demo site with this changes: This feature will be used on my own site, which is still under construction.

How to use?

In NexT _config.yml:

# share.js
# See: https://github.com/overtrue/share.js
# networks: weibo,qq,wechat,tencent,douban,qzone,linkedin,diandian,facebook,twitter,google
sharejs:
  enable: true
  #networks: weibo,qq,wechat,tencent,douban,qzone,linkedin,diandian,facebook,twitter,google
  wechat_qrcode:
    title: share.title
    prompt: share.prompt

Does this PR introduce a breaking change?

Yes.
No.

welcome · 2019-08-15T13:45:31Z

Thanks so much for opening your first PR here!

CLAassistant · 2019-08-15T13:45:37Z

All committers have signed the CLA.

layout/_partials/share/sharejs.swig

_config.yml

stevenjoezhang · 2019-08-15T16:08:23Z

Thanks. Let's wait for jsdelivr to update this package 😂 https://www.jsdelivr.com/package/npm/social-share.js

jsDelivr
jsDelivr - A free, fast, and reliable Open Source CDN for npm and GitHub
A free, fast, and reliable Open Source CDN for npm and GitHub with the largest network and best performance, perfectly suited for production use.

layout/_partials/share/sharejs.swig

1v9 · 2019-08-15T21:25:00Z

source/css/_common/components/post/post-widgets.styl

@@ -1,6 +1,7 @@
 .post-widgets {
  border-top: 1px solid #eee;
  margin-top: 45px;
+  padding-top: 20px;


this change for what?

Share.js doesn't include a top padding and share components seems to be too close to the divider.

OK, would you commit much more? I sae you mark resolved upstairs

Move this padding-top: 20px; somewhere else. It breaks the style of all other widgets.

1v9 · 2019-08-15T21:30:18Z

layout/_partials/post/post-footer.swig

-  {%- if theme.likely.enable or (theme.needmoreshare2.enable and theme.needmoreshare2.postbottom.enable) %}
-    <div class="social-share">
+  {%- if theme.likely.enable or (theme.needmoreshare2.enable and theme.needmoreshare2.postbottom.enable) or theme.sharejs.enable %}
+    <div class="post-social-share">


No additional changes, add extra judgment for sharejs

{%- if theme.sharejs.enable %} <div class="social-share" data-sites="{{ theme.sharejs.networks }}" data-wechat-qrcode-title="{{ __(theme.sharejs.wechat_qrcode.title) }}" data-wechat-qrcode-helper="{{ __(theme.sharejs.wechat_qrcode.prompt) }}"></div> {%- endif %}

Or you can put options to front-end, we have global CONFIG, check head.swig.

I changed css class social-share to post-social-share because share.js has hard-coded selector for social-share, which is exactly the same and will definitely result in problems if multiple share components are enabled.

I performed a global search to make sure that no css code selects for social-share, I think it's necessary to introduce this change.

{%- if theme.sharejs.enable %} <div class="social-share" data-sites="{{ theme.sharejs.networks }}" data-wechat-qrcode-title="{{ __(theme.sharejs.wechat_qrcode.title) }}" data-wechat-qrcode-helper="{{ __(theme.sharejs.wechat_qrcode.prompt) }}"></div> {%- endif %}

Or you can put options to front-end, we have global CONFIG, check head.swig.

Is it suitable to put configuration scripts to _partials/share/sharejs.swig? Code may be injected to all pages even if no share components present, or should I put it under _partials/post/post_footer.swig?

Forget this, you can check likely, css/html/js part is independent

For now, keep these share services unified, If you have more ideas, open another PR when this merged.

I performed a global search to make sure that no css code selects for social-share, I think it's necessary to introduce this change.

.social-share will be blocked by adblock, but .post-social-share won't.

stevenjoezhang · 2019-08-16T01:42:00Z

How about using jsdelivr as default CDN: https://cdn.jsdelivr.net/npm/social-share.js@1/dist/js/social-share.min.js

sli1989 · 2019-08-16T01:44:38Z

How about using jsdelivr as default CDN: https://cdn.jsdelivr.net/npm/social-share.js@1/dist/js/social-share.min.js

can the version number of all cdn verder be replaced by @latest

stevenjoezhang · 2019-08-16T01:46:03Z

Besides, social-share.js was last published 3 years ago: https://www.npmjs.com/package/social-share.js

This is a potential problem. Gitment and Han have not been updated for more than a year, they have brought a lot of issues and finally be removed from NexT.

npm
social-share.js
create social share buttons on your site.

stevenjoezhang · 2019-08-16T01:47:10Z

stevenjoezhang · 2019-08-16T01:54:47Z

My suggestion is to maintain a fork of share.js by NexT. Thus we can remove the hard-coded selector for .social-share and add a padding-top in the stylesheet

_config.yml

stevenjoezhang · 2019-08-17T00:52:26Z

Thanks for your contributing. New plugin created: https://github.com/theme-next/hexo-next-share

GitHub
theme-next/hexo-next-share
Content Sharing Services for NexT. Contribute to theme-next/hexo-next-share development by creating an account on GitHub.

GetToSet added 2 commits August 15, 2019 20:42

Added support for share.js

1141597

Move related code to right place and revert accidental changes.

b8d72c8

auto-assign bot requested review from ivan-nginx, maple3142, sli1989 and stevenjoezhang August 15, 2019 13:45

GetToSet changed the title ~~Added share.js support.~~ feat | Added share.js support. Aug 15, 2019

GetToSet changed the title ~~feat | Added share.js support.~~ Added share.js support. Aug 15, 2019

stevenjoezhang suggested changes Aug 15, 2019

View reviewed changes

layout/_partials/share/sharejs.swig Outdated Show resolved Hide resolved

layout/_partials/share/sharejs.swig Outdated Show resolved Hide resolved

_config.yml Outdated Show resolved Hide resolved

Correction on code styles.

5034bf5

stevenjoezhang added the 🌟 New Feature label Aug 15, 2019

1v9 requested changes Aug 15, 2019

View reviewed changes

layout/_partials/share/sharejs.swig Show resolved Hide resolved

layout/_partials/share/sharejs.swig Show resolved Hide resolved

layout/_partials/share/sharejs.swig Show resolved Hide resolved

1v9 added this to the v7.4.0 milestone Aug 15, 2019

1v9 reviewed Aug 15, 2019

View reviewed changes

1v9 requested changes Aug 15, 2019

View reviewed changes

1v9 changed the title ~~Added share.js support.~~ Add share.js support Aug 15, 2019

1v9 added Discussion 🔌 3rd Party Plugin labels Aug 15, 2019

stevenjoezhang reviewed Aug 16, 2019

View reviewed changes

_config.yml Show resolved Hide resolved

stevenjoezhang added the 🚧 Work in Progress label Aug 16, 2019

stevenjoezhang closed this Aug 17, 2019

stevenjoezhang removed Discussion 🌟 New Feature 🔌 3rd Party Plugin 🚧 Work in Progress labels Aug 17, 2019

stevenjoezhang removed this from the v7.4.0 milestone Aug 17, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add share.js support #1095

Add share.js support #1095

GetToSet commented Aug 15, 2019 •

edited

Loading

welcome bot commented Aug 15, 2019

CLAassistant commented Aug 15, 2019 •

edited

Loading

stevenjoezhang commented Aug 15, 2019 •

edited by unfurl-links bot

Loading

1v9 Aug 15, 2019

GetToSet Aug 15, 2019

1v9 Aug 15, 2019

stevenjoezhang Aug 16, 2019

1v9 Aug 15, 2019

1v9 Aug 15, 2019

GetToSet Aug 15, 2019 •

edited

Loading

GetToSet Aug 15, 2019

GetToSet Aug 15, 2019

1v9 Aug 15, 2019

1v9 Aug 15, 2019 •

edited

Loading

stevenjoezhang Aug 16, 2019

stevenjoezhang commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

sli1989 commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

stevenjoezhang commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

stevenjoezhang commented Aug 16, 2019

stevenjoezhang commented Aug 16, 2019 •

edited

Loading

stevenjoezhang commented Aug 17, 2019 •

edited by unfurl-links bot

Loading

Add share.js support #1095

Add share.js support #1095

Conversation

GetToSet commented Aug 15, 2019 • edited Loading

PR Checklist

PR Type

What is the current behavior?

What is the new behavior?

How to use?

Does this PR introduce a breaking change?

welcome bot commented Aug 15, 2019

CLAassistant commented Aug 15, 2019 • edited Loading

stevenjoezhang commented Aug 15, 2019 • edited by unfurl-links bot Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

GetToSet Aug 15, 2019 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

1v9 Aug 15, 2019 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

stevenjoezhang commented Aug 16, 2019 • edited by unfurl-links bot Loading

sli1989 commented Aug 16, 2019 • edited by unfurl-links bot Loading

stevenjoezhang commented Aug 16, 2019 • edited by unfurl-links bot Loading

stevenjoezhang commented Aug 16, 2019

stevenjoezhang commented Aug 16, 2019 • edited Loading

stevenjoezhang commented Aug 17, 2019 • edited by unfurl-links bot Loading

GetToSet commented Aug 15, 2019 •

edited

Loading

CLAassistant commented Aug 15, 2019 •

edited

Loading

stevenjoezhang commented Aug 15, 2019 •

edited by unfurl-links bot

Loading

GetToSet Aug 15, 2019 •

edited

Loading

1v9 Aug 15, 2019 •

edited

Loading

stevenjoezhang commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

sli1989 commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

stevenjoezhang commented Aug 16, 2019 •

edited by unfurl-links bot

Loading

stevenjoezhang commented Aug 16, 2019 •

edited

Loading

stevenjoezhang commented Aug 17, 2019 •

edited by unfurl-links bot

Loading