初心者がSnowMonkeyでブログを作るまでのやり方・完全解説!(後編)

33番ちゃん

ではここからは後半戦です。一緒にスノモンでブログを作っていきましょう。

前編はこちら↓になります。

最初に完成図を画像でで確認してみてください

33番ちゃん

作成に使用する画像の「Zipファイル」を下記↓から保存して解凍して使用してくださいね。

素材は33番ちゃん作なので、そのまま実績に使用してOKですよ!Twitterからご報告いただけたら見に行きますね〜♪

固定ページを作成する

「メニュー」→「固定ページ」→「新規追加」をクリック

「タイトル」のところには「HOME」と入力します。
右上の「公開」をクリックして、一旦公開にします

左側の「W」のワードプレスのアイコンをクリックして、一旦メニューに戻ります。

表示の設定をします

メニューから「設定」→「表示設定」→「ホームページの表示」の部分のチェックを
「固定ページ」に変更「HOME」に選択し、下へスクロールして「変更を保存」します。

※「投稿ページ」は変更しなくてOK。

HOMEの編集をします

では、メニューから「固定ページ」→「HOME」→「編集」をクリックして、編集を再開します。

黒い「+」マークをクリックします。

するとウィンドウが出てくるので「すべて表示」をクリックします。

下へスクロールすると赤い色で「セクション」が出てくるので、クリックします。

(検索でセクションと入れても出てきます)

右上のネジのマークをクリックします。
(右側にウィンドウが出てきたと思いますが、これが「ブロック」の細かい「設定」ができる項目です)
よく使うので、覚えておきましょう。

「+」印をクリックします。これで新しく項目を追加できます。

検索バーに「カラム」と入れます。

カラムをクリックして「70/30」をクリックします。

左側の「+」をクリックします。

検索バーに「見出し」と入力し、出てきた「見出し」をクリックします。

見出し部分には「最近の投稿一覧」と入力します。※すいません、画像のテキストは間違えてます…。
(文字や背景の色は右側の「設定」ウィンドウで好きなように変更できます)

下の「+」をクリックして、「すべて表示」をクリック、下にスクロールすると、

「赤い色」で「最近の投稿」が出てくるので、クリックします。

では、次に右側の「+」をクリックしましょう。

ここでも同じように「見出し」を追加します。
検索バーで「見出し」と入力して、出てきた「見出し」をクリックします。

見出し部分に「カテゴリー」と入力します

下の「+」をクリックして、検索バーに「カテゴリー」と入力します。

「黒い色」の「カテゴリー」というブロックをクリックします。

これでカテゴリーが追加されました(画像参照)

同じ手順で、下の「+」をクリックして、検索バーに「見出し」と入力し「見出し」をクリック。

見出しには「アーカイブ」と入力します。

下の「+」をクリックして、検索バーに「アーカイブ」と入力、

「黒い色」の「アーカイブ」をクリックします。

これで「アーカイブ」が追加されました。

右上の「更新」をクリックして、保存しましょう。

終わったら、右上の「プレビュー」→「新しいタブでプレビュー」をクリックして、
どのように見えるのか、確認してみましょう。

どうでしょうか?下の画像のようにちゃんと作れましたか?

33番ちゃん

お疲れ様です!すごい、がんばりましたね〜!これでブログのTOPページの作成は終了です。

画像をアップロードする

メニューに戻り、「メディア」→「新規追加」をクリックしましょう。

「ファイルを選択」

「Blog」→ファイルの中の3つの画像を「アップロード」しましょう。

33番ちゃん

お疲れ様です!どうですか?画像のアップロードの仕組みがわかったでしょうか?簡単なので色々アップロードしてブログに追加してみてくださいね。

カスタマイズでサイトの詳細設定をしよう

「メニュー」から「外観」→「カスタマイズ」をクリックします。

ここで、ブログの細かい設定をしていきます。

サイト基本情報

まずは「サイト基本情報」をクリックしてみましょう。

ここで、

・サイト名の変更

・ロゴの設定

・ファビコンの設定

ができます。

実際にやってみましょう!

ブログ名を「Organic Life」と入力します。

次にロゴの「ロゴの設定」をクリックします。

「メディアライブラリ」から「logo」をクリック→「選択」→「切り抜かない」をクリック

次に「キャッチフレーズ」に、

「オーガニックのある暮らし」と入力してみましょう

コピーライトに

「©︎2021-Organic Life-」と入力します。

サイトアイコンを選択をクリック

「メディアライブラリ」から「Favicon」をクリック→「選択」→「切り抜かない」をクリック。

これでサイトのバーのところに「ファビコンが設定」できました。

ここまで終わったら「公開」をクリックします。

メニュー

次に「メニュー」→「メニューの新規作成」をクリック

メニュー名に「HOME」と入力

下にスクロールし、

・グローバルナビゲーション(PC用)
・ドロワーナビゲーション(モバイル用)

この2点に、チェックを入れます。

下へスクロールして、「次」をクリック

「項目を追加」をクリック

「固定ページ」→「HOME」を選択します。

上の「公開」をクリック

ホームページ設定

次に「ホームページ設定」をクリック

・ホームページのコンテンツエリアに左右余白を追加する
・ホームページのコンテンツエリアに上下余白を追加する

この2つのチェックを「外します」→「公開」をクリック

デザイン(基本デザイン)

次に「デザイン」→「基本デザイン」→「アクセントカラー」の「色を選択」をクリック

「#9DC993」と入力します。

下にスクロールして、
「サブアクセントカラー」の「色を選択」をクリック

「#9DC993」と入力します。

下にスクロールして、
「PC時のカスタムロゴの拡大率(%)」を「25%」に変更します。

下にスクロールして、
「デフォルトアイキャッチ画像」の「画像を選択」をクリックします。


「メディアライブラリ」→「eye-catching」を選択し「画像を選択」をクリック。

上の「公開」をクリックします。

デザイン(ヘッダー)

次に「デザイン」の中の→「ヘッダー」をクリック。

ここの「ヘッダーレイアウト」→「シンプル」に変更

これで「ヘッダー」のロゴが左側になり、ヘッダーが1行になりました。

追加CSS

次に「追加CSS」をクリック。

Zipファイル」に入っている、テキストデータ「追加CSS」の中に書いてある文章をコピペして貼り付けてください。

※ここにも記載しておきますが、右クリックで保存不可です。

.c-copyright {
color: #FFFFFF;
background-color: #9DC993;
text-align: center;
}

追加したら、「公開」をクリック

33番ちゃん

お疲れ様です!カスタマイズはこれで終了です。

カスタマイズを理解するまで大変かもしれませんが、コツはどんどん触って確かめて見る事です。これが出来たなら大丈夫!

ブログ記事の投稿をしよう

では、ブログを投稿してみましょう

メニューに戻り、「投稿」→「新規追加」

タイトルを「テスト」

本文に「これはテストです」と入力します。

「+」をクリックし、検索バーに「目次」と入力し、出てきた「目次」をクリック。

「+」をクリックし、検索バーに「見出し」と入力します。

「見出し」をクリックします。

見出しには「見出し1」と入力します。

本文に「これは見出し1です」と入力します。

「+」をクリックし、検索バーに「見出し」と入力します。

「見出し」をクリックします。

見出しには「見出し2」と入力します。

本文に「これは見出し2です」と入力します。

右側の「設定」の項目を、下にスクロールすると「カテゴリー」があります。
そこの「新規カテゴリーを追加」→「新規カテゴリー名」に
「オーガニック」と入力し、「新規カテゴリーを追加」をクリックします。

これでカテゴリーが新しく追加できました
(色々記事の内容に合わせて、カテゴリーを作成してみましょう)

では、右上の「公開」をクリックし、保存します。
最後に「プレビュー」で出来上がりを確認してみましょう。

どうでしょうか?下の画像のようになっていればOKです。

33番ちゃん

「見出し」で入力したタイトルが「目次」に反映されたのがわかりますか?

これでブログの投稿の仕方は終了です!

では、出来上がったブログを一緒に確認してみましょう!

メニューから「固定ページ」→「HOME」→「表示」をクリックします。

33番ちゃん

お疲れ様〜!やった〜ついにスノモンでのブログ作成が終わりましたよ。

もう一人でなんでもできますね!ここからは自由にカスタマイズして遊んでみてね。

最後までお付き合いしてくれてありがとうございました。

スノモンで作ったブログにアフィリエイト広告を貼る方法の記事はこちらです↓


もしよろしければ、LINE公式から感想をお待ちしております。
(返信はできないかもしれませんが、全て確認させていただいております!)

友だち追加

この記事を書いた人