ブログ運営

【cocoon】トップページに指定する固定ページの作成方法/トップページをサイト型へカスタマイズ

ブログ運営
スポンサーリンク

この記事では、ブログのトップページをサイト型にカスタマイズするために必要な”固定ページの作成方法”について紹介しています。

WordPressの無料テーマcocoonを使ってブログを運営している方におすすめの記事です。

初心者でもおしゃれなトップページを作ることができるようわかりやすく説明しています。

おむ子
おむ子

このブログは、30代夫婦が

投資やお金に関する情報について発信しています。

ブログの収益で大好きなハワイに行くのが第一目標です!

スポンサーリンク

固定ページの新規作成方法

新規固定ページを作成

WordPressのダッシュボードのなかから、固定ページを選択し、「新規追加」を選びます。

ブログの投稿画面と同じような固定ページの作成画面が立ち上がります。

タイトルや固定ページの設定を行う

ブログを投稿する際と同じように、タイトルや固定ページに関する情報を設定します。

設定のポイント
タイトルサイトトップなどわかりやすいタイトル名を指定
(CSSでタイトルは非表示にします)
URL好きなURLを指定
(作成する固定ページをトップページに指定する手順を踏むと、
自動的にURLはサイトメインのURLに変わります。)
広告レイアウトが乱れるため広告は除外がおすすめ
更新日削除
目次非表示
読む時間非表示
固定ページのタイトルや投稿日を非表示にするCSSについて

ページの幅を決める

固定ページの設定項目から、「ページタイプ」を選択します。

サイドバーを表示したければ、デフォルトを選択し、全画面でサイトトップページ表示させたければ1カラム(広い)を選択します。

デフォルトを選択ーサイドバーが表示されるデザイン
1カラム(広い)を選択ー全画面でページが表示されるデザイン

固定ページを編集しサイトのトップページを作成する

記事を投稿する際と同じように、画像や文字を入力し、サイトトップページを作り上げていきます。

ポイント①
カラムを活用する

カラムのブロックを活用すると、サイトトップページを半分に区切り片側に記事、片側に検索やSNSボタンを設置したようなレイアウトを作成することが可能です。

ポイント③
SNSボタンや検索バーを設置しサイト風に整備する

「サイト内検索」や「SNS」のブロックを追加し、サイト風にレイアウトを組み立てます。

ポイント④
ボタン機能を活用しメニューボタンや記事一覧のリンクを作成する

カテゴリーの各テーマボタンや「新着記事一覧を表示」ボタンは、ボタンブロックを活用して作成しています。

例えば、投資信託というボタンであれば、リンク先に、投資信託のカテゴリーURLを登録し、ボタンを押すとリンク先へ飛ぶように設定しています。

プレビュー画面でレイアウトを確認する

配置やスペースなどを微調整してレイアウトを整えていきます。

モバイル端末からの見え方も確認しておきましょう。

PCとモバイル端末でのレイアウト表示を変える場合は、CSSを指定する必要があります。

モバイルからの見え方

まとめ

ブロックの種類や使い方さえ理解できていれば、トップページのサイト型へのカスタマイズは、意外と簡単です。

画像や見出し、白抜きボックスなどさまざまなブロックがあるので、それらを駆使し、サイト型レイアウトに近づけていきます。

固定ページの作成が完了すれば、サイト型トップページへのカスタマイズ作業は残りあと少しです。

ここから先の手順は別記事にまとめておりますので、合わせてご覧ください。

最後までご覧いただきありがとうございました。

スポンサーリンク
投資オムタンケ
タイトルとURLをコピーしました