リットリンクでホームページをつくろう①【基本操作編】
今回のテーマは「リットリンクをHPっぽく使おう」。
- パン屋をはじめたけれどHPをつくる余力がない
- HPのような大層なものは必要ないけど何か欲しい
- かんたんに操作できるHPっぽいものが欲しい
この記事ではリットリンクの概要と基本操作を、次の記事でリットリンクのアレンジ方法を解説していきます。
今回は解説しつつ、リットリンクを使ってお役立ちコンテンツのリンクまとめ集をつくりました。よろしければご活用ください。
ホームページについて考える

はじめに”パン屋にHPは必要なのか?”という視点から考えてみましょう。
結論、”複雑なHPは不要だけれど「オンラインの居場所」は必須”です。
複雑で、お金のかかるようなものは必要ありません。自分のパンをみつけてもらうための居場所としてあるといいでしょう。
ここでHP(Webサイト)とSNSのメリット・デメリットについても考えておきます。

一長一短ですね。ならば、それらを組み合わせたものを使えばいい。

それが「リットリンク」です。
ほかにおすすめしたいツールもあるのですが、今回は比較的とっつきやすくて使いやすい「リットリンク」を紹介していきます。
Instagramがあると便利なので、ぜひ併用していきましょう。
リットリンクってなに?

ここからはリットリンクに焦点を当てて解説していきます。
リットリンクとは「複数のSNSアカウントやWebサイトのリンク・ブログ・YouTubeチャンネルなどをひとつのページにまとめて簡単にシェアできる無料のプロフィール作成サービス」です。
リットリンクの特徴は以下の通り。
- 無料で利用可能
- スマホで操作可能
- カスタマイズ性がある
- SNS連携がスムーズ
最近、広告が少し表示されるようになりました。が、まあ許容範囲。
またリットリンクのロゴは真ん中にありますが、こちらもこの程度であればいいとしましょう。無料で使わせてくれてありがとう! のお礼ということで笑

上の画像はパソコンでの表示画面となりますが、おおよそスマホと同じ表示になるのも便利ポイント。

基本的には無料で使えますが、有料プランも存在します。
有料プランは年払いで月額¥590(年間¥7080)。半年払いだと月額¥790(年間¥4740)、月払いでは¥860です。

違いを表にまとめてみました。
わたしはかれこれ3年? 4年? くらい使っていますが、無料プランで事足りております。ですのでよっぽど無料でいいかなと。
むしろ無料プランを活用して、コンテンツごとにアカウントを使い分けています。
1アカウント1アドレス必要になりますので、もし複数を作成する場合はアドレスを用意してください(注:有料プランは1アカウントごとの申込です)。
リットリンクのポイントは「リンクをまとめたサイト」ということ。
つまりリンクするサイトがないと、殺風景になります。
またサイトっぽくアレンジもできますので、上手に画像を利用しながら使っていきましょう(このときCanvaを使うととても便利)。
そのほかオンラインショップやnoteなどがあると盛り上がりますね。長いお知らせなどはnote記事のリンクを貼って飛んでもらいましょう。
アレンジについては次の記事になりますが、この記事では基本操作は一通り網羅していますので一度つくってみてください。
リットリンクをはじめよう
それではアカウントの作成に入っていきましょう。
アカウントの作成方法は2通り。
- LINEアカウントで作成
- メールアドレスで作成
個人的には「メールアドレスで作成」がおすすめです(複数アカウント作成時は特に)。
サイト作成の手順は以下の通り。
- どんなページにするか考える
- 公式サイトからアカウントを作成
- クリエイター名、URLの設定
- アイコン画像やプロフィールの設定
- 各種サイトのURLを追加する
- 背景色などをカスタマイズする
意外と工程は少ないのですが、ある程度のイメージは先にもっておきましょう。
今回、新しくリンク集を作りましたので「ドノーマル」の表示画面をお見せしてから、アレンジを加えていこうと思います。
ただのリンクまとめ集がどのように変化するかもお楽しみください。
それぞれ解説していきます。
1.どんなページにするか考える
便利そうだから早速つくってみよう! となりがちですが、これからパン屋の顔となるページですので先に中身を決めましょう。
今回記事をつくりながら、新しいサイトをつくっていきます。
テーマは「おみみのおすすめ」。こんなものを載せましょうか。
- おすすめのキャッシュレス決済
- おすすめ記事をわかりやすく
- おすすめのパン屋向け備品3つ
- おすすめの会計ソフト3本
- Kindleやnote記事をいくつか
動画やブログでいろいろ解説してはいますが、ひとつひとつ探すのもめんどくさいですよね。
「キャッシュレス決済、何がおすすめなんだろう?」と思ったときにいくつか選択肢を比べられたらいいかなと。
初期設定だとダダダーっとリンクが並ぶだけですので、画像を使ってアレンジを加えながらいい感じにしていきます。
パン屋のアカウントでも同じように考えてみてください。
例えば店舗営業日を記載したカレンダーを貼ってみたり、オンラインショップに誘導できるボタンをつくってみたり。
お店によって必要なものは変わりますので、載せたい情報を一度書き出してみましょう。
その上で以下のものを準備しておきます。
- 有効なリンク
- 挿入する画像
有効なリンクというのは「きちんとつながるリンク」です。ときどきリンク先が表示されないことってありますよね。
あれの主な原因は2つ。
- 記事が削除されている
- 単純にコピペをミスした
どちらも確認すれば防げますので、ある程度完成したら実際に自分がお客さん目線になって確認しましょう。

挿入する画像は上の画像にあるようなものです。この画像は元からあったものではなく、わたしが作成したもの。
上にある「最新記事はこちらをクリック!」という画像も用意したものです。
のちほど解説しますが、リットリンクでは初期設定は全然違う見た目になります。背景もおぱんくんがデフォルトであるわけもないので、作成しました。
画像をうまく使えば視覚的にわかりやすくなります。Canvaを使ってお好みの雰囲気の画像をつくりましょう。
今回も画像を作成しておりますので、アレンジの際に使っていきます。サイズなどは次の動画でまとめてお伝えします。

2.公式サイトからアカウントを作成
それではアカウントをつくっていきましょう。

まずリットリンクの公式サイトを開きます。
右上の「新規登録」を押します。

LINE、Google、メールで登録とありますね。
今回はLINE以外の方法で登録していきます。
Googleで登録を押すと、Googleアカウントをログインする情報と同じものでアカウント作成できます。お店用のアカウントがあれば、そちらを使うのもアリ。
今回は「メールで登録」で進めていきます。なんともあっさりした画面が表示されました。

入力していきましょう。
情報を入力して「つぎに進む」を押すと、確認用のメールが届きますのでそちらを承認してください。
これでアカウント登録は完了です。
3.クリエイター名、URLの設定

クリエイター名は漢字以外は認識されますが、変更したい場合はできますのでURLをいじってください。
今回のクリエイター名は「ぱんおみみ・リンクまとめ」でいきましょう。URLはわかりやすく「omiminolink」にしました。
ほかの情報も入力して次に進みます。

有料プランの案内が出てきますが、潔く無視してok
これでクリエイター名とURLの作成は完了。
「https://lit.link/omiminolink」 で決定しました。
4.アイコン画像やプロフィールの設定

背景選択が出てきますので、とりあえず適当に選びましょう。

今回は一旦POPな感じで進めていきます。
これでマイページまで到達しました。

ここからいろいろ設定を加えていきます。
左上に注目してください。
「ホーム」「編集」「プレビュー」があります(いまは「ホーム画面」)。
「編集」にするとこんな画面になります。

まだ何も設定していませんので、いまから編集していきます。
真ん中のリットリンクのロゴには鍵がかかっています。こちらは有料プランを契約すると削除可能です。今回は無料のまま使いますので、このまま表示されます。
「プレビュー」を押すといまどんな感じで表示されるかわかります。

上はスマホの画面ですが、まだすっからかんなので情報を入れていきましょう。

では「編集」画面に戻っていただき、まずはプロフィール画像を入れていきましょうか。
真ん中の丸い画像を押し、右側にアップロード画面が出てくるので画像を入れます。

おみみちゃんの画像が表示されました。
次はその下のクリエイター名です。

名前はそのままで使おうと思います。
キャッチコピーなどがあればひとこと追加してください。このときなるべく1行で収まる文章にしてくださいね。
プレビューで確認してみるとこんな感じで表示されます。この感じだと15-20文字くらいなら1行で収まりそう。これで最低限のプロフィール設定が終わりました。
5.各種サイトのURLを追加する
次は繋げたいリンクを入れていきます。
画像の下にアイコンがありますよね。この中から3つ程度、表示したいものを選びましょう。

表示できるのはデフォルトで出ているもののほかに16種類あります。

今回はInstagram、YouTube、noteにしておきます。
試しにInstagramを押すとこんな画面が出てきます。

Instagramのアカウント名を入れましょう。
「保存する」を押して連携完了。ほかのアカウントも同様に入れていきます。
入れ終わったらプレビューで確認します。

3つのリンクが入ってますね。
ここからがリットリンクの肝になります。
入れられるリンクは7種類。

- ボタン
- ピクチャ
- 動画
- 音楽
- テキスト
- ショップ
- カレンダー
パン屋で使うのは「ボタン」と「ピクチャ」が中心になるかな。詳しい内容はのちほど実際の操作画面をお見せしながら解説していきます。
6.背景色などをカスタマイズする
ある程度情報を入れ終わったら、全体を整えていきます。
画面上に「背景」「フォント」「リンク」「テンプレ」「カバー」がありますね。ここで全体の雰囲気を調整していきましょう。

背景は「ライブ」「画像」「カラー」「アップロード」から選べます。
ライブ背景はどうやら動く背景らしい。使わねぇ〜(本音)。

画像を用意できない場合は無地もしくは中に入っている画像がおすすめです。
グラデーションは色の指定もできますし、アップロードは画像を入れることができます。

動画を入れたい場合は有料プランの機能ですが、まあパン屋で背景が動画ってのはやらないかな。
「背景アップロード」の部分を押すと画像を入れることができます。
せっかくなのでわたしも準備しておいた画像を入れてみましょうか。

あら、かわいい。英字新聞みたいになりました。
画像を入れたらかならず「保存」を押しておきましょう。
文字はフォントで変えることができます。

無料で使えるのは7種類。少しずつ違いますので、お好みでどうぞ。
文字の色を変えることもできます。

リンクはボタン表示のときのスタイルですね。

テンプレートは「こんな雰囲気どうですか?」的なやつ。いろいろボタンがあるので、さわってみてください。

以上が、全体の雰囲気を変える設定でした。
正直なところ「背景」「フォント」「リンク」を調整する程度でいいかと思います。
これにて基本的な機能の説明が終了。
次は基本操作に入っていきます。
リットリンクの基本操作
全体的な雰囲気が整いました。
いよいよリンクを入れていきます。

すべての操作に共通するのがこの右上のボタン。

ここを押すと中を変更できます。
各種サイトを選択するとアカウント名を入れれば連携可能。メールアドレスや電話番号も入れることができます。
note記事など、ここにはないリンクを入れたい場合は一番下の「その他のURL」を選択しましょう。

リンクの入れ方はすべてのリンク追加で共通操作です。
リンクは7種類入れられます。

ひとつずつのぞいていきましょう。
ーボタン
ボタンはアイコンの横に説明を入れられる表示方法。

タイトルの下にテキストも入れられます。
アイコンがあるものは選べますので、リンクに合ったものを選んでいきましょう。

好みのものがなければアップロードできますので、正方形の画像を準備しておきましょう。サイズは1080×1080pxで大丈夫です。
試しにnoteのアカウントを入れてみましょうか。noteの場合、リンクに「note」はないので「その他のURL」を入れます。

保存をして、プレビューを見て確認します(タイトルの下のテキストは少しちいさめに表示されます)。
ーピクチャ
つづいてピクチャを表示してみましょう。
ピクチャには4種類表示方法があります。

- 4ピクチャ
- 3ピクチャ
- スライド
- ピクチャ
このうち「スライド」のみ有料で使える機能になります。
先ほどのボタンでは右側にテキストが表示されましたが、ピクチャはその名の通り画像だけを表示することができます。
わたしが一番多く使うのがこの「1ピクチャ」です。

では実際に画像を入れてみましょう。
例えばInstagramでカレンダーを投稿するときありますよね。そのイメージで1枚作ってみました。このデータを表示させてみましょう。
表示させたいのは1枚どん! なので「ピクチャ」を選びます。もし1列に3つ、4つ表示させたい場合は「3ピクチャ」「4ピクチャ」を選びます。
アップロード画面が出てきますので、先ほどの画像を入れていきましょう。
画像が入りました。基本的にはこの画像のみを表示させればこの画像の目的は達成しますので、ほかの情報は入れないで大丈夫。

この画像にリンクを入れた場合は、そこを押すとページにリンクします。パンセットなどを案内するときに使えそうですね。
ただし正方形サイズは結構どん! と表示されるので、カレンダー以外はもう少し画像をちいさくしたほうが見やすいかなと。お好みで画像を調整してください。
同じように店舗の地図を表示してもいいかなと思いました。
3ピクチャも表示させてみましょう。

1列が3分割されて表示されました。
こちらも同じ方法で画像を入れてみます。リンクを入れる場合は「その他のURL」で入れていきましょう。
「保存」を押して準備完了。
プレビューではこんな感じで表示されます。

「4ピクチャ」も要領は同じです。少し画像がちいさくなりますので、画像に入れる文字は大きめにしましょう。
ー動画
次は動画を入れてみます。

動画はYouTubeを表示することができます。
試しにURLを入れてみると、こんな感じ。

プレビューではこのように表示されます。
タイトルやテキストも入れられます。うん……あまり使わないと思います。
ー音楽
次は音楽。こちらはApple MusicもしくはSpotifyの埋め込みが可能です。

URLを貼り付けることで音楽を流すことができます。
リンクの取得方法がAppleのサイトにありましたので、載せておきます。

Spotifyも同じようにURLを入れることで、埋め込みできるようです。こちらもURLの共有方法がありましたので、載せておきます。

ーテキスト
次はテキストを表示していきましょう。

ある意味、一番シンプルな表示方法ですね。入力したテキストがそのまま表示されます。
右側で変更していきます。
今回はパン販売日のメニューを表示すると仮定して入れてみましょう。鍵のついている部分は有料で開放される機能です。
プレビューをみてみるとこんな感じで表示されました。

直接変更できるので、手軽さはありますが存在感はだいぶ薄いかな。個人的には画像を入れたほうがにぎやかくて好みです。
文字を指定してリンクも入れられます。これは高ポイントかも。

ーショップ
次はショップ。SUZURIで作成したショップを埋め込むことができます。

オリジナルグッズなどを販売している場合はあってもいいですね。
パン屋のオンラインショップを入れたい場合は「ボタン」もしくは「ピクチャ」で表示させることになります。
ーカレンダー
最後はカレンダー。

カレンダー連携はTimeTreeが可能だそう。
TimeTreeの公開カレンダーを埋め込む形です。

TVerはこんな感じで公開カレンダーを出しているようです。

カレンダーの画像をつくるのがめんどくさいなら、ここでつくれば最新情報が更新されていいですね。
共有方法もありましたので、載せておきます。

以上、リットリンクの基本操作でした。
どうでしょうか? 思ったより感覚的で簡単だと思いませんか?
せっかくなのでここまで入れた情報をプレビューでみてみましょう。

パソコン・スマホそれぞれいい感じに表示されました。これでも十分使えますので、最初はこの画面を目指してみてください。
次回はこの画面をつくっていきます。

お楽しみに!

