Word PressのCocoonテーマを使用してブログ継続歴1年くらい
記事数85~100記事ほど
サイトの形をブログ型からサイト型に変えたい！
カスタマイズしたい理由
- カッコイイ見た目にしたい！
- ブログ型は投稿記事順に表示されるので古い記事が埋もれてしまう！
- ブログを覗きに来てくれた方に少しでも他の記事も見てもらいたい！
固定ページを使ってサイト型にカスタマイズ
それでは、固定ページので新しいトップページをつくります。
2カラム表示にする
カラム数は２カラムか３カラムを選べます。
今回は2カラムでcocconトップページをカスタマイズします。
今回紹介するやり方はグーテンベルグエディターを使ったカラム分けです。
①赤線のタグ部分をクリックすると写真の様に、好みの比率のカラムを選択可能
一番上の1：1の比率の2カラムを選択
左側①のカラムに”新着記事”を表示
- 新着記事と入力
- 背景の画像・アイコンも挿入可能
- HTML挿入↓のコピペしてプレビューで確認
ちなみに⇗のコードでいじくったところは、count=”4″
表示させる記事数のことで4記事に設定しました。
右側②のカラムに”人気記事”を表示
- 人気記事と入力
- 背景の画像・アイコンの追加も可能
- HTML挿入↓のコピペしてプレビューで確認
プレビューで確認するとちゃんと2カラムに分かれています。
2カラム表示（他）
次に、2カラムを2段構成にして行きます
表示させたいカテゴリーのURLに表示されている
category&tag_ID=●●＆
●●の数字部分を書き換えて【HTML挿入】すればok！
張り付けるコードは新着記事で使ったコードと同じです。
- ①新着記事
- ②人気記事
- ③食材の知識
- ④チャレンジ話
これで4カラムを表示するトップページが完成
固定ページの「タイトル」を消す
固定ページからトップページを作成する際のタイトル
『cocconトップページ』の文字が邪魔になるので消します。
.entry-title{
display: none;
}
を「カスタムCSS」の最後にコピペして更新すると
『cocconトップページ』のタイトルを消すことが出来ます。
目次と広告を外す
word press右側のウィジェットの欄
- 『広告』から「広告を除外する」にチェックを入れる
- 『ページ設定』から「目次を表示しない」にチェックを入れる
これらの設定をした後に「公開」をクリックします。
最終設定
いよいよ！固定ページをトップページに表示させます。
『設定』→『表示設定』
『ホームページの表示』に『固定ページ』を選択します
『ホームページ』のドロップボックスに作成した
cocconトップページを選択！
最後にサイトのプレビューを確認して完成！
お疲れ様でした！
コメント