最近ノーコードツールが流行ってるらしいけど本当に使えるの?
という疑問をお持ちの方のために
今回はノーコードツール「STUDIO」とブログツール「note」を連携させる方法をご紹介します。
note以外でブログを書いている方もいると思いますが
RSS連携という機能を使うので、アメブロやWordPressなども同じ方法で連携させることができます。
これ、本当に便利な機能なんです。
この機能について説明する前に、
「STUDIO」という最高に使いやすいノーコードツールについてまずは解説していきます。
ノーコードツール「STUDIO」って何?
![](https://design-formom.com/wp-content/uploads/2020/07/3164770_s.jpg)
そもそもノーコードツールって何?
という方のために、初めにノーコードツールについて簡単に説明しておきます。
これまでのホームページはHTMLやCSSといった
プログラミング言語を使ったソースコードを書く必要がありました。
そのため、プログラミングの知識がないとホームページを作ることが難しかったのですが、
ノーコードツールはソースコードを書かずに簡単にホームページを作成できます。
(簡単にとは言っても少しはHTMLやCSSの知識があった方が理解して作りやすいです。)
最近ノーコードツールは増えており、Wixやペライチなどのたくさんのツールがあります。
その中でも個人的におすすめなのが、この「STUDIO」です。
一般の人たちにはまだあまり使われていない印象ですが、
Webデザイナーの中ではSTUDIOを使っている人を最近よく見かけるようになりました。
実際私も使っているのですが、
直感的に操作ができて綺麗に整ったページが作れます。
そして、STUDIOは日本で開発されたツールなので
操作で困った時などはサポートに問い合わせがしやすいのもおすすめできるポイントです。
STUDIOには無料のプランもありますが、
頻繁にブログを更新できるようにするには月額3280円の有料プランにする必要があります。
月額3000円はきついな・・・という方は今回紹介するRSS連携を実装してみてください。
![YUKI](https://design-formom.com/wp-content/uploads/2021/02/00DAA173-E6EA-45DE-B132-10BAC3923677-150x150.jpg)
STUDIOについて理解できたところで、本題のnoteと連携させる方法について解説していきます!
STUDIOとnoteを連携させる方法
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.11.50-1024x304.png)
① noteにログインして、RSSのアイコンをクリック。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.26.35-1024x473.png)
② 上の画像のようなソースコードが書かれた画面が表示されるので、一番上のURLをコピー。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.16.24-1024x477.png)
③ STUDIOのデザイン編集画面で表示させたいページを開く。
④ 左側の>というアイコンをクリック。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.17.02-1024x376.png)
⑤ RSS → 新規RSSを追加をクリック。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.29.20.png)
⑥ コピーしたURLを貼り付け → OK
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.31.05-1024x434.png)
⑦ ブログカードが表示されるので、ドラッグ&ドロップで表示させたい位置に移動させる。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.32.29-1024x458.png)
移動すると、このようにページ内にブログカードが表示されます。
実際にデザインを整えるとこんな感じになりました。
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.50.24-1024x463.png)
表示される記事の数を変更する方法
![](https://design-formom.com/wp-content/uploads/2021/06/スクリーンショット-2021-06-09-23.52.07-1024x488.png)
表示される記事数は自由に変更できます。
やり方はとっても簡単です。
① デザイン編集画面でブログを貼り付けたボックスをクリック
② 左上の数字を表示させたい記事数に変更。
以上です。
まとめ
STUIOとnoteは連携できましたか?
今回紹介したRSS連携を使うことで、note側で記事を更新するとSTUDIOのサイトでもブログカードが更新されるようになります。
新着記事を表示させたり、お知らせを表示させるなど使い方は様々です。
noteはスマホからも記事投稿ができるので、わざわざパソコンを開かなくてもブログを更新できるのはありがたいですね。
ちなみに、アメブロと連携させたい場合は「http://rssblog.ameba.jp/アメーバID/rss.html」
というURLを入力することで簡単に連携させることができます。
外部サービスを上手く連携させて、より良いホームページを作ってみてください。