MENU
いろはくま
HSS型HSPとして「生きづらさ」に悩み、30代手前で起業を決意。Webデザイン職業訓練校に通い、Web業界へ。現在はWebデザイナーとして会社員とフリーランスを両立しています。このブログでは、未経験からのWebデザイナーになるための方法と起業・フリーランスの方へ私の体験談をもとに、役立つ情報を発信しています。
\ Webデザイナーになるロードマップ公開中 /

Cocoonテーマ|FTPを使ってスキンを追加する方法

Cocoonテーマは、ブログ運用にも最適なWordPress人気テーマです。

スキンを追加することで、サイトのデザインを簡単に変えることができます。

新しく追加されたスキンがテーマに入っていない場合やスキン制御を解除してカスタマイズする際に、FTPソフトを活用します。

この記事では、FTPを使ってCocoonテーマのスキンを追加する方法を解説していきます。

目次

Cocoonテーマのスキンとは?

Cocoonテーマは、WordPressの無料テーマで、サイト表示速度も優れており、多くのカスタマイズオプションを提供しているので、ブログ運用している方は一度は使ったことがあるテーマではないでしょうか。

操作性も良く、カスタマイズも簡単なのでたくさんのブロガーさんやサイト運用者に利用されているテーマです!

その人気のCocoonテーマにある「スキン」とは、サイトの外観を変更するためのスタイルセットになります。

以下のように、たくさんの種類のスキンが用意されています。


スキンを変更することで、ブログやウェブサイトのデザインを1クリックで簡単に切り替えられます。

スキンはまったく同じ構成で作られていないため、スキン変更により表示されないコンテンツやレイアウト崩れが起こることがあります。

サイトを作り込みする場合にはテスト環境を作ってから本番に反映させましょう!

Cocoonテーマのスキンとは?4つの特徴

ここでは、Cocoonテーマ「スキン」の4つの特徴をご紹介します。

1.事前設定されたデザイン

Cocoonテーマのスキンは、特定のデザインや配色のセットで提供されているので、切り替えたらすぐに使える状態になっています。

「HTMLやCSSなどよくわからない!」という初心者さんにおすすめです。

2.カスタマイズの手間を省く

スキンを変更することで、デザインのカスタマイズ作業を最小限に抑えることができます。

すでに作者さんによって、モバイル用(レスポンシブ)表示に対応しています。

綺麗な余白を保ち、適切な文字サイズになっており、ゼロからコーディングや設定をする必要がないため、効率よくカスタマイズできます。

3.好みに合わせて選べるスキン

Cocoonテーマには複数のスキン(シンプル、クール、可愛い、ブルー系、ピンク系などなど・・)が用意されており、用途や好みに合わせて選ぶことができます。

たくさんの種類から選べるのは嬉しい!

4.簡単なデザイン変更

「サイト着せ替え」感覚で、ワンポチで反映できる!

Cocoonテーマを選択した状態で、ワードプレスの管理画面Cocoon設定メニューの「スキン」を選択して、「まとめて保存」を押すだけで、簡単にサイトのデザインを変更することができます。

FTPを使ってスキンを追加する方法

ここでは、FTPを使ってCocoonのスキンを追加する手順を説明していきます。

STEP
FTPクライアントの準備

FileZillaFFFTPなどのFTPクライアントソフトウェアをインストールします。

どちらも無料で使用でき、公式サイトからダウンロードできます。

FileZillaダウンロード
FFFTP(Windowsのみ提供)

FTPって?

FTPクライアントソフトは、パソコンとサーバー間でファイルをやり取りするツールで、ホームページの公開やデータ転送に使われます。

FileZilla(FTPソフト)のインストール方法や初期設定がわからない方はこちらの記事も参考にどうぞ。

STEP
Cocoonテーマのスキンをダウンロード

スキンを配布しているサイトから、ご希望のスキンをダウンロードします。

ダウンロードファイルは.zip形式で提供されるため、ダウンロード後にファイルを解凍しておきます。


STEP
サーバーに接続

FTPクライアントを起動し、サーバーのホスト名、ユーザー名、パスワードを入力してサーバーに接続します。

本記事ではFTPソフトは「FFFTP」を使用してますが、「FileZilla」でも使い方は一緒です。

STEP
スキンファイルのアップロード

サーバーに接続後、WordPressのインストールディレクトリに移動します。

wp-content/themes/cocoon-master/skinsフォルダーを開きます。

ここに、解凍しておいた新規スキンファイルをアップロードします。

STEP
スキンの適用

WordPressの管理画面にログインし、Cocoon設定メニューの「スキン」タブを選択して、アップロードしたスキンにチェックを入れます。

「変更をまとめて保存」を押すと、スキンが有効になります。

まとめ

いかがでしたでしょうか?

FFFTPと同様、FileZillaなどのFTPソフトを使ってCocoonテーマにスキンを追加する手順は基本的に同じです。

FTPクライアントを使用してサーバーに接続し、指定のフォルダーにスキンファイルをアップロードすることで、簡単にサイトのデザインを変更できます!

Cocoonテーマで女性に個人的におすすめのスキンは「grayish」です。

シンプルで余白も大きくとっていおり、見やすいので大変気に入ってます。

特にブログサイトなどで使いやすい有料テーマ(SWELLまたはJIN、SnowMonkeyがオススメ!)もありますが、無料では十分な機能が揃っているCocoonテーマをカスタマイズして、テーマやワードプレス環境にまずは慣れていきましょう!

サブスク型テーマには手が届かず、本サイトのテーマは買い切り型¥17,600(税込)SWELLテーマを使用しています。

自分のサイトにぴったりのスキンを導入して、楽しみながら見た目をリフレッシュしてみてくださいね。

それでは、またお会いしましょう!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次