WordPressのテーマとブログのロゴ作成!

第 5 回のテーマは「 WordPress のテーマの導入とブログのロゴ作成」です。

これからブログをデザインし構築して、記事を書いていくにあたって、強い味方となってくれるのがこの「テーマ」と呼ばれるものです。

それと同時に、ブログのロゴデザインを決めて、自分だけのロゴマークを作っておくのも良いと思います。

WordPress のテーマについて

WordPress のテーマとは、サイトのデザインや全体の構成や骨組み、表示される機能などを反映させるものが一式セットになっているものです。

サイト全体のテンプレートあらかじめ決められた形式や様式)とも言われます。

テーマを変更すると複雑な作業を行うことなく、サイトのデザインや構成、機能などを変えることができるのです。いわゆる「サイトの着せ替え」ができます。

テーマの役割としては、サイトのページをどのように見せるかだけでなく、SEO 対策検索結果で上位表示を得るための対策)も重要な役割です。

有料テーマがおすすめ

テーマには無料と有料があるのですが、有料テーマを強くおすすめします

有料テーマは一般的に、

  • デザイン性やカスタマイズの自由度が高い
  • 快適で簡便な操作性で、大幅な時短が可能
  • カスタマイズしなくても使えるものが多い
  • 記事の文字装飾機能が豊富である
  • 安全性も高い
  • SEO 対策も考えられている
  • 初心者向け(余計な苦労やリスクを回避できる)

無料テーマは一般的に、

  • デザインが簡素で、最低限の機能だけ
  • カスタマイズが難しい( HTML や PHP の知識が必要
  • 記事作成以外に時間や労力がかかる
  • サポートが無い

以上のようなことが言われています。(もちろん有料テーマでも良くないものや、無料テーマでも良いものはあると思います)

Diver に決めました

WordPress 有料テーマ「 Diver 」公式サイト

  • SEO に強い
  • そのままでもデザインが綺麗
  • サポートが無期限で無制限(満足度 100%を目指している)
  • アップデートの頻度が高く、永久無料(進化し続けてくれる)
  • 書くことだけに専念できる(カスタマイズや設定が簡単)
  • 入力補助機能が充実していて、使い方も簡単
  • 使用できるサイト数が無制限
  • 評判が非常に良い

以上のような理由から「 Diver 」に決めました。

価格は 17980 円と他の有料テーマと比べても高い方なのですが、「書くことだけに専念できる」「アップデートの永久無料」「サポートが無期限で無制限」に強く惹かれました。

自分は一度テーマを決めたら、できるだけ長く、そのテーマを使っていきたいと考えていました。

なので、新しいテーマを作っていくのではなく、1 つのテーマだけを大事に育て、進化させていくという「 Diver 」の姿勢は非常に共感を覚え、決め手となりました。

それにどれだけ値段が高いと言っても、月額制ではなく、買い切りなので負担は小さいと思います

テーマは変更すると、あらゆるものが変わってしまい、慣れるまでに時間がかかると思うので、妥協せずに自分が本当に納得できるものを選ぶべきだと思います

Diver の導入

公式サイトから購入ページに飛ぶと、「インフォトップ」というサイトに入るので、そこで会員登録してから購入することになります。

ダウンロード販売なのですが、ダウンロードできる期限が設定されているので、購入したらすぐにしておきましょう

Diver のインストール

ダウンロードしたファイルfile_70619.zip )を開き(解凍して)、「 Diver_setというファイルを開きます

すると、本体(親テーマ)であるdiver.zip 」と子テーマdiver-child.zip 」と利用ガイド「 diver-init.pdf 」の 3 つファイルがあります。

この中で、WordPress にインストールするのは、親テーマ「 diver.zip 」と子テーマ「 diver-child.zip 」です。

WordPressメニュー「外観」→「テーマ」で「新規追加」から「テーマのアップロード」を押し「ファイルを選択」で親テーマ子テーマを選びアップロード(インストール)します

メニュー「外観」→「テーマ」に「 diver 」と「 diver_child 」の 2 つが表示されているので、子テーマの「 diver_childだけを有効化」します。

なぜ子テーマだけ?
WordPressのテーマはカスタマイズ(使いやすく自分好みにするための様々な設定)をして使っていきます
親テーマを有効化してカスタマイズすると、テーマのアップデートをした時に、今までの設定内容が上書きされて消えてしまいます
これを防ぐのが子テーマの存在です。
子テーマカスタマイズや設定を保存するテーマなので、これだけを有効化しておけば、アップデートで親テーマを新しくしても、カスタマイズ内容は子テーマに保存されているので安心、となるわけです。

ブログのロゴを作ろう

ブログデザインにオリジナリティを出すために、ロゴを付けるのがオススメです

簡単にプロ品質のロゴを、安く作れるサイトを見つけたので紹介します。

ここはロゴの他にファビコン(ブラウザでそのサイトのシンボルマークとして使われるアイコン)、名刺封筒レターヘッド便箋に印刷するマーク)にも使えます。

LOGASTERでロゴ作成

LOGASTER公式サイト

  • 名称を入れるだけで自動作成してくれる
  • 完成形を確認しながら選ぶことができる
  • 種類が本当に豊富で幅広い
  • 日本語のロゴが作れる
  • スマホからでも作れる
  • 価格が安い

一度公式サイトに行って、メニュー「インスピレーション」や「ギャラリー」で是非サンプルを見て頂きたいのですが、非常にクオリティが高いと思います。

そのサンプルページの一番下にカテゴリーがあるので、そこからカテゴリー別のサンプルも見られます。ここで自分のイメージを決めておくと良いかも知れません。

公式サイトに行き「無料でお試し」か「ロゴを作成」を押します。

ロゴ作成ウィザードの会社名」にロゴにしたい言葉を入れ、ロゴに付け加えたい文言があればスローガンの追加」で入力します。

例えば自分の場合なら、会社名に学習日記」、スローガンに〜ゼンの私的な備忘録〜」と入力しました。

ビジネスタイプ」は何か選んでおくと、ジャンルを絞り込んでくれます。「次へ」を押すとロゴデザイン候補が表示されます

デザインを決めたら、その画像を押しロゴデザインの編集」を押すと、デザインの編集作業ができます

縦長、横長やバランスの変更画像のロゴマークを押すとエンブレムの変更と色や大きさが変えられ、文字を押すとテキストの色とフォントと大きさが変更できます

ちなみに、WordPressのテーマがDiverの場合、サイトロゴ(ブログ名のロゴ)の推奨サイズが横 250×縦 60 なので「横長のデザイン」にしましょう。

縦長のデザインだと非常に小さく表示されてしまいますので、注意です

ロゴデザインを決定したら「次へ」を押します。色・背景違いのイメージが表示されていますが、後で自由に変えられます。「保存」を押します。

アカウントを作るため「メールアドレスとパスワード」を入力します。購入はロゴファイルをダウンロード」からできます。(サイズによって値段が違います

ブログだけにしか使わないなら、

  • 1024 ピクセルスクリーン用( png, jpeg ) 9.99 ドル
  • ファビコン( ico, png ) 9.99 ドル

印刷物に使うなら、

  • プリントおよびスクリーン用( svg, pdf, png, jpeg ) 24.99 ドル

svg 」と「 pdfが印刷向きとなっているのですが、ファビコンも買うなら「ブランドセット」の方がお得になります。

ブランドセット 29.99 ドル」なら全部入りなので、名刺も封筒もレターヘッドもファビコンもロゴもすべて使えます。自分はブランドセットにしました。

ブログのロゴとファビコンの設定

まずはサイトタイトル(ブログ名)を設定しておきましょう

WordPressメニュー「設定」→「一般」の「サイトのタイトルにブログ名を、「キャッチフレーズにブログの簡単な説明を書き「変更を保存」。

メニュー「外観」→「カスタマイズ」→「サイトロゴ・アイコン」の「ロゴ画像をアップロード」に LOGASTER でダウンロードした、横長のロゴ画像を選びます。

大きさは「 Small_size_247×67_pixelsというファイルがあるので、その中の画像をアップロードしました。

同様に「ファビコン」は、LOGASTER でダウンロードしたファビコンのファイルに32×32 」のサイズがあるので、その画像をアップロードします。

アップルタッチアイコンスマホやタブレット用のアイコン)も設定しておきましょう。アップルタッチアイコンの推奨サイズ144×144 」はファビコンファイルの中です

Diver のカスタマイズについて

あとは自分好みにブログをデザイン(レイアウトや表示させる項目や表示のさせ方など)していけばいいです。

細かいカスタマイズは、 Diver 公式デモサイトを参考にしました。Diver を使う上での様々な設定方法が書いてあります。

情報量が多いので、自分が必要なところだけをチェックしていくのが良いと思います。

それでも分からない事があったら、インターネットで「 diver 〇〇」や「 wordpress 〇〇」と、〇〇に知りたい事、分からない事を入れて検索すると良いです

インターネットには細かく詳しく解説してくれているサイトがあるので、大変ありがたいです。自分もたくさんのサイトに助けられました。

それにインターネットで色々なサイトを見てデザインを参考にするのは非常に有益な事だと思います。

1 つポイントとしては、スマホでちゃんと見やすいかどうかは、確認した方が良いです。今の時代スマホで見る人が圧倒的に多いので。

もちろん Diver はレスポンシブPC やスマホやタブレットなどの端末に合わせて調節し表示する)なのですが、実際の見やすさの確認は大事です。

テーマとロゴマークの仕訳

WordPress のテーマ代は消耗品費」に当たり、ロゴマーク代は広告宣伝費」に当たります。

マネーフォワード クラウド確定申告」にログインし、クレジットカードで支払った分が「未仕訳」になっているのでクリックします。

テーマ代の借方に消耗品費」貸方に「未払金」とし、概要に「 wordpress のテーマ Diver 」と入っています。

ロゴマーク代の借方に広告宣伝費」貸方に「未払金」で、概要に「 LOGASTER ホームページなどのロゴ」と入れています。

あとがき

今回の作業によって「ブログの顔」や「自分の家のデザイン」というものが出来上がりました。

いわゆる第一印象になるものですね、これによって訪問者が様々なイメージを抱くと思います。納得のいく好みのデザインは作れたでしょうか。

自分はデザインセンスもなく、苦手だったので非常に簡素でシンプルなデザインなのですが、センスの良い人なら綺麗なサイトが作れると思います

その要望に「 Diver 」はしっかりと答えてくれるはずです。「 LOGASTER 」も簡単でありながら、本当に種類が豊富なので、きっと素敵なロゴができると思います。

最後までお読み頂きまして、誠にありがとうございました。