Twitteボタンのツイート内容を日本語で色々編集

案件によっては、ツイートの文言を公式の定型順序ではなく、ハッシュタグを文中にもってくる（「テキスト #ハッシュタグ テキスト」）などカスタムしたツイートボタンのコードが必要になることがあったので、その際に試行錯誤した記録です。

ツイート文言をJavaScriptでURIエンコードする記事をネットでは見かけたんですが、
ハッシュタグ「#」がうまくURIエンコードできなかったのでそれに対応させたやつです。

要望

• 「テキスト #ハッシュタグ テキスト」のフォーマットの文章をツイートさせたい
• 日本語エンコードは手作業ではなくjsでやりたい

問題

• encodeURI(decodeURI(this.href))として、ｈｔｔｐ〜全体をURIエンコードするとハッシュタグ（#）がエンコードできない（ついでに%も）
• 引数hashtags に入れると文末ハッシュタグが入るので目的に合わない

最終的にこんな感じ

<a href="https://twitter.com/intent/tweet?text=" 
    onclick="window.open(this.href + encodeURIComponent('#ハッシュタグ1 テキスト1 #ハッシュタグ2 http://www.example.com/ テキスト2')); 
    return false;" 
    target="_blank">
    ツイートする
</a>

（2020/01/10 更新）
http://twitter.com/shareからhttps://twitter.com/intent/tweetに変更
ポップアップウィンドウだとブロックされる可能性があるとのことで、別タブに変更

ポイント

• （そもそも）日本語を含むURLだとIEでエラーになるのでURIエンコードする必要がある
• ハッシュタグ「#」や「%」を含む文字列のみを encodeURIComponent() でエンコードして引数に入れ、URLに追記してからURL遷移させる
• ｊｓを切ってるユーザーには優しくない

引数url を空にするとログイン時にツイート内容の挙動がおかしくなったので注意（http://のみ記述で回避できた）
→ （2020/01/10 更新） intent であれば、url=http://が無くても問題ない

参考

Twitter公式 Tweet Button
Twitter公式 Tweet Button　parameter
オリジナル画像のツイートボタンを設置する方法
各種SNSへのシェアボタン設置方法まとめ