ブログを始めたばかりの方は、Cocoonテーマを利用している方が多いと思います。
Cocoonテーマでも設定すればサイトの外観がよくなります。

この記事では何が分かるの?
- スキンの設定
- 記事を二つに分割して表示させる方法と注意点
- ヘッダーロゴの設定について
スキンの設定
まずはwordpressの管理画面を開いて

Cocoon設定をクリックしてください。
そうすると

Cocoonの設定画面が出てきます。
そして、スキン設定から自分の好きなスキンを選んでください。
ちなみにこのサイトのスキンはVeilnui Simplog(blue)を使っています。
記事を2分割にして表示させる方法の時に詳しく触れますが、スキンによっては2分割にできないものがあるので注意してください!
記事を二つに分割して表示させる方法と注意点

記事を2分割にするってどういうこと?
トップページの記事の表示を2分割にするとスマートフォンでは次のように表示されます。

このように分割して表示させたい場合は先ほどのCocoon設定のインデックスをクリックしてください。
下にスクロールしていくとカードタイプの設定があります。

縦側カード2列に設定して、変更をまとめて保存で完了です。
この時の注意点は、スキンによってカードタイプの変更が制御されていることがあることです。
カードタイプの変更が制御されているスキンではトップページの記事の表示を2分割することができないので、スキンを変更してもう一度試してみてください。
このサイトのスキンVeilnui Simplog(blue)では2分割表示が可能なので迷ったらVeilnui Simplogのシリーズにしてみましょう。
ヘッダーロゴの設定について
最後にヘッダーロゴの設定です。
Cocoon設定のヘッダーをクリックしてください。

下にスクロールするとこのような画面が表示されます。
ヘッダーロゴは画像(png)で登録するのがおすすめです。
ヘッダーロゴの作成はロゴメーカーというサイトで簡単に作成できます。
商用利用も可能です!

↑のリンクから飛べます。
では、ヘッダーロゴを作っていきましょう!!

まずは、ここのショップ名の所にヘッダーに表示したい自分のブログの名前などを入力してください。
すると

こんな画面がでてきてロゴを作ることができます。
出来上がったら、完成させるボタンを押して小さいサイズ、png(透過)で保存しましょう。
保存が完了したら、先ほどのCocoonヘッダー設定画面に戻ってヘッダーロゴの選択をクリックしてください。

先ほど保存した画像をアップロードして変更をまとめて保存で完了です。
簡単なCocoonのトップページの設定は以上です。
お疲れ様でした!!
【あわせて読みたい記事】
コメント