WordPressテーマの設定 ~高機能で初心者にも使いやすい無料テーマCocoonのインストール~

Cocoon

WordPressのテーマとは

かつてHPをつくるときは、デザインやレイアウトを設定するのにスタイルシートを駆使していかなければいけませんでした。
そのため、プログラミングの知識も必要でした。
しかし、WordPressにあるテーマを選択すると高度なプログラミングの知識も必要なく、素人でも簡単に綺麗なデザインのサイトが構築できます。
また、デザインのレイアウトだけでなく、テーマによっては、「SEO対応」、「高速化設定」、「アフェリエイト」、「キャッシュ機能」を有しているものもあり、不要なプラグインをインストールする必要もなくなります。
テーマによっては、SEO評価で検索順位も影響してくるので、ただレイアウトデザイン、機能だけでなく、多面的に考慮しながら導入していくといいでしょう。

テーマは、着せ替え人形のように、簡単に切り替えられることができますので、あとで変更も可能です。
しかし、切り替えたことによってアクセス数が急変することもあるため、サイトアクセスが少ない段階のうちに色々試してみるといいでしょう。

テーマの設定方法

WordPress左メニューの
「外観」⇒「テーマ」
を選択します。
すると、すでに利用できる公式テーマが3つほど準備されています。

各テーマの上にマウスカーソルと置くと現れる、「有効化」ボタンをクリックするとそのテーマが利用できます。

テーマの種類

最初に準備されている公式テーマは数が3つほどで少なく、物足りないと感じる人も多いでしょう。
しかし、公式テーマ以外にも、非公式で有料テーマと無料のテーマといったものが多数存在し、ダウンロードできるようになります。

公式テーマ

公式テーマは、テーマの上部にある「新規追加」をクリックすると他のデザインが簡単にダウンロードできます。
しかし、提供されているもののほとんどは海外のテーマがほとんどで、クールなデザインのものが多いですが、説明をしている日本語サイトがほとんどないため扱いにくい面があります。

公式サイト以外のテーマ

公式サイト以外には、有料テーマでSEO対策を考慮したデザイン、サポートが整っているものがありますが、無料テーマでも十分有料に劣らないものもあります。
利用するには、テーマを提供しているサイトからファイルをダウンロードする必要があります。

初心者向けWordPress無料テーマ35選/日本語対応 | TechAcademyマガジン
WordPress(ワードプレス)初心者におすすめする【無料テーマ(テンプレート)】を紹介する記事です。全て日本語に対応。SEOに強いテーマや、テーマのカスタマイズに最適なテーマなど全部で35紹介しています。

無料テーマ「Cocoon」の設定

Cocoonとは

無料テーマでも、好評でよく利用されているテーマの一つが「Cocoon」です。
元はSimplicityというテーマのものが改良されて。使いやすさ、デザイン性もUPしたものです。
スキン設定でデザインが簡単に設定できるだけでなく、SEO対策、豊富な機能、サポートも行き届いているため初心者でも使いやすいのでお勧めです。
「Cocoon」を例にテーマのダウンロード方法について説明していきます。

cocoonのダウンロード

下記サイトから、Cocoonのダウンロードをしてください。

テーマのダウンロード
Wordpressテーマ「Cocoon」の親テーマと子テーマのダウンロードページです。

・『親テーマ』『子テーマ』の2つのダウンロードをしましょう。
(zipファイルでダウンロードされます。)

Cocoonのインストール

Cocoonサイトからダウンロードした2つのテーマをデスクトップに保存し、アップロードしていきます。

左サイドメニュー
「外観⇒」「テーマ」を選択。
上部にある、「新規追加ボタン」をクリックします。

「テーマのアップロード」をクリック

「ファイルを選択」ボタンをクリックし、保存したファイルを選択、「今すぐインストール」を押します。
(親テーマと子テーマそれぞれ行います。)
アップロードは、zipファイルのままで結構です。

テーマを選択します。
このとき、必ずchild側のテーマを有効にしてください。

インストール手順の詳細は下記ページを参考にしましょう。

Cocoonテーマをインストールする方法
WordPressにCocoon親テーマと子テーマをインストールして利用するおすすめのインストール方法です。

Cocoonの設定画面

Cocoonをテーマにすると、画面左に「cocoon設定」が表示され、設定はここで行います。
設定画面の上部に設定項目のタブがあるので、ここを選択することで、レイアウトなどを調整していきます。

サイトの確認

Cocoonをインストールした後のレイアウトを確認してみましょう。
左上部にあるタイトルにカーソルを移動させると現れるサイトを表示」をクリックすると、サイトを確認することができます。

まだ、何も設定できていない状態だと、レイアウト枠だけのサイトになっています。
これから、スキン、トップ画像、メニュー、カラーなど設定して綺麗なサイトに仕上げていきます。
同じく、画面左上のタイトルにカーソルを移動すると現れる、ダッシュボード」をクリックするとダッシュボード画面に戻ります。

スキン設定

スキン(ユーザインタフェースの外観表示)を利用すると、簡単に綺麗なレイアウトが設定できます。
「Cocoon設定」⇒「スキン」タブで、スキンを利用できます。
スキンタブにはいくつか種類があるので、試して好みのものを選択しましょう。
カーソルを、スキン名の左にあるアイコンにマウスカーソルをおくと、サンプルのレイアウトプレビューが確認できます。

スキンの設定は、ラジオボタンにチェックを入れ、「変更をまとめて保存」をクリックすると反映されます。
「カラフルライン」を設定しました。
次に、画像を配置していき、ホームページらしくしていきます。

タイトルとURLをコピーしました