ブログ | 婿養子の島根移住ブログ

WordPressテーマ変更手順まとめ！注意点・エラー対処法・事前準備・プラグインのテスト方法

【Cocoon】ショートコードでフロントページの新着記事一覧を横並び表示にカスタマイズする方法

手順は以下のとおり。

横並び表示カスタマイズ手順

STEP1
フロントページ用の固定ページを新規作成
詳しく解説します
STEP2
新着記事一覧を表示するショートコードをアレンジ
大きなサムネイルを選択します
STEP3
CSSをコピペ
全体のスタイルシートではなくカスタムCSSに追記がオススメ

はまちゃん

ステップも少ないし簡単だね！
フロントページに書く前提で以下は書きますが、普通の投稿ページにショートコードで新着記事を表示する場合は、STEP1は必要ありません。

「さっそくカスタマイズ！」といきたいところですが、簡単とはいえCSSをいじるのでブログデザインが崩れてしまうリスクがあります。

最低限、変更前の設定内容やCSSをバックアップしておくことはするようにしてください。

より慎重にいくなら、テーマ全体のバックアップを取ることも有効です。

以下の記事で注意点やバックアップ方法に触れているので参考にしてください。

（１）フロントページ用の固定ページを作成

ワードプレスのダッシュボードから、「固定ページ」＞「新規作成」をクリックします。

タイトルはなんでもいいです。

この記事ではわかりやすく『【Cocoonトップページ】固定ページテンプレ』としておきましょう。

パーマリンクの設定は関係ないので必要ありません。

Gutenbergを利用の場合、画面イメージが異なります。
プラグイン「Classic Editor」をインストールすれば、本記事と同じ旧エディター画面になります。

（２）新着記事一覧を表示するショートコードをアレンジ

新規作成した固定ページに、新着記事一覧を表示します。

Cocoonであれば、投稿画面のショートコード＞新着記事をクリック。

すると以下のようなnew_listショートコードが自動入力されます。

[〜new_list count="5" type="default" cats="all" children="0" post_type="post"〜]

上記のコードをそのまま掲載すると新着記事が表示されるため、あえて「〜」をつけています。
実際のコードに「〜」はありません。

それぞれオプション部分は以下を意味します。

count=アイテムの表示数
type=新着記事の表示方法の種類
cats=ブログで設定しているカテゴリ
children=子カテゴリを含めるか否か

全体の新着記事を想定しているので、count=”3” type=”large_thumb“に設定変更すれば他はイジらなくてかまいません。

[〜new_list count="3" type="large_thumb" cats="all" children="0" post_type="post"〜]

新着記事一覧の詳細なショートコードの使い方を知りたいなら、新着記事一覧を表示するショートコードの利用方法を参考にしてください。

本記事では新着記事のショートコード（new_list）を使いましたが、人気記事一覧のショートコード（popular_list）を利用すれば代用可能です。

（３）CSSをコピペ

最後にスタイルシート（CSS）を書きます。

「外観」から「テーマエディター」を選択し、Cocoon Childのスタイルシート (style.css)に書き込んでもよいですが、固定ページ下にあるカスタムCSSに書き込むことをオススメします。

違い

Cocoon Childのスタイルシート (style.css)：テーマ全体に影響するCSS
カスタムCSS：特定の投稿ページ・固定ページのみに適用するCSS

Cocoon Childのスタイルシート (style.css)はテーマ全体に影響するので、誤って削除してしまったりエラーが起きるリスクがあります。

プログラミングなどにあまり詳しくない初心者は、極力触るべきではありません。

カスタムCSSなら、最悪CSSが間違えてしまってもそのページのみなので影響は小さいです。

以下をカスタムCSSに入力してください。

/*******************************
* 新着記事を横並びに
********************************/
.widget-entry-cards.card-large-image .a-wrap {
width:32.5%;
height:auto;
display: inline-flex;
}

@media screen and (max-width: 800px) {
.widget-entry-cards.card-large-image .a-wrap {
width:auto;
display: inline-flex;
}
}

.widget-entry-cards.not-default figure img {
padding: .5em;
}

.widget-entry-cards.card-large-image .a-wrap {
font-size: 95%;
text-align: left;
padding:.5em;
}

これでページの更新をかけると、フロントページの新着記事一覧が横並び表示になります。

お疲れ様でした。

まとめ：フロントページの新着記事を横並び表示にするカスタマイズは簡単

無事に横並びで新着記事一覧が表示されましたか？

CSSの知識がないと難しいですが、3つの手順

フロントページ用の固定ページを新規作成
新着記事一覧を表示するショートコードをアレンジ
CSSをコピペ

通りにすれば誰でも簡単にカスタマイズができたはず。

プラグインも必要なくショートコードで実現できたのは、Cocoon様様です。

質問などあれば、記事下のコメント欄までお願いします。

ちなみに僕のブログでは、以下のように最新記事を3つ表示させて、その下の新着記事一覧ボタンをクリックすると、新着記事が全体で表示するようにしています。

当ブログの新着記事一覧の設定

こちらのやり方は、別記事で紹介していますのでマネしたい方はどうぞ。

WordPressの固定ページに新着記事一覧を表示させる方法【プラグインなし】

質問などあれば、記事下のコメント欄までお願いします。

コピペもいいですが、ブログを自分好みにカスタマイズして個性を出したいなら、HTMLやCSSの知識は最低限必要ですよ。

将来調べる時間を少なくするためにも、自己投資と思って一冊ぐらいは手元に置いておきましょうね。

デザインの学校これからはじめる HTML &amp; CSSの本 [Windows 10 &amp; macOS対応版]

posted with カエレバ

千貫りこ技術評論社 2017-05-26

https://www.the-jibatsu.work/archives/profile-matome.html

んじゃ、今日はこれでおしまいっ！
ほな、バイバーイ！

WordPressテーマの関連記事

＜WordPressの変更方法＞
➤WordPressテーマ変更時の注意点！プラグインでテスト準備,エラーの対処法【Cocoon】
➤ワードプレステーマの変更でSEO/アクセスが不安？リスクに一問一答！

＜『Simplicity2』のカスタマイズ＞
➤Simplicity2のカスタマイズ初心者へ！必ず読みたい厳選5記事
➤コピペで簡単！Simplicity2のおしゃれなカスタマイズ記事まとめ

＜『Cocoon』のカスタマイズ＞
➤Simplicity2からCocoonへ変更！最初にしたい10の初期設定作業
➤WordPressテーマ「Cocoon」カスタマイズまとめ！初心者でもCSSコピペでおしゃれに
➤Cocoonの固定ページを使ってかっこいいトップページを表示させる全手順

＜気になる有料WordPressテーマを全比較！＞
➤WordPressテーマにELEPHANT3新登場！他のテーマと比較・違いを検証

【スポンサー紹介】地方移住部。のすずきちさん！おすすめ記事も紹介！

はまちゃん — Sun, 02 Jun 2019 07:14:59 +0000

こんにちは！地方移住ブロガーのはまちゃん（@wakuwakukeigo）です。

2019年、去年はブームになったスポンサーや純広告も、あまり聞かなくなりました。

ブログにスポンサーが付いている人も、最近では少ないのではないでしょうか？

そんな中、当ブログ「婿養子の島根移住」に新しくスポンサーが就きました。

はまちゃん

すずきち様がスポンサーになってくれたで〜(´;д;`)

しかも、地方移住者として『スッキリ！』に出演することが決まってる「すずきち」さんだー！！

婿太郎

新スポンサーは、脱サラして家族で地方移住したすずきち（@szkjpx）さんです！

僕と同じ地方移住をテーマにした「地方移住部。」を運営されています。

初めて拝見させていただいた時、「ブログ名を交換してほしい」って思いました。笑

僕はあまり考えずにブログ名をつけてましたが、部活にしてしまうのはセンスがありますよね〜。

脱サラして限界集落に家族で移住したいと考える人にとっては、必見のブログになっています。

この記事では、スポンサーになっていただいたすずきちさんと、ブログ「地方移住部。」を紹介していきますね。

はまちゃん

家族でザ・田舎暮らしがしたいなら、すずきちさんを知らなきゃもったいない！

脱サラして家族で地方移住したすずきちさんとは？

地方移住した(い)人と等身大の移住戦略をシェアするブログ「地方移住部。」の運営者✍🏻/ 稼ぐ個人が地域を救う🏃/最近のブログ収益は月収32,307円😇６月の見込収益は8万円😹ブルーハーツファン歴15年

引用 Twitterプロフィール

すずきちさんは、縁もゆかりもない豪雪地の限界集落に家族で移住されました。

豪雪×限界集落だと・・・！？

婿太郎

はまちゃん

地方都市に移住した僕と違って、かなり過酷な環境だろうね！

家族と一緒に今までの生活をガラッと変えられるフットワークの軽さはすごいですね。

現在は、『地方移住コンサルきこりブロガー』という肩書きで、活動されています。

地域おこし協力隊で林業を生業にする『木こり』

すずきちさんは、木こりです。

地域おこし協力隊として自伐型林業に携わっておられます。

地域おこし協力隊とは、人口減少や高齢化等の進行が著しい地方において、地域外の人材を積極的に誘致し、その定住・定着を図ることで、意欲ある都市住民のニーズに応えながら、地域力の維持・強化を図っていくことを目的とする取り組み。

View this post on Instagram

コナラの薪！とりあえず30束納品に参りますー^^ #薪割り #ぜんぶ手割り #田舎暮らし #里山暮らし #自伐型林業

A post shared by 地方移住部。 (@iju_suzukichi) on Nov 26, 2018 at 6:14pm PST

がっつり、林業されていますね！

また、木のスプーンを作り販売もされておられます。

オシャレですよね^^

Instagram

地方移住のきっかけは会社員時代にうつ病になりかけたから!?

すずきちさんは、サラリーマン生活でうつ病になりかけたという経験があります。

そして、地方移住ブロガーの第一人者　イケダハヤトさんの影響を受けたそう。

今の時代は、どこでも生きていけますし、無理して働き続けて自分も周囲も不幸にするぐらいなら環境を変えるべきですね。

とはいえ、一歩踏み出すのが怖いですよね。

決心ができずに、モヤモヤしている方はすずきちさんのブログを読むのをオススメします。

すずきちさんの運営ブログ「地方移住部。」について

『地方移住部。』は、「読者さんに前向きな地方移住を実現してもらい、心と身体と時間にゆとりのある暮らしを送ってもらいたい！」ことを信念に、発信されているブログです。

ブログでは、脱サラして家族で地方移住した実体験をとおして感じた、

移住成功の秘訣
笑えない失敗例
地方暮らしのメリット・デメリット

などを包み隠さずオープンにされていますよ。

個人的に絶対読んで欲しいおすすめ記事ベスト３

第1位　すずきち誕生から地方移住で田舎暮らしをするまでの話まとめ

この記事は、すずきちさんの生い立ちから地方移住を決心されるまでの人生をまとめたプロフィール記事です。

すずきちさんは、アーティスト（映像作家）→サラリーマン→きこり＆地方移住ブロガー→移住戦略家と、様々な経験をされています。

その時々に何を感じ、どうしてきたのかという人間ドラマは、惹かれるものがあります。

ぶっちゃけおもろいです。

めっちゃ濃い人生歩んでますねww

いきなり脱サラして田舎に家族で移住して、上手くいっているのも頷けます。

これを読めば、すずきちさんのファンになっちゃうこと間違いなし^^

第2位　【素人×古民家DIYリノベーション】衝撃！床板を剥がしたらシロアリ出没？

床下にシロアリ！？

すずきちさんは、普通の賃貸ではなく茅葺き屋根の古民家を改修して住まれています。

家賃も安いし、広いし、田舎暮らしの理想ですよね〜

でも、都会で暮らしていると、今までDIYをやったことがない人は大変。

改修って言っても、何をどうしたらいいかわからないですよね。

すずきちさんは経験0から、どのように古民家を再生させてきたのかをブログで綴られています。

その中で、古民家にありがちなシロアリ被害。

写真付きで、どんな光景だったのかと対策方法を解説してくださってます。

https://www.the-jibatsu.work/archives/5253264.html

第3位　【米原・伊吹山テレビ】自伐型林業について白目を剥いてTV取材を受けた話

すずきちさんは、地域おこし協力隊として自伐型林業（小さい林業）をされています。

その活動が、なんと米原市が運営しているケーブルテレビ【伊吹山テレビ】に取材されたそうです。

里山を再生させる『やまもりびと』の動画。

僕も拝見させていただきましたが、自伐型林業がめちゃくちゃ大事な活動であることを学びました。

過疎化↓
里山に関わる人が減る↓
山林が荒廃する↓
生態系のバランスが崩れる↓
土砂崩れや獣害の発生する↓
山村からますます人が離れる（①に戻る）

はまちゃん

この悪循環を止めるために、すずきちさんは活動されてるんですね！

かっこいい〜！

婿太郎

15分ほどの動画なので、ぜひお楽しみください。

https://www.the-jibatsu.work/archives/ibukiyamatv.html

ちなみに、僕も元々は地域おこし協力隊になろうと応募したんですよ！（落ちたけど。笑）

地方移住する方にとって、地域おこし協力隊は最善の選択肢の一つ。

僕の失敗経験から、合格する方法をまとめたので合わせてご覧ください。

>> 地域おこし協力隊になるには？条件～選考の必ず知っておきたい全知識【保存版】

地方移住コンサルきこりブロガー「すずきちさん」を僕は応援していきます！

すずきちさんは、家族で限界集落に地方移住する方のロールモデルとなる活動をされています。

田舎暮らしの様子が、写真たっぷりで生きた情報として伝わるブログを運営されているのは本当にありがたいこと。

僕も地方移住する前だったら、絶対『地方移住部。』を隅から隅まで見ていたことでしょう。

理由は2つ。

田舎のリアルがわかるから
田舎でビジネスを展開する方法がわかるから

ブログを読めばわかりますが、すずきちさんはめちゃくちゃビジネスの勉強をされています。

地方移住を成功させるためには、綺麗事抜きに副業などビジネスを絶対しておくべき。

それを協力隊として実践されておられるので必見です！

スポンサーとして応援いただいた側ですが、僕はこれからもすずきちさんの活動を応援していきます！

はまちゃん

いつか直接お会いして、地方移住について学びたいですね。

僕のスポンサーになってもらったご恩。

これをしっかり返せるように、ブログを育てて、未来の地方移住者とすずきちさんを繋げれるように発信していきたいと思っています！

はまちゃん

これからよろしくお願いします！

Twitter	@szkjpx
ブログ	地方移住部。

はまちゃんの一言

はまちゃん

最新のスポンサー契約状況や料金については、【スポンサー様大募集】純広告の募集内容とスポンサーを募集する目的をご覧ください。

んじゃ、今日はこれでおしまいっ！
ほな、バイバーイ！

【スポンサー様大募集】純広告の募集内容とスポンサーを募集する目的

「婿養子の島根移住ブログ」の現在&過去のスポンサー様一覧

WordPressの固定ページに新着記事一覧を表示させる方法【プラグインなし】

はまちゃん — Mon, 20 May 2019 16:55:26 +0000

こんにちは！ブログのトップページをカスタマイズしまくりのはまちゃん（@wakuwakukeigo）です。

「ブログのトップページが、新着記事一覧なんてつまらない」

そう考えて、ブログのトップページ（フロントページ）を固定ページ化して専門サイトのようにする人が増えています。

特に、WordPressテーマ「Cocoon」の利用者は、当ブログの【Cocoon】脱ブログ！固定ページでサイト型トップページにカスタマイズする方法を読んでくださった方も多いのではないでしょうか？

しかし、この方法には一つデメリットが。

「トップページに新着記事一覧なのはイケてないけど、新着記事一覧も固定ページに載せたい」という、こだわりの強いブロガーのニーズに答えきれていないんです。

はまちゃん

まぁ、最新記事がないとそれはそれで困るよね。

と思い、新着記事一覧ページの作り方を当記事で解説することにしました。

プラグインなしでサクッと作れますよ。

パクってOKですが、シェアするとかコメント欄で感想を書くとかしていたけると励みになるので、よろしくお願いします。

WordPressのトップページを固定ページ化したら新着記事一覧が消える？

まずはおさらい。

固定ページをトップページにする理由は、

新着記事一覧だと古い記事が見られなくなる
様々なカテゴリの記事が順不同で表示されて見づらい
同じWordPressテーマを使っているブロガーとの差別化をしたい
自分の専門性をアピールしたい

といったところでしょうか。

最新記事がズラーッと並ぶブログばかりなので、個性を出したいですよね。

この問題を解決するのが、固定ページでブログのトップページをサイト化させる方法です。

詳しい、カスタマイズ手順は以下の記事をご覧ください。

【Cocoon】脱ブログ！固定ページでサイト型トップページにカスタマイズする方法

上記の記事はトップページを固定ページ化するので、新着記事一覧は表示されません。

しかし、しばらくして僕はこう思ったんですよね。

はまちゃん

新着記事一覧がわからないと、リピーターが来なくなるんじゃね？
何度もブログを読んでくれてる数少ないファンは、僕の最新の記事を待ってくれているじゃね？

一般的に、初めての訪問者は個別記事から、リピーターやお気に入り登録してくれた訪問者はトップページからブログに流入します。

そんなファンの期待に応えたく、トップページに新着記事一覧のページを作りました。

「新着記事一覧のURLってどうやって作るんだ？」と、悩む人も多いですよね。

僕もいざ作ろうと調べると、プラグインが必要そうでめちゃくちゃ迷いました。

だって、今まではトップページのURLで勝手に表示されていたので、新着記事一覧を0から作るという発想がなかったんです。

Cocoonはショートコードで新着記事一覧を表示できますが、全記事を最新記事一覧で表示させるのはできませんしね。

でも、実はめっちゃ簡単に実装できるんですよ。

もちろん、プラグインも必要ない簡単な方法で。

WordPressの固定ページに表示させる新着記事一覧ページの作り方【プラグインなし】

手順は、たった2ステップ。

固定ページを作る
投稿ページに設定する

1分ぐらいでできます。

①固定ページを作る

ワードプレスのダッシュボードから、「固定ページ」＞「新規作成」をクリックします。

タイトルはなんでもいいです。

わかりやすく『新着記事一覧』とでもしておきましょう。

パーマリンクの設定は、新着記事一覧を読者がクリックした時に表示されるURLになります。

読者がわかりやすい名前をつけておきましょう。

パーマリンクの候補例

/new
/contents
/blog
/posts
/articles

僕は『/new』を選択したので、

https://wakuwaku-keigo.com/new/

で新着記事一覧ページが表示されます。

試しにクリックしてみてください。

新着記事一覧はこちら

タイトルとパーマリンクを決めたら、本文は何も書かずに公開します。

②投稿ページに設定する

操作はあと一つです。

「ダッシュボード」＞「設定」＞「表示設定をクリック」します。

「ホームページの表示」で投稿ページをクリックし、あなたが作成した新着記事一覧ページをトップページにしたい固定ページを選択して保存します。

はい！

これで無事に、ワードプレスに新着記事一覧ページが作成されました。

あとは、Cocoonの設定を駆使して、トップページに新着記事一覧を表示させましょう。

まとめ：プラグインなしで簡単！WordPressの固定ページに新着記事一覧ページを表示させてみよう

今回の記事では、プラグインなしでWordPressのトップページを固定ページで作った人向けに、新着記事一覧ページの作り方と表示させる方法を解説してきました。

無事に新着記事一覧ページを、固定ページに作成できましたか？

固定ページを作る
投稿ページに設定する

の2ステップなので簡単。

プラグインが必要ないのもありがたいですね。

知ってればすぐに設定できるけれど、知らないといつまでもできないカスタマイズでしょう。

新着記事つながりで、固定ページのフロントページで最新記事を横並び表示にする方法も書きました。

質問などあれば、記事下のコメント欄までお願いします。

コピペもいいですが、ブログを自分好みにカスタマイズして個性を出したいなら、HTMLやCSSの知識は最低限必要ですよ。

将来調べる時間を少なくするためにも、自己投資と思って一冊ぐらいは手元に置いておきましょうね。

デザインの学校これからはじめる HTML &amp; CSSの本 [Windows 10 &amp; macOS対応版]

posted with カエレバ

千貫りこ技術評論社 2017-05-26

関係人口をつくる定住でも交流でもないローカルイノベーション /木楽舎/田中輝美

んじゃ、今日はこれでおしまいっ！
ほな、バイバーイ！

WordPressテーマの関連記事

＜気になる有料WordPressテーマを全比較！＞
➤WordPressテーマにELEPHANT3新登場！他のテーマと比較・違いを検証

田舎暮らしはやることない？地方移住者は暇つぶしにブログを書いてみ！

はまちゃん — Mon, 28 Jan 2019 14:43:54 +0000

こんにちは！地方移住してブログを書いてるはまちゃん（@wakuwakukeigo）です。

地方移住者のみなさん、田舎暮らしを始めてみて時間を持て余していませんか？

都会で会社員してた頃は残業してたけど田舎は定時帰りで時間が余る
田舎に来たけど、友達が少なくて休日にやることがないし暇すぎる
近場の観光スポットは全部行ったし移住してすぐで友達がいない

都会と比べて田舎は時間がゆっくりしてるので、暇つぶしの方法を知りたいですよね。

しかし、

で検索しても、読書・ネットサーフィン・動画をみる・ゴロゴロする・ゲーム・趣味探し・散歩・筋トレ・釣り・サイクリングといったあたりでしょう。

暇すぎる地方移住者のあなたに、田舎暮らし最強の暇つぶし方法を教えましょう。

それは、ブログを書くこと。

むしろ「地方移住者こそブログを書くべき！」と声を大にして言いたい！

その理由は、ブログは副業になるといった一般的なメリットだけではありません。

ブログを書くことは、地方移住者の心の奥底に眠る願望を叶えることにもなるからです。

今回の記事では、

今回の記事の内容

地方移住者がブログを書く目的
地方移住者に書いてほしいブログの内容
地方移住者こそブログを書くことをオススメする理由

について解説していきます。

はまちゃん

田舎暮らしの暇つぶしでネットサーフィンして、偶然この記事を見つけたあなたはラッキーです。
ちょっとだけ、付き合ってくださいね。

田舎暮らしでやることない地方移住者がブログで情報発信をする意義とは

いくら田舎でやることがないといっても、ワシがブログを書く必要性なんてないしなぁ。
副業で稼げるといってもお小遣い程度でしょ？

と思った地方移住者も多いことでしょう。

ブログは都会や田舎に限らず、手軽にできる副業としても人気ですが、成功するために一番大切なことは継続することです。

これが難しい。

脱サラを目標にブログを始めた多くの人が、半年以内に更新できなくなり、月5000円も稼げず辞めていくんですよね。

原因は様々ありますが、継続できない一番の理由はブログの目的・意義がないからでしょう。

逆に言えば、ブログの目的・意義があれば、ブログを継続できて結果が出ると言えます。

それでは、田舎でやることない地方移住者がブログを書く意義とは一体なんなのでしょう？

ブログを書く意義は地域とあなた、そして『未来の移住者』のため

地方移住者がブログを書く意義は主に3つ。

地域：地域の情報発信をすることは地域活性化に繋がる
あなた：スキル向上+収入になる
未来の移住者：地方移住をするときの参考になる

何と言ってもあなたが住む場所に来る「未来の移住者」に役立られるのは最高ではないですか？

地方移住者のあなたは、少なくとも自分が住む地域を盛り上げたいと思っているはずです。

このご時世に地方移住するってことは、地域活性化に関心がある人が多いですからね。

田舎暮らしを経験する中で、様々な課題や誰かに話したい魅力にも気づいていることがあるはず。

しかし、「何か地方創生に関わりたいけど何をしたらいいのかわからず、地域との繋がりが築けず孤独」というのが、現実のところではないでしょうか？

大丈夫。

ブログを書けば、あなたの願望が叶いますし、最強の趣味になるし、収益源にもなる。

ブログを書くことで移住先の情報発信をする、つまり関係人口をつくることなんですから。

posted with カエレバ

例えば

●●さんのブログを読んで、△△市に移住することにしました。

●●さんがうちのお店のことを書いてくれたから、お客さんが増えたよ！
ありがとう！

ホームページがなくて困ってたんだ！
役立つ情報をありがとう！

「地域住民からこんな声を書けられたら嬉しい！」と思ったら、もれなくブログを始めましょう。

僕は、このことにやりがいやワクワクを感じるので、1年続けても全くブログを辞めようと思いませんでした。

>>　地方移住ブロガーの僕がブログを書く理由

地方に若者がいない&流出が止まらない理由は田舎が情報発信してないから

あなたの小さな一歩が、地域の未来を作ります。

はまちゃん

田舎でやることないんでしょ？
初期費用も0円で始められるブログは、暇つぶしにもってこいだよ。

地方移住者が書くべきブログの内容【やることない時の田舎の暇つぶし感覚でOK】

でも、ブログで成果を出すには100記事以上書かないとダメって聞いたぞ？
ワシ、すぐにネタ切れすると思うんだけど・・・

確かにブログを書く難易度は下がってるとはいえ、ブログ初心者がネタ探しをして書き続けることは大変です。

しかし、地方移住者のあなたはおそらくネタ切れになりません。

なぜなら、あなたの生活すべてが価値あるコンテンツだから。

地方移住にいたるストーリーや移住前後の感想は面白い

地方移住者は、『都会から田舎に住む場所を変える』という、とても大きな経験をされています。

あなたは、なぜ地方移住をしたのですか？

東京の仕事がキツくて逃げ帰るように地元に戻った
サーフィンが好きすぎて毎日サーフィンができる地域に移住した
旅行した時の人の暖かさに触れて即退職届を出した
彼女が婿養子を希望したから島根に移住した（笑）

あなたのその経験、めっちゃおもろいです。笑

あなたは、田舎暮らしを経験されるまでに多くのことを考え、情報収集をして人の話を聞いて決断をしたことでしょう。

その地方移住までの過程やストーリーは、十分面白く価値があるコンテンツです。

さらに、移住してからも、日々たくさんの刺激や気づきがあるはず。

あなたの地方移住体験談や何気ない感想を未来の移住者が求めているんです！

日頃の思いをブログにぶっちゃけちゃいましょう。

移住前のあなたやあなたの地域に住む未来の地方移住者が欲しかった情報

あなたは、地方移住する前に、たくさんの情報収集したはずです。

どこに移住するかの決め方
移住する前に知っておきたいアドバイス
移住して後悔したこと
住む地域の実態や風土
地域の独自ルールや県民性　etc

地方移住する前の自分、あなたの地域に住む未来の地方移住者の視点を持って、どんな情報を必要としているのかを意識してブログに書いてみましょう。

むしろ、「田舎でやることないんだー！」ということさえも、ネタになりますよね？

僕も数年前の自分に向けて書いてます。

田舎暮らしの後悔0に！体験者が語る地方移住前に知っておきたかったこと+アドバイス

地域のローカル情報をまとめる地域ブログもあり！

ちなみに、あなたの住む田舎は美味しいご飯屋さんを探すだけでもご飯屋さんの情報が少なくて困っていませんか？

田舎では、食べログなどの大手キュレーションサイトが機能しておらず、本当にオススメのお店や穴場観光スポットは口コミじゃないと伝わらないことが多くあります。

でも、それってもったいないと思いません？

僕が住む島根で言うと、出雲大社しか知られていません。

だから、僕は地域ブログ（地域のローカル情報をテーマに発信するブログ）を作りました。

地方移住の経験談だけでなく、このようなローカルネタを扱うブログを作るのもオススメです。

>>　僕が運営する地域ブログ『しまね縁タメ』

地方移住者こそブログを書くことをオススメする理由【やることないなら暇つぶしに始めよう】

確かに未来の地方移住者の力になりたいけど、体験談なら書けると思うけど、ワシがブログを書くべきなんだろうか？
自治体のホームページに、移住情報や観光サイトもあるぞ？

心配ご無用！

地方移住者がブログを書くメリットはたくさんあります。

【地方移住者こそブログを書くべき】

・将来の移住者に役立つ
・生活全てがコンテンツになる
・低賃金を補える
・ライバル少ない
・地域格差がないビジネス
・ネタ探しで移住先を理解できる
・都会との比較で田舎の魅力とダメな点に気づける
・知り合いが増える
・発信力が鍛えられる
・趣味になる

— はまちゃん@島根移住×(仮)婿養子×地方創生 (@wakuwakukeigo) 2019年1月23日

ツイートしきれなかったことも含めて、地方移住者こそブログを書くべき理由を紹介していきますね。

やることがなくて、暇を持て余したあなたにこそブログはいいぞ！

①市町村のサイトでは伝えられないことも伝えられる

市町村が運営するホームページの中には、情報量が豊富なものもあります。

しかし、行政という立場上、都合が悪いことを包み隠さず公開することができません。

個人のブログであれば、自由に発信することができます。

地方移住を希望する人が求めているのが、『あなたの生々しい声』なんです。

自治体のサイトでは伝えきれない田舎暮らしのリアルを発信しましょう。

ただし、地域の悪口や誰か特定の人物を攻撃するような内容は、ブログだからといって発信すべきではありません。

②地方の中小企業の弱点である低賃金を補える

田舎は都会と比べても給料や年収は安い傾向にあります。

そのため、僕は田舎では副業・複業することを強くオススメしています。

月給を1万円上げることより、ブログで月1万円稼ぐ方がはるかに簡単です。

「誰でも簡単に…」とは言いませんが、正しいやり方で継続すれば月3万円までは初心者でも稼ぐことができるでしょう。

田舎のリスクの一つである低賃金を、暇つぶしで始めたブログで補えたら素敵じゃないですか？

さらに、ブログは経験0・知識0・初期費用0で始められるんです。

③田舎はブロガーはもちろん情報発信者がいないのでライバルが少ない

ご存知のとおり、田舎は情報発信者が圧倒的に少ないです。

SNSではちらほら見かけますが、ブログまで作って発信している人はほんの一握り。

例え、都道府県レベルでブロガーがいたとしても、市町村レベルで見たらいかがでしょう？

ブログは最強の暇つぶしでありながら、月1000万円以上も稼げるポテンシャルを秘めたれっきとしたビジネスです。

ビジネスの鉄則として、ライバルが少なく自身がNO.1になれる場所で戦うことは非常に重要。

地方は人口がそもそも少ないので、一番になりやすく競合となるメディアが少ないというメリットがあります。

まさに、ブルーオーシャンです！

④都会と地方といった地域格差がないビジネスである

例えば、カフェを開業するとしましょう。

人通りが多い場所と少ない場所、どちらで開くとより多くのお客さんが集まるでしょうか？

考えるまでもなく、市場が大きな場所でビジネスをした方が有利ですよね。

このように、ビジネスの種類によっては地域格差が生まれます。

一方で、ブログは都会に住んでいようが、田舎暮らしであろうがほとんど変わりません。

ライバルが少ないことを考えたら、ブログテーマによっては田舎の方が有利に働くことさえあります。

⑤ブログのネタ探しの中で移住先を深く理解できる

ブログテーマはなんでも構いません。

しかし、僕はあなたの住む地域のリアルや、あなたの体験談といった唯一無二のコンテンツから始めることをオススメしました。

その場合、ブログを書こうとネタ探しをすると、自然と地域へ関心を寄せていくことになるんですよね。

結果、移住先の地域を深く理解でき、移住先をもっと好きになれます。

地方移住して失敗する人も多いですが、地域のことを理解することは地方移住者にとって必須です。

『ブログを書く作業＝地域を理解を深めること』になります。

⑥地域に足を運ぶので知り合いが増える

例えば、食べ歩きブログを書こうとすると積極的に外出をしますよね？

地域の歴史を知ろうとして、詳しい人に話を聞きにいきますよね？

ブログを始めると、執筆作業の中で自然と知り合いも増えてきます。

知り合いがいなくて孤独だから家に引きこもる。

これではせっかくの田舎暮らしを楽しめません。

積極的に外に出かけましょう。

⑦都会との比較で田舎の魅力とダメな点に気づける

地方移住者の中には、「地元の人よりも地域に詳しくないのにブログなんて書いて大丈夫だろうか？」と不安になる人もいるでしょう。

しかし、地方移住者だからこその利点があります。

それは、２拠点以上の場所で生活してきて比較をできることです。

島根に移住した僕の場合、地域の人間性・風土・文化・生活環境といった、あらゆるものを東京や大阪といった都会育ちの視点を持って評価することができます。

例えば、島根のラーメン屋をオススメする場合で考えましょう。

島根県から一歩も出たことがない人が、

島根での中でも美味しいラーメン屋だよ！
オススメする！

地方移住者が、

はまちゃん

島根だけでなく大阪や東京のラーメン屋を渡り歩いてきたけど、その中でも上位に入る美味さやわ！
ぜひ行って！

地方移住者の方が、信頼性が高くて「ラーメン屋に行ってみたい」と思いますよね？

これは、地方移住者にしか持っていない最大のメリットであり最大の武器です。

「よそ者」だからこそ気づける魅力やダメな点があります。

ブログを書く場合でも、大いにその視点を大切にしてください。

⑧ブログ運営の中で発信力スキルが鍛えられる

「ブログでお金を稼げる」というメリットと双璧をなすと考えているのが、「発信力が鍛えられる」ということ。

情報発信力を手に入れられると、

あなたが望むものが手に入りやすくなる
助けてくれる仲間が増える
ビジネスの集客に困らない

など、人生がイージーモードになります。

ブログだけでなくSNSを始めてインフルエンサー（影響力がある人）になれれば、講演・書籍化など文字通り人生を変えることも夢では無くなります。

ブログは、情報発信スキルを身につけるのに最適なものの一つです。

⑨田舎の暇つぶしがいつのまにか趣味・ライフワークになる

ブログのすごいところは、

在庫も必要なく、
一人で始められて、
初期費用も0円で始められるのに、
利益率が高くて、
安定した収入になることです。

あともう一つ。

暇つぶし感覚で始めたものが、人生を豊かにする趣味になり、趣味＝仕事のライフワークになれる可能性を秘めていること。

僕はまだまだ、ブログ一本で食っていけるというレベルではありませんが、楽しい趣味にはなりました。

ブログを書くことが苦痛ではなく、楽しいものなので今後も続けていくことができます。

「好きなことで生きていく」一歩をブログで歩んでみませんか？

すぐに始められて辞めることができるので、田舎でやることないならサクッと始めましょう。

⑩地方が抱える課題を解決に導けるかもしれない

最後に、あなたが発信する内容によっては、地方が抱える課題を解決に導くことができるかもしれません。

田舎で現実に起きていることとして

人口減少
少子高齢化
商店街・繁華街の衰退
地域ブランドの不在
地域コミュニティの衰退

などが挙げられます。

大きな課題ばかりですが、これらは何かミラクルなスーパー施策で解決できるものではありません。

日々の愚直な積み重ねの中で解決に向かっていくものです。

地方創生という言葉を使うと大きなプロジェクトと思いがちですが、大事なのはできることから始めることが大切です。

地方創生の意味とは？地域活性化との違い・課題や問題点・成功&失敗事例・必要なこと

地方移住者のあなたができることはなんですか？

地域の魅力やあなたの想いを伝えたいのなら、ブログは有効な手段です。

ぜひ、せっかく発信するなら地域課題の解決を意識して、発信者になってください。

地方創生は以下の書籍が参考になります。

posted with カエレバ

凡人のための地域再生入門地元が、ヤバい・・・と思ったら読む /ダイヤモンド社/木下斉

posted with カエレバ

まとめ：田舎でやることない&暇すぎる地方移住者はブログを書こう！

今回は、地方移住者こそブログを書くべき理由について解説してきました。

地方移住者がブログを書く意義は、地域活性化に関われること
ブログの内容①：移住前後のストーリーと移住後の感想
ブログの内容②：移住を考える人へのアドバイス
ブログの内容③：地域の情報が不足してるならローカルネタ
理由①：自治体で伝えられないことが伝えられる
理由②：低賃金を補える
理由③：ライバルが少ない
理由④：地域格差がないビジネス
理由⑤：移住先を理解できる
理由⑥：知り合いが増える
理由⑦：都会と田舎を比較・評価ができる
理由⑧：情報発信スキルが身につく
理由⑨：趣味・ライフワークになる
理由⑩：地域課題を解決できるかもしれない

ブログは、副業としても奥が深く結果を出すには努力が必要です。

そして、何よりもブログを継続することが大切。

なので、田舎暮らしでやることがない時の暇つぶし感覚で、日記を書くつもりで楽しんでブログを書いてみてください。

地方創生・地域活性化のために何をすればいいかわからない地方移住者でも、ブログを始めることは十分地域のためになるので。

それが回り回って、自分の生活を助けるビジネスに育ったら最高じゃないですか。

事実、僕は自身の島根移住経験を暇つぶしで自由にブログを書いていたら、自動販売機のようにお金を運んできてくれるようになりました。

まさに、田舎暮らし最強の暇つぶし方法と言えます。

今回の記事を読んで、ブログを始める地方移住者が増えることを祈っています。

ワードプレステーマ変更のSEOリスクは？試したのでアクセス減少など不安点に答えます

はまちゃん — Tue, 06 Nov 2018 02:41:30 +0000

こんにちは！何も考えずSimplicityからCocoonにWordPressテーマを変更しちゃったはまちゃん（@wakuwakukeigo）です。

この記事は、

この記事を読むべき人

Simplicityをかなりカスタマイズしてるけど、Cocoonに変更してデザインが崩れないか不安…
WordPressテーマを変更時のリスクを教えてほしい！

というあなた向けの記事です。

ブログのWordPressテーマを変更するのが初めてだと、テンプレートを変更するのは不安たっぷりですよね。

僕もそうでした。
そして、見事に撃沈（笑）

その理由は、注意力不足と事前準備をしていなかったからです。

WordPressテーマ変更手順まとめ！注意点・エラー対処法・事前準備・プラグインのテスト方法

ワードプレスの変更のリスクとしてよく聞くのは、

ブログのアクセス数が減少
SEOに悪影響
カスタマイズしていたデザインが崩れる

といったところでしょうか？

ご安心ください。

僕が人柱となって、実際にワードプレステーマを変更した体験談をベースに、あなたの不安点・リスクに一問一答していきます！

あなたの不安を解消してWordPressテーマを変更できるようになりますように。

Simplicity→Cocoon向けに書いていますが、別のワードプレステーマ（テンプレート）に変更する場合でも役立つ情報満載です。
目次から気になるページへジャンプしてください。

僕がSEOやアクセスなどのリスクを承知でワードプレステーマを変更したかった理由とは？

僕はもともと、無料ワードプレステーマのSimplicity2を利用していました。

Simplicity2をおしゃれにカスタマイズしていたので満足していた僕。

Simplicity2のカスタマイズ初心者へ！必ず読みたい厳選5記事

コピペで簡単！Simplicity2のおしゃれなカスタマイズ記事まとめ

しかし、ある日とあるツイートを見て発狂することになります。

無料WordPressテーマ「Cocoon（コクーン）」を公開しました https://t.co/YLIHygiTac pic.twitter.com/cUhrR4RIfk

— わいひら@寝ログ (@MrYhira) March 19, 2018

はまちゃん

うおーーー！！Cocoon最高すぎるやんけ〜！！
まだ、テスト中らしいし、近いうちに変更しよっと٩( ᐛ )و♪

そんなこんなで1ヶ月半ほどもんもんしてましたが、Simplicity2の後継WordPressテーマのCocoonの機能が最高すぎたので、ブログテンプレートを変更したって経緯でした。

しかし、大きな誤算が！！

Simplicity2をがっつりカスタマイズしていたので、おしゃれなデザインにしていたブログが

▼（変更前）Simplicity2▼

こうなった…

▼（変更後）Cocoon▼

Simplicity2をあんなに頑張って、カスタマイズに時間をかけておしゃれにしたのに…

台無しやんけ！！

はまちゃん

Cocoonの初期デザインは、悪くないけどシンプル過ぎる…

当時は、なぜWordPressテーマを変更する前にテストをしなかったのか、激しく後悔しましたねorz

僕はブログがおしゃれじゃないと、ブログを書くモチベーションが著しく落ちてしまうので、カスタマイズをしてデザインを整えました。

▼こんな感じにね▼

Cocoonにして、すぐに満足できるブログに戻せたので一件落着。

やはりワードプレステーマを変更するのは、それなりのリスクがあります。

デザインが崩れるだけなら、HTMLやCSSをカスタマイズすればいいだけですが、SEOに悪影響が出てアクセス数が減少する可能性もあるんです。

ワードプレステーマを変更してアクセス数が減少するのは内部SEOが原因！？

ブログのテーマを変更するとSEOに影響はある！デメリット以上にメリットはある？

ワードプレステーマを変更して、

アクセス数が落ちる
SEOに不利

と言われる理由はなんなのでしょうか？

そもそも、ワードプレステーマを変更しただけで、アクセス数が急激に上がることはありません。

まぁ、テンプレートのデザインによってブログの回遊率が上がったりはするかもしれませんけどね。

反対に、ブログのテーマを変更すると、少なからずSEOやアクセス数には影響が出ます。

テーマによっては、hタグの使い方が違ってたりもするし…

かなりのアクセスがあるメインブログは、テーマ変更で検索順位に大きな影響を受けてしまう可能性があるので、不用意にWPテーマを変更しない方が良いでしょう。

ただし、そのデメリット以上にテーマ変更のメリットがあるなら別！

今のあなたのブログが、以下のような状況ならテーマを変更すべきです。

スマホ対応になっていない（見た目じゃなくモバイルフレンドリーテストに合格してるかが重要）
ページの表示速度が遅い
現在のワードプレステーマはSEOに最適化されていない
見た目のデザインが古い（SEOには関連しないけど直帰率に影響）
AMP対応していない

変更によってもしアクセス数が落ちても、現状のワードプレステーマがSEO最適化がしていれば徐々に上がります。

アクセスが減少する原因はワードプレステーマによって内部SEOの対策がしっかりされていないから

SEOやアクセス数に影響がある理由は、はっきりとはわかりませんが一般的に内部SEOが原因していると言われています。

わからない人のために簡単に補足しておくと、SEOとは”Search Engine Optimization” の略で検索結果の順位をあげる対策のことです。

SEO対策（検索エンジン最適化）は大きく分けて2つ。

内部SEO対策
外部SEO対策

内部SEOとは、サイトの内部構造や、htmlタグのソースを検索エンジン用に最適化する作業のこと。

内部SEOは200以上の要素があると言われており、全てを説明しきるのは難しいです。

なので、内部SEO対策の一つにワードプレステーマの構造も影響しているという理解だけしておきましょう。

ちなみに、外部SEOでわかりやすいのは、外部リンクですね。

まとめると、

つまり、内部SEO対策がしっかりされていないワードプレステーマに変更してしまうとSEOに悪影響が出てアクセス数が減少するということ！

もちろん、プラグインが合っていないことや、表示速度など他にも原因は考えられます。

お分かりでしょう？

ワードプレステーマを変更するなら、こういったリスクを避けるためには、信頼できるブログテンプレートを選ぶことが重要なんです。

僕が変更したCocoonは、内部SEO対策もしっかりしているので安心できます。

アクセス数が半減したり、検索上位に表示されていた記事が、テーマ変更で圏外になることもあるので、その場合はすぐにワードプレステーマを戻しましょう。

テーマを戻すと、徐々にアクセス数が増えてくるはずです。

とはいえ、ワードプレステンプレートを変更するのは不安でしょう。

なので、実際に僕がSimplicity2からCocoonにブログテーマを変更してどうだったかを、次章から一問一答形式でリスクに回答していきます。

ワードプレステーマを変更してSEOやアクセスは大丈夫？あなたの不安点（リスク）に一問一答

ざっくり思いつくままですが、あなたがワードプレステーマの変更で考えてる不安に回答していきますね！

以下のリスクの回答は、Simplicity2→Cocoonの変更した僕の体験がベースとなっています。
他のWordPressテーマでは違うこともあるかもしれませんのでご了承ください。

【画面真っ白になる不安】WordPressテーマの変更リスク・デメリット

ブログが真っ白になったり表示しなくなったりしない？

Simplicity→Cocoonでは大丈夫でした。

というより、きちんと説明書や解説書に沿って設定したら、まず間違いなくそんなことは起こらないはずです！

もしそうなってしまっても、作者やWordPressテーマ販売元に連絡したら対応してくれるはずです！

WordPressテーマとPHPの相性が悪くてエラーが出たりしない？

Simplicity→Cocoonでは問題ありませんでした。

古いWordPressテーマを利用するとあるみたい。

利用しているサーバーのPHPバージョンが最新で、WordPressテーマを使うときは注意。

【デザイン崩れの不安】WordPressテーマの変更リスク・デメリット

デザインが崩れたりしない？

Simplicity→Cocoonではデザインが崩れました。

いやーこれは焦りましたね。

WordPressテーマの変更直後は、

と検索しちゃったほどです（汗）

ただ、こちらについては僕の事例のとおり、Cocoonのカスタマイズは簡単なので、少しいじれば戻すことができます。

後述しますが、面倒なカスタマイズ時間を短縮するためにも、ワードプレスの変更前に、Simplicity2時代の設定内容・CSSを控えておくことをオススメします！

さらに、不安なあなたには嬉しいことに、最悪デザインが崩れても、Cocoon→Simplicity→CocoonというようにWordPressテーマを戻すこともできます。

前のブログのデザインとほぼ同じ見た目にしたいんだけど？

Simplicity→Cocoonでは無理でした。

かなりCSSをカスタマイズしたりするとできるかもしれませんが、基本的にはできません。

ただ、僕はブログのデザインを変えようと思っていたので、問題はありませんでした。

中には、「前のイメージを再現したい！」という方もいるかもしれません。

ブログデザインが変わると読者さんがびっくりしますもんね。

ただ、WordPressテーマによってはできるものがあるようですが、基本的に新しいテンプレートに合わせるべきです。

テンプレートはある程度カタチが決まったものなので、無理に合わせるとそもそも時間がかかるし、新たな不具合発生に繋がります。

なので、僕がオススメしたいことは、これらを前のWordPressテーマと統一させることです。

POINT

ブログのメインカラーを前テーマと同じにする
見出しのデザインを同じにする
背景色を合わせる
カラムを同じにする

これだけで、前のブログのイメージを引き継げると思うのでぜひお試しあれ。

【SEOの不安】WordPressテーマの変更リスク・デメリット

SEOに悪影響が出て記事のアクセス数が落ちたりしない？

Simplicity→Cocoonでは問題ありませんでした。

WordPressテーマの変更で、アクセス数が落ちたら本末転倒。

ブログ収益にも直結するので、絶対避けたいところですよね。

Cocoonへの変更ではなんともありませんでしたが、WordPressテーマの変更とSEOは関係ないとは言えないようです。

WordPressテーマが、きちんと内部SEO対策されたものかどうか、評判など十分に調べてから変更するようにしましょう。

CocoonはもちろんSEO対策もバッチリです！

【データ削除の不安】WordPressテーマの変更リスク・デメリット

今まで書いたブログ記事が消えたりしない？

Simplicity→Cocoonでは問題ありませんでした。

というより、全部消えたら多分ブログ辞めてます（笑）

WordPressテーマとブログ記事は管理している場所が違うので、変更によって記事が消えることはありません！

ご安心を！

これまでにアップロードした画像が消えたりしない？

Simplicity→Cocoonでは問題ありませんでした。

アップロードした画像が消えたら、記事の書き直しが必要になるので、絶対避けたい不安要素ですよね。

でも、それはないのでご安心ください。

【設定リセットの不安】WordPressテーマの変更リスク・デメリット

各記事のAMP設定や装飾は消えたりしない？

Simplicity→Cocoonでは問題ありませんでした。

CocoonにはSimplicity2の引き継ぎ機能があります！

2018年5月現在、以下の機能が引き継げます！

SEO設定（メタディスクリプション等）
広告設定（広告の除外）
AMP設定（AMP表示しない）
ページ設定

実はCocoon公開当時は、メタディスクリプションの引き継ぎなどはできなかったのですが、作者が引き継げるように変更してくれました。感謝しかないですね。

各記事の装飾は「テキストモード」を見ると、タグで書き込まれていますよね？

ワードプレステーマ変更とテキストタグは無関係なので、書き換えられることはないので、同じく消えないんです。

ただし、WordPressテーマ独自のショートコード[●●]を使っていたら、装飾が消えちゃう危険性はあります。

有名なのはSTORK（ストーク）のショートコード。

僕は試していないので絶対とは言えませんが、テーマ独自のおしゃれなショートコードはWordPressテーマの変更で使えなくなるし、反映されていないでしょう。

サイドメニューの設定やウィジェットの広告は消えたりしない？

Simplicity→Cocoonでは一部ウィジェットが停止しました。

というのも、CocoonにはSimplicity2の引き継ぎができますが、全てが引き継げるわけではないからです。

僕はほとんど問題ありませんでしたが、Simplicity時代に設定したウィジェットが一部停止になりました

一部の広告やWordPress Popular Posts で人気記事ランキングなどを設定していたら、消えちゃったりしてますね。

だから、ウィジェットの見直しは必須だと思います。

Simplicity2からCocoonへ変更！最初にしたい10の初期設定作業を参考に修正してみてください。

各記事の被リンクがなくなったりしない？

Simplicity→Cocoonでは問題ありませんでした。

被リンクは、URLが関係しているためワードプレスのテンプレートとは無関係です。

ただし、WordPressテーマの移行後にパーマリンクを変更したら、被リンクがなくなっちゃいますよ！

パーマリンクはSEOに関係しているので、ブログ記事を公開したら絶対変えないように！

アクセス数が0になっちゃうよ！

【プラグインの不安】WordPressテーマの変更リスク・デメリット

ダウンロードしたプラグインが消えたりしない？

Simplicity→Cocoonでは問題ありませんでした。

プラグインは消えたりしないし、停止になったりもしませんでした。

しかし、WordPressテーマによってはプラグインが停止状態になるという噂も聞きます。

もし、停止してしまってもプラグインは消えたりしないので、必要なプラグインを有効化しましょうね。

WordPressテーマとプラグインの相性が悪くてエラーが出たりしない？

Simplicity→Cocoonではプラグインのエラーが出ました。

僕が現在発見したエラーが出るプラグインは以下の２つ。

Table of Contents Plus
TinyMCE Advanced

Table of Contents Plusは目次を出すプラグインですね。

Simplicity2からCocoonへ変更！最初にしたい10の初期設定作業に書きましたが、Cocoonに変更すると目次がダブります。

上記URL記事を見て修正してみてください。

TinyMCE Advancedは、ワードプレスのビジュアルエディタの拡張プラグインですね！

▼Cocoonに変更したらこんな感じになりました。

一見問題なさそうですが、Cocoonのめっちゃ便利な機能のスタイルドロップダウンリストがないんです！

▼プラグインを削除したら出た！

「便利なプラグイン」と「便利なWordPressテーマの機能」がケンカしちゃった例ですね。

（2018年5月12日追記）
わいひらさんに質問したところ、エラーではなく別の場所に表示されていることが判明しました！

他にもあるかもですが、今のところはありません。

【新テーマ利用の不安】WordPressテーマの変更リスク・デメリット

新しいWordPressテーマをちゃんと使いこなせるかな？

・・・これは頑張れとしか言えないですね（笑）

ただ、基本的にWordPressテーマはどれも使いやすいように、製作者の方が考えてくださってるので、不安になる必要はないと思いますよ！

HTMLやCSSの知識がないブログ初心者の僕でも、思いどおりにCocoonをカスタマイズできています！

Cocoonは公式デモサイトが充実してるので、行いたいカスタマイズがあれば検索してみください↓

Cocoon

SEO・高速化・モバイルファースト最適化済みのシンプルな無料Wordpressテーマ。100％GPLテーマです。

はまちゃん

安心してWordPressテーマの変更はできそう？

おう！SEOのリスクも理解したし、不安点も解消されてバッチリだぜ！
これで安心して、WordPressテーマの変更ができそうだ！

婿太郎

はまちゃん

よかったわ。
最後に、念のためワードプレステーマを変更する前には、リスクを最小限にする注意点をまとめた記事を読んでからにしてね。

WordPressテーマ変更手順まとめ！注意点・エラー対処法・事前準備・プラグインのテスト方法

まとめ：SEOやアクセス数が下がるリスクを理解した上で準備をしてワードプレステーマは変更しよう

ここまで読んでいただいたらわかるとおり、ワードプレステーマを変更するときに大切なことは、以下の3つ。

テーマ変更はSEOに不利でアクセス数が落ちるリスクがあることを知る。
評判が良く内部SEO対策がされたテンプレートを選ぶ。
もし、アクセス数が落ちたら元のワードプレステーマに戻す。

Cocoonに変更した時のリスクは、ご覧のとおりです。

この記事では、SEOのリスクやテーマ変更のデメリットばかり話してきましたが、実際僕はテーマを変更してからアクセス数が爆上げしました！

ブログの表示速度も上がったので、個人的には大満足です。

不安な気持ちもわかりますが、今より一歩先に進むにはブログテンプレートを変更に挑戦してみてください。

僕は、無料ワードプレステーマを現在は利用していますが、ゆくゆくは有料WordPressテーマを利用したいと思っています。

▼気になる有料ワードプレステーマを以下の記事で比較したので、よければご覧ください。

【特典付】WordPressテーマ ELEPHANT3レビュー！他のテーマと比較検証したよ

【Cocoon】脱ブログ！固定ページでサイト型トップページにカスタマイズする方法

はまちゃん — Tue, 11 Sep 2018 08:41:02 +0000

『これからはCocoonが天に立つ』

こう言い放ちWordPressテーマ界に殴り込みをかけたCocoon（コクーン）。

ブロガーにとっても衝撃で、無料のワードプレステーマとしては圧倒的な存在感を示しました。

もちろん、僕も機能とデザインに惚れ込み、これまで使っていたSimplicity2からCocoonへ移行しました。

さらに、Cocoonをおしゃれにカスタマイズして、かっこいいブログに仕上げてCocoonライフを過ごしていました。

だがしかし！

上記の記事を公開してからたくさんの方々に読まれ、いただいた通知の数々。

中でも、「トップページを固定ページにするやり方教えろや！ボケがぁ！！」という問い合わせがかなりありました。

カスタマイズ方法の質問を受けるのですが、ブログ初心者の僕がCocoon（コクーン）のトップページを個性を出すために、様々な試行錯誤があって今にいたっています。

はまちゃん

正直、教えたくない…

おいおい、心の声漏れてるぞ？　大丈夫か？

婿太郎

でも、問い合わせを頂ける方からの感謝の声に応えるためにも、泣く泣く固定ページでCocoonのトップページの作り方を公開することにしました(他のWordPressテーマでも流用可)。

しかも、丸パクリできるように自作したCSSコピペOKのテンプレート付。

はっきり言って、真似するだけで「ブログのトップページは新着記事が並ぶ」という常識があるブロガー界で、一味違う個性あるブログが作れるでしょう！

ここまでするんだ…！

良い記事だったら、はてブとシェアしてくださいね(-人-)

当記事を参考にCocoonのカスタマイズをした方は、ブログの紹介企画をやっています。詳細は一番最後に書いているので、ぜひご覧ください♪

【追記】
本記事を公開してから、たくさんの方にマネしていただきました。
それはいいのですが、僕が考えたテンプレートをパクり、当記事にリンクを付けることなくさも自分が考えたようにスタイルシート（CSS）を公開されている方が散見されます。
礼儀として、最低限この記事のリンクをつけるなどモラルを持って貰えると助かります。

お問い合わせが大変多くなっています。似た質問が多いので、ご質問は全員が見れる記事下のコメント欄へお願いします。

記事を参考にWordPress「Cocoon」のブログトップページを固定ページで作るメリット

Cocoonのトップページをブログ型からサイト型へデザインを一新できる

最初に、この記事でマネできるCocoon（コクーン）のトップページ（固定ページ）を見せておきましょう。

変更前のCocoonのトップページデザインはコレでした。

（Before）

このCocoonのカスタマイズ方法は、WordPressテーマ「Cocoon」カスタマイズ攻略！CSSコピペでおしゃれにするまとめで紹介しています。

ブログのトップページを作ったので、作り方から実測効果まで全部紹介

そして・・・・

この記事で紹介する固定ページで作ったCocoonのトップページがコレだっ！！

（After）

クリックして画像を確認するか、当ブログのトップページから全体を確認しよう。
※ただし、当ブログのトップページは時間経過とともに、さらにカスタマイズを加えている可能性があります。

はまちゃん

自作したブログトップページのデザインはどうですか？
気に入ったらテンプレートにしてるので、最後まで記事を呼んでくださいね。

ご覧のように、このCocoonのトップページデザインのキモは、カテゴリごとに新着記事を表示するようにした点。

つまり、一般的な新着記事順のトップページをやめたということです。

僕個人としては、ブログ型からサイト型に変更したという認識です。

ブログ型：個人日記のような新着記事順のトップページのこと。
サイト型：ホームページのように必要な情報が整理されたトップページのこと。

はまちゃん

記事数がまだ少ないのでカテゴリ毎の新着記事順にしてますが、今後は徐々に特集ページやお知らせがある、ホームページみたいなトップページにする予定です。WordPressのカスタマイズ楽しい〜！

ブログのトップページを固定ページで作ればアクセスアップできる（かも）

僕がブログのトップページを変えようと思った理由は2つ。

ワードプレステーマ「Cocoon」で個性を出したかっこいいデザインにしたかったから
「最新記事順のブログは読者からすると見にくいのでは？」という不安があったから

ブログ歴8ヶ月程度のブログ初心者の僕ですが、ブロガーになってたくさんのブログを見てきました。

そこで気づきましたが、最新記事順って読者目線で見るとわかりにくくないですか？

僕の場合だと、婿養子の記事→移住の記事→ブログ運営の記事→WordPressの記事…というように、記事ネタがバラバラで思いついた順番で記事を書いていました。

これを読むあなたはどうですか？

ブロガーは好き勝手な順番で記事を書いていくので、読者からすると、

このブログって、何のブログだ？

と思われてしまっているかもしれません！

はまちゃん

特化ブログならまだしも、雑記ブログだとトップページ、つまりブログの顔を見ても何のブログかわからんって、やばくない！？

という仮説があって、トップページを固定ページを使って改造できないか考え始めました。

そして・・・・

NAE（@naenotenet）さんの記事にたどり着きました。

ブログトップページを作りました。コンセプト、コンテンツ設計の考え方、実際の作り方や使ったプラグイン、作成前後での数値変化などをまとめました。

要約すると、トップページをリニューアルすると、

平均ページ滞在時間
直帰率
離脱率

のデータが改善してアクセスが増えたって話。

トップページをリニューアルするだけですげぇ効果！

でも、アクセスアップ以上に僕がCocoonをリニューアルする決め手になったのが、記事内のNAEさんのこの言葉に共感したからでした。

ちなみに、およそ月10万PVの当ブログにおけるトップページへのアクセス数はおよそ月2000PVです。

たった2%のためにトップページを作り込む必要があるか？　と言われるとぐうの音も出ません。

しかしその2%は、ブログそのものが主役であるトップページにまでわざわざ来ていただいた「大事なお客様」であることを忘れてはいけないと思うんです。

はまちゃん

検索して記事を読んでくれた読者が、わざわざトップページを見てくれた…
こんな数少ない大事なお客様を、僕も大事にしたい！！

まだ、Cocoonをリニューアルして間もないのでデータがないですが、トップページの変更した効果検証も今後、データでお見せできるようにしていきますね。

（追記）

アクセス数含めて、トップページを変更してから数字が軒並み改善しました。

ただ、当記事を書いたことでトップページを見る人が爆増したこともあるので一概には言えませんが(^_^;)

WordPressテーマ「Cocoon」なら簡単！ブログトップページを固定ページでサイト型にする作り方

それでは、Cocoon（コクーン）で、ブログトップページ（フロントページ）を作る方法を説明していきますね。

具体的な作り方は、以下の5ステップ。

トップページのコンテンツ設計
固定ページの作成方法の決定
固定ページの作成
固定ページ・サイドバーのデザイン調整
固定ページをトップページ化

はまちゃん

順番に丁寧にわかりやすく説明します。
テンプレートを用意しているからご安心を！

【WordPress「Cocoon」カスタマイズ】（１）トップページのコンテンツ設計

まずは、トップページをどんなコンテンツ設計にするのかを考えましょう。

考えるべきは、たった2つ。

コンテンツ：ブログのトップページにどんな内容を表示させたいか？
デザイン：考えたコンテンツのレイアウトやデザインをどうするか？

簡易ワイヤーフレームを考えるイメージです。

ワイヤーフレームとは？
→ワイヤー（線）とフレーム（骨組み）の言葉を合わせたWebサイトの下書き。ホームページ制作では必ず必要なもので、クライアントとコンテンツやデザインのすり合わせのために使います。

▼ワイヤーフレームのイメージ

こんなの俺は作れないぞ！？　難しそう・・・

婿太郎

はまちゃん

心配ご無用！
Cocoonはワードプレステーマなので、大まかなデザインは全て決まってるよね？
だから、ヘッダー下に何をどんなデザインで表示するかをざっくりとイメージできたらOKだよ。

難しく考えず、Cocoonの新着記事一覧の部分に、どんな固定ページを作りたいかを考えてみましょう。

①コンテンツ：ブログのトップページにどんな内容を表示させたいか？

ブログ読者によって、最適解は変わると思いますが、代表的なものはこんなところでしょう。

コンセプト：どんな目的で運営しているブログなのか？
運営者情報：どこの誰がブログを書いているのか？
お知らせ：最新記事やおすすめ記事、人気記事10選などは何か？
発信内容：どんなカテゴリで何を発信しているのか？
サービス内容：どんなサービスを提供しているのか？
SNS・フォロー：ブログのフォローはどうすればいいのか？

Cocoonには、

アピールエリア
通知エリア
カルーセル

などの機能もあります。

それぞれをうまく使って、あなたのブログ読者にとってわかりやすいコンテンツが表示させるようにしてあげてください。

難しければ、僕と同じようにカテゴリ別の最新記事を表示させればいい感じになりますよ。

後ほど、コピペできるCSSも公開しますね。

②デザイン：考えたコンテンツのレイアウトやデザインをどうするか？

ぶっちゃけ、HTMLやCSSの知識があれば、ランディングページのようなおしゃれでイカすトップページもできるでしょう。

でも、残念ながら僕はその知識は皆無。

な〜んもわっかりまっせ〜ん(￣▽￣)w

なので、デザインをこだわれる人は勝手に頑張ってください。

HTML・CSS知識が０の方は、後ほど紹介する僕のトップページデザインを参考にしてくださいね。

はまちゃん

ただ、HTMLやCSSは知っていたら確実に武器になります！
少しずつ勉強して損はないですよ？

デザインの学校これからはじめる HTML &amp; CSSの本 [Windows 10 &amp; macOS対応版]

posted with カエレバ

千貫りこ技術評論社 2017-05-26

「Page Builder by SiteOrigin」の使い方

【WordPress「Cocoon」カスタマイズ】（２）固定ページの作り方の決定

作成したいトップページのコンテンツとデザインが決まったら、固定ページの作成方法を考えましょう。

僕が調べた限り2つのブログトップページの作り方があります。

本命は作り方②です。

作り方①：プラグイン「Page Builder by SiteOrigin」で固定ページを作る

2カラムや3カラムで綺麗なトップページを作ろうとすると、HTMLやCSS、JavaScriptといったプログラミングの知識が必要になってきます。

それって大変ですよね？

そんな時に使える便利なプラグインがPage Builder by SiteOrigin。

サイト Page Builder by SiteOrigin — WordPress プラグイン

簡単にカラムを作れる独自のエディタが使えるようになりますよ↓

WordPressを普段触ってるブロガーなら、感覚的に使い方をマスターできると思います。

でも、慣れるまでは大変です…

僕も最初は、このプラグインを使ってトップページを作成してましたが、

はまちゃん

自分の考えてるデザインなら、Cocoonの標準機能で作れるくね？

と思い直して、途中でやめました。

Cocoon以外のワードプレステーマを使ってたり、めちゃくちゃおしゃれなトップページを目指したいなら、Page Builder by SiteOriginで作成されるといいと思います。

プラグイン「Page Builder by SiteOrigin」の使い方はこちらを参照ください。

前回WordPressの記事やページの更新を劇的に手軽に、かつ直観的にさせてくれる「Page Builder by SiteOrigin」というプラグインを紹介させていただきました。今回はその使い方をサンプルとデモを交えながら詳しく紹介させていただきます。

作り方②：Cocoon（コクーン）の標準機能で固定ページを作る

本命はこっち！

Cocoonはありがたいことに、無料テーマだとありえないぐらい高性能なので、標準機能で十分トップページ作れるんですよね。

先ほどのプラグインのように、新たな作業は覚えなくてOK！

しかもHTMLとCSSのコピペで完成しちゃいます！

はまちゃん

なんて簡単なんだーー！！

ブログのWordPressテーマでCocoonを選んだ我々の勝利ですぞ！

婿太郎

【WordPress「Cocoon」カスタマイズ】（３）固定ページの作り方

さて、ここまで固定ページの新規作成ボタンを押しただけで、特に何もしていないと思います。

ここからはWordPressの標準機能を使って固定ページをがっつり作っていきます！

僕はめちゃくちゃ大変で3日ぐらい、「あーでもない、こーでもない」と言いながら、ブログのトップページをカスタマイズしてテンプレート化しました。

でも、この記事を読むあなたはラッキーです。

僕の3日かけた努力の結晶を全てコピペできるんですから！！

はまちゃん

教えたくないよ〜

往生際悪いぞ！？　サクッと教えんかいっ！！

婿太郎

それでは、固定ページの作り方をご説明していきますね。

①固定ページを新規作成する

ワードプレスのダッシュボードから、「固定ページ」＞「新規作成」をクリックします。

タイトルはなんでもいいです。

この記事ではわかりやすく『【Cocoonトップページ】固定ページテンプレ』としておきましょう。

パーマリンクの設定は関係ないので必要ありません。

（追記）記事執筆後に、WordPress5.0となり新しくGutenbergという投稿画面エディターになり、見た目がガラッと変わりました。
以下の記事では、旧エディター（クラシックエディター）を基に記載しています。
Gutenbergの方は、以下の記事でいう『テキストエディタ』へのコピーは、『HTMLとして編集』をクリックすればHTML形式で編集が可能です。
わかりづらければプラグイン「Classic Editor」をインストールすれば、旧エディターに戻せます。

②テキストエディタにHTMLをコピペしよう

固定ページの入力画面をビジュアルからテキストエディタにしてください。

そして、新規ページに下記のHTMLコード（自作した固定ページのテンプレート）をコピー&ペーストしてください。

『ブログタイトル』とは

（ブログに合った画像）

ブログの説明欄〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜

●●をチェック

カテゴリ別の最新記事

カテゴリ①

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

カテゴリ②

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

カテゴリ③

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

カテゴリ④

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

カテゴリ⑤

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

カテゴリ⑥

（カテゴリに合った画像）

キャッチフレーズ

新着記事or人気記事

はまちゃんからのお知らせ

プロフィール

お知らせ①

内容〜〜〜〜

お知らせ②

内容〜〜〜〜〜

お知らせ③

内容〜〜〜〜〜

下記のような固定ページが作成されればOKです。

はまちゃん

見出し2と見出し3のデザインは、僕はカスタマイズしてるから上記のデザインになってるんやで〜

追記

カテゴリ別最新記事の上に全体の新着記事を3つ横並びで表示させて、よりオシャレなデザインになりました。

新着記事下の「新着記事をもっと見る」ボタンをクリックすると、従来のデザインである新着記事一覧が表示されるようになっています。

こちらの実現方法は、以下の記事に詳しく書いているので参考にしてください。

③Cocoonのタグやショートコード機能を使って固定ページを作成

コピペした固定ページのテンプレートをサンプルに、あなたの目指すトップページにするよう内容を追記していきましょう。

僕がおすすめする編集方法を解説していきますね。

【『ブログタイトル』とは】おすすめしたい固定ページのカスタマイズ方法

『ブログタイトル』

ここはあなたのブログ名を入れましょう。

（ブログに合った画像）

ブログのロゴなどのイメージ画像を入れてみては？

ブログの説明欄

ブログを訪問した読者がわかりやすいように、どんなブログか説明しましょう。

または、ブログのテーマを書いたり、どんな読者向けでどんな悩みが解決するブログなのかを書くのもおすすめですね。

●●をチェック

飛ばしたいページのリンクを貼る箇所。

僕はプロフィールに飛ぶようにしています。
「まず読んでほしい記事10選」なんかも面白いですね。

ボタンの色は、僕はライトブルーにしてますが、違う色もCocoonなら簡単に変更できます。
色を変えたいなら記事作成に使える拡張スタイル。ボタン編。を読んでみてね！

【カテゴリ別の最新記事】おすすめしたい固定ページのカスタマイズ方法

カテゴリ①〜⑥

あなたのブログのカテゴリ名に変更してください。

アイコンをつけた方がおしゃれかな？　と思って僕はつけてみましたが、必要なければ削除してもいいと思います。

テキストエディタで見ると、カテゴリ名の前に下記のHTMLを追加しています。
（※）以下のHTMLを削除すれば、アイコンも削除されます。

そして、CSSに下記を追加すると、アイコンを灰色に変えることができます。
（※）色を変更したいならCSSに追記してください。

.my-gray {color: gray}

実は、CocoonはデフォルトでFont Awesomeを読み込んでいるので、簡単にアイコンをつけることができるんです。

アイコンの付け方と色の変更方法は、以下の記事『【Cocoon】グローバルメニューのカスタマイズ』を参考に挑戦してみてください。

FLAT ICON DESIGN -フラットアイコンデザイン-

（カテゴリに合った画像）

カテゴリ別の最新記事を一覧で出すだけでもよかったんですが、なんとなく寂しい感じがしたので画像を入れてみました。

僕は可愛いイメージにしたかったので、FLAT ICON DESIGNから素材を選びました。

フラットデザインに最適！WEBサイトやDTPですぐ使える商用利用可能なフラットアイコン素材がフリー（無料）ダウンロードできるサイト『FLAT ICON DESIGN』

はまちゃん

フラットなデザインでおしゃれなのに商用利用可の無料！
最強のフリー素材サイトやと思うわ。マジで。

逆にかっこいいイメージののトップページにしたいなら、カテゴリ名を書いた横長の画像を入れたらええ感じになりますよ。

キャッチフレーズ

必要なければ削除してください。

僕はハッシュタグのイメージで、入れることにしました。

このカテゴリをもっと読む（もっと見る）

クリックすると、各カテゴリの記事一覧に飛ぶようにします。

カテゴリにあったリンクに修正すれば完成です。

https://●●●●●.com/●●●

はまちゃん

ボタンの文言は自由です。「もっと見る」としても良いかもしれません。

その他、2カラムや3カラムの行・列を追加編集したい場合

ここまで読んだあなたなら、固定ページを僕の固定ページテンプレートじゃなくオリジナリティを出したページにしたいと思っていることでしょう。

その場合、ビジュアルエディタから、新たに2カラムや3カラムなどを簡単に表示できますので、好きにイジってあなただけのトップページを作り上げてくださいね！

▼追記

質問が多かったので、新着記事一覧ページの作り方をまとめました。

カテゴリだけでなく、全体の新着記事一覧を表示させたいなら参考にしてください。

WordPressの固定ページに新着記事一覧を表示させる方法【プラグインなし】

▼追記

アイキャッチ画像の大きさが記事ごとで異なると、ボタン位置がズレてしまいます。

ボタン位置がずれてる…

かっこ悪いと思う方は、以下のコードを固定ページの『カスタムCSS』に追加すれば調整できます。

/* トップページのカテゴリ別最新記事の幅固定 */
.widget-entry-cards .widget-entry-card-content{
padding-top:0.5em;
height:100px;
}

カスタムCSSは固定ページ編集画面の一番下らへん

無事に、位置のズレが直りました。

でも、記事間の隙間が生まれて個人的に気に食わないので追記していません。

ボタン位置を調整。でも記事間の隙間が気になる…

いい感じに、調整できる方法を知ってる方はご連絡くださいm(_ _)m

はまちゃん

パクるだけじゃなく、オリジナリティがあるトップページにしてくださいね。
この記事を読んだ全員が、僕と同じトップページにしたら僕のトップページの個性が死ぬしね。笑

それが本音かっ！

婿太郎

【WordPress「Cocoon」カスタマイズ】（４）固定ページ・サイドバーのデザイン調整

無事に固定ページのコンテンツ作成ができたら、固定ページとサイドバーのデザインを調整しましょう。

①固定ページのデザインカスタマイズする

トップページに不必要な要素を非表示

固定ページをトップページ化するときは、表示すべきでない箇所がいくつかあります。

プレビューを見てください。

【記事上】

パンくずリスト
固定ページのタイトル
記事上のシェアボタン
記事の投稿日・更新日

【記事下】

記事下シェアボタン
投稿者名

これらは、いらないですよね？
人によっては、記事下のフォローボタンすら不要かもしれません。

他の固定ページでは表示してほしいものなので、トップページ用の固定ページのみ非表示させるように、CSSで指定をする必要があります。

色々な要素を非表示にするCSSを以下に掲載しておくので、いらない分だけご利用ください。

/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
display: none;
}
/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
display: none;
}
/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
display: none;
}
/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
display: none;
}
/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
display: none;
}
/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
display: none;
}
/*モバイルグローバルメニュー非表示*/
.home.page #navi {
 display: none
}

グーグルアドセンスと目次を非表示

ブログの顔でもあるトップページ。

そこにアドセンス広告や目次があると、急にダサくなります。

固定ページのビジュアルエディタの右側からチェック1つで非表示にできるので、削除しておきましょうね。

見出し3のデザイン調整

こだわりたい人用ですが、僕のテンプレートではトップページのみ見出し3（h3）のデザインを変更しています。

「婿養子」や「移住」などのカテゴリ名の部分は、実は見出し3です。

でも、普段の記事の見出し3のデザインは以下になんですよね〜

これはどうやっているかというと、スタイリッシュな見出しにしたいと思って、トップページの見出し3のみCSSでデザインを変えているんです。

この見出しの変更をマネしたい方は、以下のCSSのコピペをしてください。

/* トップページ見出し３　CSS変更 */
.page-id-●●●● .article h3 {
/* 見出し３のスタイル */
background: none;
font-size: 20px;
letter-spacing: 1px;
display: inline-block;
position: relative;
width: 100%;
padding: 0;
text-align: center;
border-left: none;
}
.page-id-●●●● .article h3::before, .page-id-●●●● .article h3::after {
content: '';
position: absolute;
top: 50%;
width: 20%; /*ラインの長さ*/
border-top: 1px solid #444d53; /*ラインの色*/
}
.page-id-●●●● .article h3::before {
left: 10px;
}
.page-id-●●●● .article h3::after {
right: 10px;
}

『●●●●』の部分はトップページ用の固定ページIDを指定する箇所です。

固定ページ一覧から作成した固定フロントページにマウスを合わせると、こんな表示が記事下に表示されます。

例えば僕の場合だと、『post=4860』の4860が固定ページIDです。

「.page-id-●●●●」の部分に4860を入れたら完成です。

はまちゃん

もちろん！
見出し３のデザインは、CSSで他のデザインに変えることもできるよ！
同じようにして、見出し2もトップページ用に変えてみるのもお洒落かもね！

②サイドバーのデザインカスタマイズをする

最後に調整するのはサイドバーです！

実は、固定ページをトップページ化する方法は2種類あります。

サイドバーが無いバージョンのトップページ
サイドバーがあるバージョンのトップページ

どちらのフロントページにするか、好みで選んでみてください。

はまちゃん

僕はサイドバーがあるバージョンにしてるよ！
僕のデザインを参考にするなら②サイドバーがあるバージョンにしよう！

サイドバーを非表示にした1カラムのフロントページにする場合

サイドバーがないトップページなら、サイドバーのデザインカスタマイズは不要。

代わりに固定ページが1カラムで表示されるようにしましょう。

操作は簡単！

固定ページ作成画面の右側にある「ページ設定」で、1カラム（広い）または1カラム（狭い）を選べば、サイドバーがないフロントページにできます。

固定ページ作成画面の右側にある「ページ設定」で、1カラム（広い）または1カラム（狭い）を選べば、サイドバーがないフロントページにできる！

サイドバー無しを希望の方は、以下の章を飛ばして『（５）固定ページをトップページ化』に進んでください。

サイドバーを表示させた2カラムのフロントページにする場合

僕は色々悩んだ結果、サイドバーありのフロントページデザインを選択しました。

サイドバーがあるトップページを作成するなら、一部デザインの調整しましょう。

ただし、何のデザインを調整すべきかは、あなたのフロントページのコンテンツ次第。

例えば、トップページのコンテンツの中に人気記事を表示させているのに、サイドバーにも同じ人気記事を表示させるとしつこい感じがしますよね？

そのように重複した部分は削除すべきでしょう。

反対に、トップページだけ表示させておいて、各記事を読むときにはサイドバーに表示させたくないという内容もあるかもしれません。

あなたのトップページに合うように、自由にカスタマイズしてください。

ここでは、サイドバーの操作方法のみ解説しておきます。

①「ダッシュボード」＞「ウィジェット」をクリック

サイドバーに、必要なコンテンツをセットします。

②「表示設定」をクリックしページの「トップページのみ」をチェック

上の画像の場合、「ウィジェットの表示」が「チェック・入力したページで非表示」となっています。

トップページに表示させたくないが、普通の記事ではサイドバーに表示させたいコンテンツの場合、この設定にしましょう。

反対に、トップページのみ表示させたいコンテンツの場合は、「ウィジェットの表示」を「チェック・入力したページで表示」に変えてください。

③保存をクリックして完了

固定ページをトップページ化してから、最終的に問題ないか確認するようにしてくださいね？

はまちゃん

ここまで頑張りましたね！
トップページになる固定ページが作成できたら、公開ボタンを押して次の章に進みましょう！

憧れのトップページまであともう一息！！

婿太郎

【WordPress「Cocoon」カスタマイズ】（５）固定ページをトップページ化

これで最後です！

あなたの創意工夫を凝らしたあなただけの固定ページを作ったら、トップページ化しましょう。

WordPressの機能を使ったら簡単なので、サクッと説明しますね。

「ダッシュボード」＞「設定」＞「表示設定をクリック」
「フロントページの表示」で固定ページをクリックし、あなたが作成したトップページにしたい固定ページを選択
変更を保存をクリック

はい！

これで無事にCocoonでオリジナルの固定ページを作成して、トップページ化できました！

お疲れ様でした！！

お問い合わせが大変多くなっています。似た質問が多いので、ご質問は全員が見れる記事下のコメント欄へお願いします。

まとめ：WordPress「Cocoon」でかっこいい固定ページを自作してブログのトップページをカスタマイズせよ！

めちゃくちゃ丁寧に、Cocoonでブログトップページを自作した固定ページを表示させる方法を説明してきました。

15,000文字超なので、ここまで読んだあなたも大変だったと思います。

でも、頑張ったおかげで、他のブロガーから一歩リードしたブログトップページが作れたんじゃないでしょうか？

あなたのブログのトップページを見てくれるのは、いわばお得意様です。

せっかく興味を持ってくれた読者のためにも、ぜひトップページの変更に挑戦してみてくださいね♪

【キャンペーン中】Cocoonのトップページを変更したブログのご紹介

ここまで簡単に作れたのは、ひとえにCocoonが素晴らしいWordPressテーマだからです。

僕と一緒にCocoonブロガーを盛り上げて行きたくありませんか？

そこで、こんな企画をすることにします！

「Cocoonのトップページを変更したブログの紹介企画」

応募方法はシンプル！

この記事を参考にCocoonのトップページをカスタマイズ
あなたのブログ内で当ブログの好きな記事のリンクを貼った紹介記事を書く
以下のツイートをRT＋ツイートにコメントをしてトップページの変更を僕に知らせる
僕がこの記事の下にある「みんなのトップページ」にてあなたのブログを紹介

▼コメント用のツイートはこちら

【ブログ更新】

ワードプレステーマ「#Cocoon」を使うブロガーの皆様へ🗣️

固定ページでイカすトップページを作る方法を教えます(^^)

【ブログ＝新着記事順】という常識を崩して、個性を出しましょう！

トップページを変更した方は僕のブログで紹介する企画やってます👇https://t.co/HVp1GrepYf

— はまちゃん@島根移住×(仮)婿養子×地方創生 (@wakuwakukeigo) 2018年9月11日

はまちゃん

当ブログ内のどれかの記事のリンクを貼った紹介記事を、あなたのブログで書いてくださった方のみ紹介していきます。
記事を書かれたらツイッターまでご連絡ください。

この企画は、いずれ終了しますのでお早めに。
ここだけの話、以下に紹介させていただいた先のクリックは、ほぼ毎日あります。

＜ブログを読んでCocoonのトップページを変更した皆様＞

新しく記事にしてくださった順で、紹介していきますね^^

みんなのトップページ

はまちゃんの一言

はまちゃん

この記事は、問い合わせいただいた声に応えて作成した記事です。
せっかく書いたので、たくさんのCocoonブロガー仲間に届いてほしいと思っています。
この記事がよかったら、はてなブックマークとシェアをお願いします！

※カスタマイズに関する問い合わせが多々あります。
質問は、記事下のコメント欄までお願いします。

ただし、偉そうに解説してきましたが、僕はプログラマーでもなくただの一般ピーポー。
HTMLやCSS知識0から、試行錯誤した自作カスタマイズが今回の記事です。
できる限り質問に答えたいと思いますが、細かなCSSなどの質問にはお答えできない可能性もあるので、ご了承ください。

やっぱり、ブログを自分好みにしていくためには、HTMLやCSSの知識が必要ですね。

そう思って、ちょっとずつ勉強を始めています。

デザインの学校これからはじめる HTML &amp; CSSの本 [Windows 10 &amp; macOS対応版]

posted with カエレバ

千貫りこ技術評論社 2017-05-26

WordPressの固定ページに新着記事一覧を表示させる方法【プラグインなし】

んじゃ、今日はこれでおしまいっ！
ほな、バイバーイ！