見出し画像

「noteで書く」ボタンのWordpress設置用コード

「noteで書く」ボタンがリリースされた

ということなので、さっそく自分で運営しているブログにも貼ってみました。投稿記事の上の箇所と記事下に「noteで書く」ボタンを付けてみました。ブログ記事から「noteで書く」ボタンをクリックすると

***

「記事リンク」とその「記事のタグ」が貼り付けられたnote記事作成ページが開きます。なかなか便利です。

詳しくは公式ページに書かれています。

設置方法

ボタンのタグコードは公式ヘルプで紹介されています。

設置方法
ボタンを設置したいページに、下記のコードを追加します。
data-url属性の値にページのURLを入力してください。(例:https://www.pieceofcake.co.jp/)
<a href="https://note.mu/intent/social_button" class="note-social-button" data-url="https://www.pieceofcake.co.jp/"></a>
<script async src="https://cdn.st-note.com/js/social_button.min.js"></script>

タグ付きのコードも紹介されているので詳しくはヘルプページをご覧ください。

但し、これだと全部のページに貼り付けてURLやタグを書き替えるのが大変ですね。

Wordpressの場合

その点、WordPressなら便利です。PHPコードを使って全投稿ページに自動的に貼り付けすることができました。

Wordpressのテーマにコードを追加するだけです。記事URLとタグの部分をWordpress用のPHPタグに書きかえた「noteで書く」ボタンのコードをダウンロードできるようにしました。

WordPress用コードのファイル

ダウンロードしなくても調べれば解る程度の極簡単なコードです。自分で調べる時間がないという方だけどうぞご利用下さい。また自分でテーマを修正できないという方には難しいかもしれませんのでご注意下さい。

この続きをみるには

この続き:66文字

「noteで書く」ボタンのWordpress設置用コード

ハタモトシンイチ

500円

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

note.user.nickname || note.user.urlname

note「みんなのフォトギャラリー」に写真を提供しています。現在900以上のnote記事で採用頂きました。ありがとうございます。 皆様からのサポートは、フォトクリエイティブ活動に使わせて頂きます。

スキをありがとうございます♪
8

ハタモトシンイチ

おいしい話が好き。ミラーレス一眼カメラをはじめる頃に読むブログ運営。FUJIFILM X ギャラリー管理人。カメラ、料理、菜園、子育て、卓球など日常のお話を書いてます。 https://htmt41.com

Webメディア運営のお話

ワードプレス、インスタグラム、note などWebメディア運営に関するお話を書いていきます。
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。