あなたの興味を広げる話題を。

鍋ヶ滝©熊本県(Licensed under CC BY 4.0

noteが「noteで記事を書く」ボタンのカスタマイズ方法を追加で発表!

2019年05月28日
FC2ブログ・便利ワザ・アイテム・HTML・SEO対策など 0

ソーシャルプラグイン「noteで書く」ボタンが公開されたことを記事で紹介したばかりですが、その続報です。「noteで書く」ボタンは、自由にカスタマイズ出来ることが分かりました。

これは、noteの運営サイドが、ブログやそれぞれのWebサイトのデザインにあわせて「noteで書く」ボタンを設置できるようにカスタマイズする方法を追加発表したことで明らかにされたものです。

▼前回の記事

【新機能】noteのソーシャルボタン「noteで書く」をFC2ブログに設置する方法

FC2ブロガーのMです。noteが、コピペでブログに設置できる「 note で書く」ボタンを初公開しました。1クリックで記事を引用しつつ、noteの投稿画面を開くことができるというものです。シェアボタンはSNSなどでお馴染みですが、いよいよnoteでも気軽にシェアする時代が到来したのですね。さっそく、ソーシャルボタン「noteで書く」を、FC2ブログ『ゆうらりHappySmile』でも設置してみようと思いました。「 note で書く」ボタンは、...

当初、noteの発表では、下の画像のような長方形タイプのシェアボタンのみでした。

ソーシャルプラグイン「noteで書く」ボタンのイメージ画像

ところが、ボクのブログのように丸型のソーシャルボタンを並べて設置している場合は、デザイン的にいって不向きな面があります。

ボクは苦肉の策として、Facebookのシェアボタンで同じ形のものをたまたまもう一つ設置していたので、その下に縦並べで貼り付けたのです。

ソーシャルプラグイン「noteで書く」ボタンの設置例

これで何とか「noteで書く」ボタンを違和感なく設置することが出来ました。しかし、「融通性が無いよなぁ…」と感じたのは事実です。通常なら何通りかのパターンが用意されますからね。

きっと、noteの運営サイドには多数の要望が寄せられたはずです。今回は、それを受けての追加発表なのだと思いました。

note、Webサイトにあわせて「noteで書くボタン」のカスタマイズする方法を追記

さっそく気になったボクは、noteが発表した「本日より、ソーシャルプラグイン「本日より、ソーシャルプラグイン「noteで書くボタン」を、Webサイトの雰囲気にあわせてカスタマイズして設置できるようになりました。設置方法は、こちらをご覧ください。https://note.pie|note公式|note」というアナウンスを覗いてみました。

すると、「noteで書く」ボタンの設定方法 – noteヘルプセンターの中に、「ボタンのデザインをカスタマイズする場合」として新たな設置方法が追加されていました。

「noteで書くボタン」はWebサイトにあわせてカスタマイズして設置することもできます。

下記のコードのようにリンクタグを追加すると、画像やテキストを「noteで書く」ボタンにできます。

要するに、上の記事で紹介されたリンクタグを記述すれば、カードタイプ形式によって元記事が引用されつつ、アーユーレディな状態の投稿画面に移動できるということです。

「noteで書く」ボタンをクリックした後に表示される投稿画面

「noteで書く」ボタンをカスタマイズするポイントは『noteロゴデータ』

肝心の、「noteで書く」ボタンをカスタマイズする方法ですが、ポイントとなるのは『noteロゴデータ』です。

noteのロゴマークは、いまだFont Awesomeにないもんですから、自分でボタンを作るとなるとちょっと大変です。

そこで、noteでは素材データを公開しており、 noteロゴデータ – noteヘルプセンターからダウンロードすることが出来ます。

おわりに

実際のカスタマイズ方法は、それぞれのウェブサイトのブログデザインによって異なりますが、noteのリンクタグとロゴデータを組み合わせればお好きなようにカスタマイズすることが可能です。

関連記事

コメント 0件

コメントはまだありません
未分類 (0)
シン・胃がん闘病記 (0)
胃がん(ブログ、闘病記録、胃癌ニュース、私の症状など胃ガン情報全般) (5888)
┣  胃がんブログ (259)
┣  よりぬき 胃がんブログ (16)
┣  胃がん闘病記・日記 (5553)
┣  酒場放浪記 (9)
┣  胃がん手術後の食事記録 (6)
┣  胃切除後の料理など (35)
┗  がん治療のクラウドファンディング (10)
胃がん History (84)
┣  ステージ3B 多発性高度リンパ節転移胃癌 (57)
┗  胃がん再発「転移性肝がん」で余命宣告 (26)
がん のこと(ガン情報全般) (457)
┣  がんブログ (255)
┗  がんニュース (202)
胃がん 障害年金ブログ (71)
┣  障害年金 - 準備編 (23)
┣  障害年金 - 審査から年金受給まで (12)
┣  障害年金 - 審査請求・不服申立 (26)
┗  障害年金 - 再審査請求 (10)
Amazon (ニュース、お得なセール情報など) (135)
┣  Amazonセール (2)
┗  📱kindleセール (132)
おもしろグッズ (10)
今日のエッセイ (92)
ニュース・芸能・話題 (717)
┗  転職・キャリアアップ (7)
恋愛・人間関係 (21)
終活ブログ (10)
グルメ (61)
┣  低糖質レシピ (5)
┗  お酒の飲み方 (1)
胃切除後の食事・レシピ (669)
┣  ご飯・おかゆ・和食 (174)
┣  おかず (139)
┣  味噌汁・スープ (73)
┣  カレー関係 (66)
┣  パン・洋食 (63)
┣  麺類 (112)
┗  その他、簡単レシピなど (39)
ブログ (212)
┣  FC2ブログ・便利ワザ・アイテム・HTML・SEO対策など (173)
┣  Google Adsense (アドセンス) (8)
┣  趣味や将棋のこと (27)
┗  ファッション (4)
iPhone の使い方・アプリなど (30)
司法書士 (26)
┣  仕事・実務や登記のこと (1)
┗  事件ファイル (25)
COLLECTION (26)
┣  家電 (11)
┣  ホーム&キッチン (4)
┣  ビューティー&ケア (4)
┣  QOLの改善&ヘルスケア (2)
┗  お酒 (5)