Refactor social share solution

Removes share_url include and includes share URL previs in datalist
This commit is contained in:
Brandon Rosage 2019-03-07 15:06:26 -06:00
parent b609e9bf5d
commit eb572aa140
4 changed files with 30 additions and 28 deletions

View file

@ -27,7 +27,7 @@ projects:
projects:
# - repo-name
social_media:
# social_media:
# behance: your_username
# facebook: your_username
# dribbble: your_username

View file

@ -6,11 +6,13 @@ behance:
facebook:
name: Facebook
profile_url_prefix: https://www.facebook.com/
share_url_prefix: https://www.facebook.com/sharer/sharer.php?u=
icon_svg: '<svg height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.3 15.4"><path d="M14.5 0H.8a.88.88 0 0 0-.8.9v13.6a.88.88 0 0 0 .8.9h7.3v-6h-2V7.1h2V5.4a2.87 2.87 0 0 1 2.5-3.1h.5a10.87 10.87 0 0 1 1.8.1v2.1h-1.3c-1 0-1.1.5-1.1 1.1v1.5h2.3l-.3 2.3h-2v5.9h3.9a.88.88 0 0 0 .9-.8V.8a.86.86 0 0 0-.8-.8z" fill="#959da5"/></svg>'
linkedin:
name: LinkedIn
profile_url_prefix: https://www.linkedin.com/in/
share_url_prefix: https://www.linkedin.com/shareArticle?mini=true&url=
icon_svg: '<svg height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19 18"><path d="M3.94 2A2 2 0 1 1 2 0a2 2 0 0 1 1.94 2zM4 5.48H0V18h4zm6.32 0H6.34V18h3.94v-6.57c0-3.66 4.77-4 4.77 0V18H19v-7.93c0-6.17-7.06-5.94-8.72-2.91z" fill="#959da5"/></svg>'
stackoverflow:
@ -21,6 +23,7 @@ stackoverflow:
twitter:
name: Twitter
profile_url_prefix: https://www.twitter.com/
share_url_prefix: https://twitter.com/share?url=
icon_svg: '<svg height="20" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 273.5 222.3"><path d="M273.5 26.3a109.77 109.77 0 0 1-32.2 8.8 56.07 56.07 0 0 0 24.7-31 113.39 113.39 0 0 1-35.7 13.6 56.1 56.1 0 0 0-97 38.4 54 54 0 0 0 1.5 12.8A159.68 159.68 0 0 1 19.1 10.3a56.12 56.12 0 0 0 17.4 74.9 56.06 56.06 0 0 1-25.4-7v.7a56.11 56.11 0 0 0 45 55 55.65 55.65 0 0 1-14.8 2 62.39 62.39 0 0 1-10.6-1 56.24 56.24 0 0 0 52.4 39 112.87 112.87 0 0 1-69.7 24 119 119 0 0 1-13.4-.8 158.83 158.83 0 0 0 86 25.2c103.2 0 159.6-85.5 159.6-159.6 0-2.4-.1-4.9-.2-7.3a114.25 114.25 0 0 0 28.1-29.1" fill="#959da5"/></svg>'
youtube:

View file

@ -1,13 +0,0 @@
{% if include.service == 'facebook' %}
{% capture share_url %}
https://www.facebook.com/sharer/sharer.php?u={{ include.permalink | prepend: site.url | prepend: site.baseurl | url_encode }}
{% endcapture %}
{% elsif include.service == 'linkedin' %}
{% capture share_url %}
https://www.linkedin.com/shareArticle?mini=true&url={{ include.permalink | prepend: site.url | prepend: site.baseurl | url_encode }}&title={{ include.title | url_encode }}&source=LinkedIn
{% endcapture %}
{% elsif include.service == 'twitter' %}
{% capture share_url %}
https://twitter.com/share?text={{ include.title | url_encode }}&url={{ include.permalink | prepend: site.url | prepend: site.baseurl | url_encode }}
{% endcapture %}
{% endif %}{{ share_url | strip }}

View file

@ -2,20 +2,32 @@
{% capture post_body %}
{% if site.social_media %}
<div class="col-sm-4 col-lg-3 d-flex flex-wrap flex-items-center d-sm-block float-sm-right border rounded-2 bg-white p-3 mb-5 ml-md-5">
<h3 class="text-gray-dark mr-3 mr-sm-0">Share</h3>
<ul class="d-flex d-sm-block list-style-none">
{% for account in site.social_media %}
<li class="mt-sm-3">
{% assign service_shortname = account[0] %}
{% assign service = site.data.social_media[service_shortname] %}
<a href="{% include social_media_share_url.html service=service_shortname title=page.title permalink=page.url %}" title="Share on {{ service.name }}" class="d-flex flex-items-center">
<div style="width:32px">{{ service.icon_svg }}</div><span class="d-none d-sm-inline-block text-gray-light">{{ service.name }}</span>
</a>
</li>
{% endfor %}
</ul>
</div>
{% assign shareable_social_media = '' | split: ',' %}
{% for service in site.social_media %}
{% if service.share_url %}
{% assign shareable_social_media = shareable_social_media | push: service %}
{% end %}
{% endfor %}
{% assign total_shareable_services = shareable_social_media | size %}
{% if total_shareable_services > 0 %}
<div class="col-sm-4 col-lg-3 d-flex flex-wrap flex-items-center d-sm-block float-sm-right border rounded-2 bg-white p-3 mb-5 ml-md-5">
<h3 class="text-gray-dark mr-3 mr-sm-0">Share</h3>
<ul class="d-flex d-sm-block list-style-none">
{% for account in shareable_social_media %}
<li class="mt-sm-3">
{% assign service_shortname = account[0] %}
{% assign service = site.data.social_media[service_shortname] %}
<a href="{% service.share_url_prefix %}{% page.url | prepend: site.url | prepend: site.baseurl | url_encode %}" title="Share on {{ service.name }}" class="d-flex flex-items-center">
<div style="width:32px">{{ service.icon_svg }}</div><span class="d-none d-sm-inline-block text-gray-light">{{ service.name }}</span>
</a>
</li>
{% endfor %}
</ul>
</div>
{% endif %}
{% endif %}
<div class="article">
{{ content }}