まずは①「サーバー・ドメイン契約」だけ行ってください。
①をしていただき、サイト制作が完了した後に、②〜⑩のお役立ち情報を参考にしてくださいね。
まずは「サーバー・ドメイン取得」だけなので、PC・スマホどちらでもできます。
①:サーバー・ドメイン取得
クリックして開く
画像付き手順解説で超簡単!
3分でできます!
\ サーバー・ドメイン取得 /
サーバー・ドメインの取得はスマホでもPCでもどちらでも可能です。
今回はPC画面で手順解説しますが、やり方はスマホでも同じなのでご安心ください。
画像付きで手順解説するので超簡単!3分でできます!
通常はサーバーとドメインはそれぞれ費用がかかりますが、今回紹介する方法は必要費用はサーバー代(月660〜1,000円ほど)だけで、ドメイン(URL)は1つ永久無料!
今回のサイト制作におけるドメイン代(URL)が永久無料なのも嬉しい点です!
\ サーバー・ドメイン取得 /
それでは、サーバー・ドメインを取得していきましょう!
画像付きで手順解説しているので、5分でできます

- メールアドレスを入力
- 確認のためにもう一度メールアドレスを入力
- パスワードを設定
- 英大文字・英小文字・数字を混在させた9文字以上で設定
- 【例】@Conohawing9
- 次へ
メールアドレスで登録 “してください”。
画面右側の「ソーシャルログイン」(Facebook・Twitterなど)は、”しないで”ください。
サイト作成にあたって私がサーバーにログインしますが、Facebookなどのソーシャルログインをされてしまうと、そのソーシャルメディアのパスワードも私に教えていただく必要があり、セキュリティ的に良くありません。

- 料金タイプ
- 「WINGパック」を選択
- ※WINGパックにすることでドメイン(URL)が無料で使用可能
- 契約期間
- 契約期間が長ければ長いほど、月額料金が安く、お得に使用可能
- 12ヶ月プランがオススメ!12ヶ月プランは月額931円で使用可能
- プラン
- 「ベーシック」で充分
- 月間数十万PVあるサイトでも「ベーシック」で問題なく使用可能
- 初期ドメイン
- 初期ドメインはサイトのドメインとは違います。ほぼ使うことはないので適当でOK!
- 他の人が既に登録している文字は使用できないので、その場合は数字や文字を適当に追記しましょう
- サーバー名
- これもサイトとは直接関係ないので適当でOK!
- 自動で適当な文字列が入力されています
- 次へ
③・④・⑥・⑦は超大事!
必ずメモ+スクリーンショット保存してください!

- WordPressかんたんセットアップ
- 利用する
- セットアップ方法
- 新規インストール
- 独自ドメイン設定(サイトのURL設定)
- ブログ・サイトのドメイン(URL)設定
- ドメインは後から変更はできないので注意
- ドメイン名とSEOとは直接関係ないので、神経質になずOK
- 他の人が既に使用しているドメイン(URL)は使用不可能
- 使用不可能でも「例:campstlyee.c om」のように最後の文字を二重にするなどで希望URLに近い設定が可能
- .com
- ドメイン末尾を選択できる
- .com
- .jp
- .net
- 種類は様々だが深く考えなくてOK!
- ほとんどのサイトで使用されている「.com」「.jp」を選んでおきましょう
- 作成サイト名
- 後から変更可能なのでとりあえず何でもOK
- WordPressユーザー名
- WordPressにログインする際に使用するもの
- 外部から見えるものでは無いので何でもOK!
- 氏名・メールアドレスなど自分が覚えやすいものを設定しメモしてください
- WordPressパスワード
- WordPressにログインする際に使用するもの
- 何でも大丈夫ですが単純なものは避け、セキュリティのために「記号・英数字」を混ぜて設定しましょう
- (例)@conohawing7373
「③・⑥・⑦」はサイト制作するために共有していただくので、忘れないようにメモしておいてください。
「WordPress」テーマは選択しないでOK!
全ての入力を完了したら、「続ける(次へ)」ボタンを押してください。
次は「お客さま者情報」「決済情報」を設定します

「氏名」「生年月日」「住所」などなど、基本的な情報を全て入力していきます
一番上の種別は基本的に「個人」
会社事業の一環なら「法人」ですが、個人でブログ運営、アフィリエイトサイト運営の場合は「個人」でOK!
全て入力したら画面右側の「次へ」

- 「電話番号」の欄にご自身の電話番号を入力
- 先ほど入力した番号が自動で入力されています
- 「SMS認証」をクリック
- SMS認証とは電話番号を使った本人確認
- 「ショートメール」「ショートメッセージ」とも呼ばれる

- SMS認証にてスマホに届いた「認証コード」を入力
- 「送信」をクリック

このような感じで認証コードが送られてきます
認証コードは人それぞれ違うので、ご自身の番号を入力してください
「SMS認証」がうまくいかない場合は、隣の「電話認証」を使いましょう。
「電話認証」は、ご自身の電話番号に電話がかかってきて認証コードを伝えられます。メモを取る準備をしてください。

これでサーバーに「空っぽのWordPress」を入れることが完了しました。
「データベース(DB)」「DBユーザー名」「DBパスワード」は基本的に使う機会がありませんが、一応メモしてください
お疲れ様でした。
サーバー・ドメインの取得はこれで完了です。
サイト制作完了後

サイト制作完了後に見てほしいお役立ち情報
- アフィリエイト広告の実際の貼り方&案件探し方
- ブログ記事投稿設定
- 画像挿入設定
- WordPressテーマ swell の使い方
- キーワード選定お役立ちツール
などなど、実際のブログサイト運営に役立つ情報を解説しているので、見てみてください。
②:使用必須 ASP 5選!アフィリエイト広告掲載マニュアル
クリックして開く
ASP5社の実際のアフィリエイト広告掲載手順も画像付きで手順解説
まずは無料登録
各ASPに登録をしないとアフィリエイト広告を貼ることができないので、まずはじめに登録してください
ASP毎のアフィリエイト広告の案件検索と、実際の広告の貼り方を画像つきで手順紹介!
実際にアフィリエイト広告をまだサイトに貼らない場合でも、使い方に慣れておくのはとても大切です。
すべて画像付きで解説しているので、今から練習として実際に貼っていきましょう。
練習用投稿:広告掲載

- 「W」ボタン
- 投稿
- 新規追加
まずは練習用投稿を作成

- 本文内にASP広告を入れる
- やり方はこの後に画像付きで解説中
- 基本的①のような「テキスト広告」がオススメ
- バナー広告は少量なら問題ないが多用すると読者の邪魔になる
- テキスト広告なら記事内にたくさんあっても邪魔になりにくい
- この後やり方を紹介する「5社のASP広告すべて」記事内に貼る
- ②「公開」をクリック!
ASPとは「アフィリエイトサービスプロバイダー」の略で、アフィリエイト広告をまとめて管理している代理店のこと。
ASPに登録をすることで、ASP経由で各会社のアフィリエイト広告を利用できるようになります。
アフィリエイトビジネスの仕組み

今回はASP各社のアフィリエイト広告を、実際にサイトに貼る&案件を検索する練習をします。
今回は掲載練習の為に審査がない「即時提携」案件を選択していますが、通常は広告提携するために審査があります。
審査には数日〜数週間かかる場合もあるので、一応覚えておきましょう。
実際にASP各社の管理画面を見せながら解説
クリックして開く
\ まずは無料登録 /

画面上部で「即時提携」と検索

検索結果一覧から選びたい広告の「詳細を見る」

プログラムと提携する「提携申請する」をクリック

「広告リンク作成」


「①広告タイプ:テキスト」にするのを忘れないように
- 広告タイプ:テキスト
- 広告リンクを表示
- 素材をコピーする

練習投稿ページにアフィリエイト広告を「そのままコピペ」→「公開」で完了
\ まずは無料登録 /

「即時提携」と検索

「提携申請する」

「広告リンクへ」

- 広告種別:「テキスト」
- ソース内容を「コピー」
「テキスト」リンクにするのを忘れないように

練習投稿ページにアフィリエイト広告を「そのままコピペ」→「公開」で完了
\ まずは無料登録 /

「即時提携」と検索

「広告素材を選ぶ」

- 広告タイプ「テキスト」
- 「再検索」
- 「広告素材」

広告タグを「コピー」

練習投稿ページにアフィリエイト広告を「そのままコピペ」→「公開」で完了
\ まずは無料登録 /

何も入力せず「空欄のまま」検索をクリック

- 絞り込み条件→提携条件
- 即時提携
- 検索


- 提携申請
- ページが切り替わり…
- 提携申請完了

「プログラム名」をクリック!
もしくは画面左上の「プログラム検索:提携中」から選択も可能


- 「リンクコードを取得」
- 広告素材を選択→「テキスト」→「表示」
- リンクコードを「コピー」

練習投稿ページにアフィリエイト広告を「そのままコピペ」→「公開」で完了
\ まずは無料登録 /

「+条件指定」をクリック

- 条件設定
- ページのかなり下の方
- 提携承認
- 「自動」をチェック
- 「この条件で検索」
提携承認→「自動」とは、即時提携案件のこと


- 「提携申請」
- ページが切り替わり
- 「提携申請はこちら」

「広告原稿一覧」をクリック
もしくは「提携中のプロモーションはこちら」から案件を選択し、「広告原稿一覧」をクリック

「①広告タイプ:テキスト」にするのを忘れないように

- 「テキスト原稿」
- 「広告原稿(リンクコード)取得」
- リンクコードを「コピー」

練習投稿ページにアフィリエイト広告を「そのままコピペ」→「公開」で完了
これら5つのASPは業界大手ASPで、アフィリエイトをする上で必須!
この5つを登録しておけば、欲しいジャンルの案件が無い…ということはまずないので安心してください
まずは広告の検索の仕方・実際の広告の貼り方を覚えて、アフィリエイトをスタートしましょう
必須ASP5社!無料登録
③:ブログ記事制作実演【超重要】
クリックして開く
(ざっくり説明)

- 「W」ボタン(ダッシュボード)
- 「投稿」
- 「新規追加」

- 右上の「⚙歯車ボタン」をクリック
- 赤枠の「投稿」「ブロック」というのが出るので、その状態で記事作成。

- タイトルは32〜39文字
- 空いている箇所をクリックして、記事本文を書く

- 定期的に「一時保存」
- 途中でブラウザ消してしまったら困るので定期的に「下書き保存」しましょう
- 記事が完成したら「公開」
- 「公開後」は「公開=更新」と表示される

- 一時保存をした後に「記事URLパーマリンク」を指定・設定・変更
- 半角英数字で設定
- 日本語URLだと意味不明な長文URLに勝手に変換されてしまうため半角英数字で設定
- 完了したら、カテゴリー設定して「公開」
- カテゴリーの詳細は後述
タイトルと本文を入力

- タイトルは32〜39文字が望ましい
- 空いている箇所をクリックして、記事本文を書く

- 「見出し」を入れたい箇所をクリック
- 「+」マークをクリック
- 「見出し」と検索し、「見出しマーク」をクリック

- 「見出し」をクリック
- 「H2」ボタンをクリック
- 「H2」または「H3」を選択
- 「H2」
- 「H2」→「H3」
- 「H2」→「H3」→「H3」
- 「H2」→「H3」→「H2」→「H3」
- 「H2」の下層に「H3」を設定する
画像アップロード&挿入

- 「+」マークをクリック
- 「画像」と検索
- 「画像」ボタンをクリック

画像を「アップロード(新規画像追加)」または、「メディアライブラリー(既存画像を本文に挿入)」をクリック。

- 「メディアライブラリー」を選択
- 導入したい画像をクリック
- 「選択」をクリックして、本文に挿入

こんな感じの「ふきだし」設定


- 「W」ボタン
- 「ふきだし」をクリック
- 「新規ふきだし追加」をクリック


- 「ふきだしセットのタイトルを入力」
- 外部には表示されないので自分が分かりやすいタイトルを設定
- 「画像を選択」「アイコン名」それぞれ設定
- アイコンの「色」「枠」など装飾設定
- 「登録」ボタンをクリックして保存
- 登録後に編集するときには「更新」と表示されている


- 「ふきだし」挿入したい箇所をクリック
- 「+」マークをクリック
- 「ふきだし」と検索
- 「ふきだし」ボタンをクリック


- 空の「ふきだし」ブロックが出るのでクリック
- 「ふきだしセット」から登録している「ふきだし」を選択クリック
- 「ふきだしセット」に登録している内容を変更しても今までのに自動で更新されるので便利



このような「ふきだし」を呼び出せます


- 「⚙歯車マーク」をクリック→「ブロック」を選択
- 装飾したい箇所をクリック
- 各種装飾を選択


- 「STEP1」の「③」を下に「スクロール」すると、その他たくさんの装飾ブロックが出る
- 装飾を入れすぎると逆に見にくくなるので要注意
- 装飾はある程度使う数、使う種類を決めることで統一感のある見やすいデザインになる


基本的に1つのブロックに対して、1つの装飾
2つ以上のブロックをまとめて装飾したい場合は、2つのブロックを「グループ化」する必要がある
- 2つのブロックを選択
- マウスで左クリックしながら、ドラック選択
- 「:」ボタンをクリック
- 「グループ化」をクリック


- 2つのブロックが、1つのグループになっているを確認
- 青枠で囲まれていると、1つのグループになっている
- 装飾を選択


2つのブロックがグループ化され、装飾が適用された。
「文字+画像」
「画像+画像」
「文字+関連記事ブロック」など、グループ化することで装飾しやすくなる。
なお、文章に関してはグループ化しなくても、「shiftキー」を押して改行することで上記画像と同じようにできる。
(適切な余白調整は分かりやすい文章ために大切)


- 下に余白をつけたいブロックをクリック
- 「ブロック下の余白量」にて、「0〜6」を選択
- 1=小さい余白
- 6=大きい余白
「画像」「文章」など、何のブロックでも「ブロック下の余白量」にて、余白の調整可能
(小さい〜大きい余白まで)


- 余白をつけたい箇所をクリック
- 「+」ボタンをクリック
- 「スペーサー」と検索
- 「スペーサー」ボタンをクリック


「・」を上下に動かすことで余白量を自由に調整
表示順番入れ替え
カテゴリーの追加・編集


- 「投稿」→「カテゴリー」→「新規カテゴリーを追加」
- 「新規カテゴリー名」は「日本語」「英語」どちらでもOK
- 「スラッグ(URL)」は「英語」必須。
- スラッグ(URL)を日本語にすると文字化けして意味不明な長文URLに変換されるので、SNS拡散などに不向きになる。
- 子カテゴリーを設定したい場合は、親カテゴリーを選択してから、子カテゴリーを追加するとできる。
カテゴリーの表示順番変更


カテゴリーは通常、勝手に表示順番が決められてしまう
けれど、表示順番を自分で変更・設定したい!


- 「w」ボタン
- 「投稿」
- 「Taxonomy Order」
- プラグインこちらで導入済み
- カテゴリーを好きな順番に入れ替え・変更
- 完了したら「更新」をクリック


- 「⚙歯車マーク」クリック
- 「投稿」
- 下にスクロールして「アイキャッチ画像」
- 「アイキャッチ画像を設定」


- 「メディアライブラリー」をクリック
- サムネイル・アイキャッチに使いたい画像を選択
- 「アイキャッチ画像を設定」をクリック
※まだ画像をアップロードしていない場合、緑色の「ファイルをアップロード」を行ってから、①〜③をおこなう
- アフィリエイトリンク
- テキストリンク
- バナー画像リンク
- 関連記事リンク(内部リンク)
などなど、URLリンクは使い方がたくさんあるので、覚えてください。


- テキストリンクにしたい元の文章をドラック選択
- 「(-)」マークをクリック
- 「URLを挿入」して「エンターキー」をクリック


青字のテキストリンクになった!


- 「画像を挿入」
- 「(-)」マークをクリック


- 「URL」を入力
- 「適用」ボタンをクリック
これで画像にURLを付けることができ「バナー画像リンク」になる


- 「:」マークをクリック
- 「コードエディター」を選択
- ASPのソースコードを入力
- 「コードエディターを終了」をクリック


バナーリンクが表示されました


- 「関連記事」挿入したい箇所をクリック
- 「+」マークをクリック
- 「関連記事」と検索
- 「関連記事」ボタンをクリック


- 「内部リンク」を選択
- サイト内にある「記事タイトル」「キーワード」を入力
- 該当する記事を選択
内部リンクをテキストリンクにしたい場合は、右のオレンジ「テキストリンクで表示する」をチェック


このような画像(ブログカード)付きの内部リンクになる
④:SWELL/WordPress使い方マニュアル


クリックして開く
使い方マニュアル




①〜⑤は、上記「カスタマイズ」ボタンをクリックしてから!
クリックして各設定方法を見る
- »グローバルナビ
- 特に見てほしい内容・記事を載せる
- »お知らせバー
- 特に見てほしい内容・記事を載せる
- »メインビジュアル
- トップページを開いている時に表示される
- 各記事を見ている際には表示されない
- 写真画像だけでなくURLを付けて記事や任意ページに飛ばすことも可能
- »記事スライダー
- 画像に写っていないが「メインビジュアル」と「ピックアップバナー」の間にある記事スライダー
- »ピックアップバナー
- 各記事を見ている時にも表示される
- 各記事ごとに「ピックアップバナー」を表示しないように設定も可能
- »カテゴリータブ
- 「最新記事」+「3カテゴリー」に絞るのがオススメ
- これ以上カテゴリータブを増やすこともできるが、トップページが見にくくなる
- »プロフィール
- 簡潔に自己紹介
- 長くなる場合は別途「自己紹介記事」を作成し、そのページに飛ばすのがオススメ
WordPressテーマ「SWELL」の使い方マニュアルです。ご自身でも細かく調整したい場合はマニュアルを参考に、カスタマイズしてみてください。
基本的に上記①〜⑦をすれば»デモサイトのようにできます。
⑤:画像素材サイト(著作権フリー)
クリックして開く
- »Adobe Stock
- Adobeの無料アカウントを作れば使用可能になる
- »ぱくたそ
- 超人気フリー素材サイト
- »O-DAN
- 写真に特化
- »photoAC
- 写真に特化
- »ICOON MONO
- アイコン特化
- »FLAT ICON DESING
- アイコン特化
- »loosedrawing.com
- イラストに特化
- »ソコスト
- イラストに特化
個人的には①〜③が使いやすくて最もオススメ!
⑥:記事テンプレート呼び出し
クリックして開く




- 「+」ボタンをクリック
- 「パターン」をクリック
- 「SWELL カスタムパターン」をクリック
「記事テンプレート」とは、上記画像の「ブログパーツ」のこと。
あらかじめ設定しているブログパーツをワンクリックで呼び出すことができるので、執筆時間を短縮するために有効活用しましょう。
「記事執筆画面」で、画像の手順でブログパーツを呼び出すことができます。
オプション依頼してくださった方には、あらかじめ記事テンプレート設定をしていますので執筆時に使用してください。
「記事テンプレート」を変更・追記・修正したい場合は、「画像1枚目」ブログパーツの「タイトルにカーソルを合わせ→編集」にて自由に編集できます。
⑦:SWELLERS:コミュニティについて
クリックして開く
SWELL使用者が集まるコミュニティ(SWELLERS)は購入者・契約者限定のコミュニティなので、参加したい場合はご自身で直接SWELLを購入する必要があります。
WEBサイト・ブログを運営するにあたってコミュニティは参加しなくても大丈夫ですが、同じようにサイト・ブログを始めた人と交流したい場合は検討してみてください。
コミュニティ内でSWELLに関する質問もできます。(必ずしも回答・解決してもらえるわけではありませんが。)
…個人的には、わざわざ新しく買ってまで必要なモノでは無いと考えています。
»SWELL公式ページ
»SWELLERS(コミュニティ)
→SWELL正式購入後に入れるコミュニティ
当方とSWELL販売元「株式会社LOOS」にてSWELLを直接購入することで、第三者へのサイト制作にあたってテーマ使用が許可されています。
そのため、皆さんは新しく「SWELL」を買う必要ありせんが、コミュニティに参加したい場合のみ直接購入をご検討ください。
サイトを運営にあたって必ずしもコミュニティに入る必要はなく、皆様もサイトテーマ直接購入者と同じように使えます。
今後SWELLERS限定サービスやアップデートがある可能性もあるかと思いますが、それはその時に検討したら良いでしょう。
なおコミュニティに入るためにSWELLをご自身で購入した場合でも、新しくサイトを作り直さなくてはいけない…といったことはありません。
⑧:不具合?エラー時に試してほしいこと
クリックして開く
- エラー?不具合?
- 記事が更新できない?
- 画像がアップロードできない?
- 更新ボタンが「ぐるぐる」周り続けている?
ブログ・サイトを運営していると、必ずこのようなエラーを経験します。一度もエラーが起きたことがない人はまずいません。
エラーが起きた時は焦らずに以下の対処法を試してみてください。基本的にこれらで解決できます。
不具合が起きた時の対処法
- »サーバーの「WAF」をオフにする【公式】
- 「WAF」を ”オフ” にして、行いたい作業(更新・アップロードなど)をして、再度「WAF」を “オン” にする
- 「WAF」をずっと “オフ” にすると楽で良いかも
- プラグインを一度オフにする
- プラグインはWordPressテーマと相性がある
- プラグインは入れ過ぎると不具合を起こす可能性が高くなる
- プラグインはなるべく少ない方が良い(最大でも15個前後)
- 特定のプラグインが不具合を起こしている可能性があるので、一つずつオフにしてどのプラグインが不具合を起こしているのか確かめる
- ブラウザ(Chrome・Safariなど)を一度閉じる
- PCを再起動する
- ページ「再読み込み」をする
- 再読み込みをする前に「投稿本文を全てコピペ」しておくと、万が一保存されていなかった時にすぐに修正できます
⑨:キーワード選定ツール
クリックして開く
- »ラッコキーワード
- サジェストキーワード・関連キーワード取得に便利
- サジェスト(おすすめ)と、あいうえお順に表示されてキーワード選定に便利
- »ウーバーサジェスト
- ラッコキーワードより深い分析ができるが、無料プランだと1日に利用制限がある
- 基本はラッコキーワードだけでOK!