ブログ記事をTwitterのようにMisskeyへシェアする方法

記事内に広告を含む場合があります（こちらを押すと詳細が表示されます）

この記事には広告を含む場合があり、記事内で紹介する商品を購入すると当サイトに売り上げの一部が還元されることがあります。

例えば以下のようなものはアフィリエイト収入を得ています。

広告リンクテキスト・広告バナー
商品リンク（一部紹介リンクじゃないものもありますが基本的に紹介リンクだと思っていただいたほうが安心です。）
リンクテキストや画像リンクをコピーして、アドレス欄に貼り付けた時に「https://px.a8.net/」や「https://ck.jp.ap.valuecommerce.com/」、などASPのURLが含まれるリンク
リンクに「affiliate」などのアフィリエイトリンク

など。

また、企業様より報酬を受け取っての記事の場合は、記事の冒頭に「マーケティング主体の名称」と「関係性の内容」、「PR」や「提供」を明記しておりますので安心してご覧いただけます。

問題のある表現がありましたら、お問い合わせまでご連絡ください。

ちーさま

こんにちはこんばんは、当ブログ運営主のちーさまです。

最近Twitterが一時的な閲覧制限を掛けて無料ユーザーは、１日1000なり500ツイート分しか見れなくなっていました。

閲覧制限中でもツイートはできるし、通知やDMも受け取ることができたのですが、情報収集やら懸賞系は主にTwitterを活用していたので、タイムラインが見れないのってほんとキツかったです。

今は普通にタイムラインを見ることができますが、なんか不安。ということで、Twitterの代替サービスも利用すべきかなぁと思い「Misskey」を使ってみることに。

どんな感じとかは書きませんが、使っててふとこう思ったんですよ。

「MisskeyでもTwitterみたいにブログ記事をURLで簡単にシェアできないだろうか。」

ブログ記事にあるシェアボタンって押すと各SNSの投稿画面が開くようになり、自動的に内容を入力してくれるのですが、あれってURLに入力情報が書かれてるんですよね。

それをMisskeyでもできないかなぁと思ってGoogle Bardで調べたら実現できたので、資料としてここに記録しておきます。

Misskey用ブログ記事シェアURL

Misskeyでもいくつかクエリパラメータが用意されているようで、以下のようなことができました。

URLのみ入れる場合

https://misskey.io/share?url=https%3A%2F%2Fexample.com%2Fblog%2Fpost%2F

上記URLをブラウザのアドレス欄に入力し確定ボタンを押すと、Misskeyの投稿画面にURLが自動的に入力された状態になると思います。

URLとタイトルを入れる場合

https://misskey.io/share?url=https%3A%2F%2Fexample.com%2Fblog%2Fpost%2Ftitle&title=Blog Post Title

今度は、URLの「url=」がURLとして挿入される部分、「title=」がテキストとして挿入される部分となります。

文字を入れる場合

https://misskey.io/share?text=Blog Post Title-https%3A%2F%2Fexample.com%2Fblog%2Fpost%2Ftitle

「text=」だと、上記のように文字とURL両方挿入されます。「title=」と違うのは、文字の前後にカッコが表示されないことです。

改行したい場合

改行するには、URLに%0Aを入力します。

https://misskey.io/share?text=適当な文字%0A改行

WordPressで使う方法

テーマによってシェアボタンの設置方法が異なるのと、僕のよわよわ頭ではシェアボタンが並んでる所にMisskeyボタンを追加する方法が分からなかったため、ショートコードでボタンを呼び出すようにしました。

以下のコードを子テーマのfunction.phpに追記。

add_shortcode( 'misskey_share_button', function() {
  // シェアボタンのHTMLを生成
  $html = '<a href="https://misskey.io/share?url=' . get_permalink() . '&title=' . the_title_attribute( array( 'echo' => false ) ) . '" target="_blank" class="sns_btn_misskey">Misskeyでシェア</a>';

  // シェアボタンのHTMLを返す
  return $html;
} );

CSSコードは以下の通り（任意です。入れるなら子テーマのstyle.cssに追記）。

/* SNSボタンシェア */

/* Misskey */
.sns_btn_misskey {
  background-color: #97C024;
  box-shadow: 0 4px 0 #7BB419;
    text-decoration:none!important;
  display: inline;
  position: relative;
  font-family: Arial;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  color: white;
  border-radius: 5px;
  padding: 7px 40px;
}
.sns_btn_misskey:active {
  top: 2px;
  box-shadow: 0 2px 0 #7BB419;
}
.sns_btn_misskey:hover {
  background-color: #7BB419;
}

後は、ブログにMisskeyのボタンを設置したい箇所にショートコード（misskey_share_button）を入れるだけ。

ちなみにボタンデザインはこんな感じです↓

Misskeyでシェア