(2018.09.12追記 Twitterシェア以外の時に正しくシェアできなかったので、一部修正)

HugoのTranquilpeakテンプレートのブログ記事にあるTwitterシェアアイコンは標準だとURLだけ渡す仕組みになっているのですが、
一緒にタイトルもつけたいのでカスタマイズしました。

対象ファイル

  • (Update) config.toml
  • (New) layouts\partials\post\actions.html
  • (New) layouts\partials\post\share-options.html

変更箇所

config.toml

[[params.sharingOptions]] 内
Twitter部分のurl

変更前 

1[[params.sharingOptions]]
2    name = "Twitter"
3    icon = "fa-twitter"
4    url = "https://twitter.com/intent/tweet?text=%s"

変更後 

1[[params.sharingOptions]]
2    name = "Twitter"
3    icon = "fa-twitter"
4    url = "https://twitter.com/intent/tweet?url=%s&text=%s"

layouts\partials\post\actions.html

テーマ内同ディレクトリのactions.htmlをコピーする。
59～69行目を変更。 

 1{{ if not (eq .Params.showActions false) }}
 2  <div class="post-actions-wrap">
 3      <nav {{ if eq .Params.showPagination false }}style="visibility: hidden"{{ end }}>
 4        <ul class="post-actions post-action-nav">
 5          {{ if .Site.Params.swapPaginator }}
 6            <li class="post-action">
 7              {{ with .PrevInSection }}
 8                <a class="post-action-btn btn btn--default tooltip--top" href="{{ .RelPermalink }}" data-tooltip="{{ .Title }}">
 9              {{ else }}
10                <a class="post-action-btn btn btn--disabled">
11              {{ end }}
12                  <i class="fa fa-angle-left"></i>
13                  <span class="hide-xs hide-sm text-small icon-ml">{{ i18n "pagination.previous" }}</span>
14                </a>
15            </li>
16            <li class="post-action">
17              {{ with .NextInSection }}
18                <a class="post-action-btn btn btn--default tooltip--top" href="{{ .RelPermalink }}" data-tooltip="{{ .Title }}">
19              {{ else }}
20                <a class="post-action-btn btn btn--disabled">
21              {{ end }}
22                  <span class="hide-xs hide-sm text-small icon-mr">{{ i18n "pagination.next" }}</span>
23                  <i class="fa fa-angle-right"></i>
24                </a>
25            </li>
26          {{ else }}
27            <li class="post-action">
28              {{ with .NextInSection }}
29                <a class="post-action-btn btn btn--default tooltip--top" href="{{ .RelPermalink }}" data-tooltip="{{ .Title }}">
30              {{ else }}
31                <a class="post-action-btn btn btn--disabled">
32              {{ end }}
33                  <i class="fa fa-angle-left"></i>
34                  <span class="hide-xs hide-sm text-small icon-ml">{{ i18n "pagination.next" }}</span>
35                </a>
36            </li>
37            <li class="post-action">
38              {{ with .PrevInSection }}
39                <a class="post-action-btn btn btn--default tooltip--top" href="{{ .RelPermalink }}" data-tooltip="{{ .Title }}">
40              {{ else }}
41                <a class="post-action-btn btn btn--disabled">
42              {{ end }}
43                  <span class="hide-xs hide-sm text-small icon-mr">{{ i18n "pagination.previous" }}</span>
44                  <i class="fa fa-angle-right"></i>
45                </a>
46            </li>
47          {{ end }}
48        </ul>
49      </nav>
50    <ul class="post-actions post-action-share" >
51      {{ if (not (eq .Params.showSocial false)) }}
52        <li class="post-action hide-lg hide-md hide-sm">
53          <a class="post-action-btn btn btn--default btn-open-shareoptions" href="#btn-open-shareoptions">
54            <i class="fa fa-share-alt"></i>
55          </a>
56        </li>
57        {{ range .Site.Params.sharingOptions }}
58          <li class="post-action hide-xs">
59            {{ if (eq .name "Twitter") }}
60              <a class="post-action-btn btn btn--default" target="new" href="{{ printf .url $.Permalink $.Title }}">
61                <i class="fa {{ .icon }}"></i>
62              </a>
63            {{ else }}
64              <a class="post-action-btn btn btn--default" target="new" href="{{ printf .url $.Permalink }}">
65                <i class="fa {{ .icon }}"></i>
66              </a>
67            {{ end }}
68          </li>
69        {{ end }}
70      {{ end }}
71      {{ if and (not (eq .Params.comments false)) .Site.DisqusShortname }}
72        <li class="post-action">
73          <a class="post-action-btn btn btn--default" href="#disqus_thread">
74            <i class="fa fa-comment-o"></i>
75          </a>
76        </li>
77      {{ end }}
78      <li class="post-action">
79        {{ if findRE "<!--\\s*[t|T][o|O][c|C]\\s*-->" .Content }}
80          <a class="post-action-btn btn btn--default" href="#table-of-contents">
81        {{ else }}
82          <a class="post-action-btn btn btn--default" href="#">
83        {{ end }}
84          <i class="fa fa-list"></i>
85        </a>
86      </li>
87    </ul>
88  </div>
89{{ end }}

layouts\partials\post\share-options.html

テーマ内同ディレクトリのshare-options.htmlをコピーする。
6～14行目を変更。

 1<div id="share-options-bar" class="share-options-bar" data-behavior="{{ .Scratch.Get "sidebarBehavior" }}">
 2  <i id="btn-close-shareoptions" class="fa fa-close"></i>
 3  <ul class="share-options">
 4    {{ range .Site.Params.sharingOptions }}
 5      <li class="share-option">
 6      {{ if (eq .name "Twitter") }}
 7      <a class="share-option-btn" target="new" href="{{ printf .url (substr (querify " x " $.Permalink) 2) (substr (querify "x " $.Title) 2) }}">
 8        <i class="fa {{ .icon }}"></i><span>{{ printf (i18n "global.share_on") .name }}</span>
 9      </a>
10      {{ else }}
11      <a class="share-option-btn" target="new" href="{{ printf .url (substr (querify " x " $.Permalink) 2) }}">
12        <i class="fa {{ .icon }}"></i><span>{{ printf (i18n "global.share_on") .name }}</span>
13      </a>
14      {{ end }}
15     </li>
16    {{ end }}
17  </ul>
18</div>
19<div id="share-options-mask" class="share-options-mask"></div>