ワードプレス「ワードプレスで会員サイトを簡単に作っちゃうよ!15分で作る会員サイトデザイン編」で作成した会員サイトはそのまま使用することも可能ですが、せっかくなら見栄えの良いサイトに仕上げたくありませんか?今回使用している無料テーマCOCOONは、簡単にオシャレなデザインを作ることができます。そこで、このデザイン編では会員サイトのカスタマイズについてをご紹介していきます。COCOONについてCOCOONの初期設定は、白主体のシンプルなデザインです。ワンタッチで変更できる「スキン」が用意されているため、簡単にサイト全体の配色変更などを済ませることができます。COCOONの主なカスタマイズについてカスタマイズを行う際は、ワードプレスのメニュー画面にある以下の2項目を使用します。外観では、それぞれのカスタマイズ設定について見ていきましょう。Cocoon設定デザインなどの編集を行う画面は、Cocoon設定がメインとなります。wordpressのメニューに表示されている「Cocoon設定」を選択し、上の画面を表示しましょう。Cocoon設定のページ内に表示されているプレビューは、リアルタイム反映型ではありません。「変更をまとめて保存」を押すことでサイトに反映され、プレビューにも表示されます。各スキン名の左に表示されているimageアイコンにカーソルを合わせると、イメージ画像が表示されますので、サイトの雰囲気にあうスキンを選択しましょう。今回は上記のスキンのみを変更しています。タイトルの見せ方や記事内のカスタマイズなどを行いたい場合は、「スキン」以外のタブも設定を行うと、よりこだわり感のある仕上がりになります。外観:カスタマイズワードプレスのメニュー「外観」の中にある「カスタマイズ」を開きましょう。表示されたページには、「サイト基本情報」などの計6種類のメニューがあります。今回は、ナビゲーションメニューの追加について説明していきます。メニューメニューでは、ナビゲーションメニューなどの作成が行えます。今回の場合は、「プロフィール」などが表示されているタイトル下のメニューです。メニューを作る管理メニューの「外観」にある「メニュー」を開きましょう。メニュー名を設定するグローバルナビやヘッダーメニューなどのわかりやすい名前を設定しましょう。生成された固定ページを選択し、メニューに追加するサイトを新設した直後であれば、サンプルページと新規登録以外の全ての固定ページを選択しましょう。各メニューをカスタマイズするナビゲーションラベルを変更すると、表示させる名前を変更することができます。「元の名前」に表示されているページにリンクが貼った状態となるので、好きな名前に変更しましょう。ちなみにですが、今回は以下のように変更しています。Usersメニューを階層化してまとめるついでにメニューの位置を次の画像のように階層化すると、スッキリと表示させることができます。メニューの表示位置を指定するCOCOONはPCとスマホでメニュー表示が変わるため、「ヘッダーメニュー」と「ヘッダーモバイルメニュー」にチェックを入れましょう。ここまでの設定が終わったら、「メニューを保存」しましょう。工程6の作業で、サイトにナビゲーションメニューが表示されるようになります。デザイン編のまとめ今回ご紹介している会員サイトは、スキンを使えば簡単にサイトイメージを変えられるテンプレートです。追加CSSを指定することなく表示を変更できるので、好みに合ったデザインに仕上げましょう。新しい投稿ワードプレスを超簡単に丸ごと移行できるプラグイン!サーバー移...関連記事ワードプレスワードプレスでショップ公式サイト風なHPを作る手順を解説!お客様に情報を提供できる公式サイトを作りたい...。[...]wpuser20192018年11月16日この投稿へのコメントコメントはありません。コメントをキャンセルメールアドレスが公開されることはありません。コメントデータの処理方法の詳細はこちらをご覧ください。メルマガ登録せどりマニュアルプライバシーポリシーお問い合せ。