WordPressサイト作成時に必要な専門用語を解説
キャラ右

ワードプレスはホームページを作るために必要な専門知識やスキルを大幅に減らしてくれる世界でもっとも人気の無料CMS(コンテンツ・マネジメント・システム)です。

WordPressには特有の「専門用語」があり、覚えておくと、やはり便利な専門スキルというものはあります。ここでは、WordPressサイトを作るとき、また、更新を続けていく上で、身に付けて行くとワンランク上のホームページを運営できるようになるスキルについて解説します

記事の概要


WordPressは、phpというデータファイルで管理されています。基本的にホームページはHTMLという言語で記述され、デザインはCSSという言語で制御します。この他、ホームページ状で動作するシステムなどはJavaScriptなどで管理されていますが、WordPressは、これら「ホームページ作りに必要な専門スキル」を極限まで減らし、誰でも簡単にホームページを作れるように設計された「コンテンツ・マネジメント・システム」通称「CMS」です。

本記事で解説している「ワードプレスの仕組み」や「ホームページの仕組み」を通じて、WordPressサイトの作成を難しく考えることなく「よりスムーズにホームページ作りを進めるには」と言った視点に立っていただくための情報を掲載しています。

WordPressとは

WordPressには、「WordPress.org」というCMSとしてのWordPressに関する情報を提供するサイトと「WordPress.com」というSNS的な要素を持つ無料ブログサービス的なサイトの2つがあります。

また、他の記事で紹介しますがプラグインの「Jetpack」も、この「WordPress.com」で管理できます。

CMSとしてのWordPressは、レンタルサーバーに設置したMySQLという「データベース」と連携しホームページを象っていくのですが、WordPressサイトの「デザイン」や「演出」は「Theme(テーマ)」と呼ばれるプログラムファイルによって構築されています。

また「プラグイン」は、WordPressサイトの「拡張機能」を担当するシステムファイル全般を指し、このように呼ばれています。

キャラ右

システムとしての「WordPress」はThemeファイルやプラグイン・ファイルなど600個くらいのファイルから出来ていて、その「総称」が「WordPress」と呼ばれていると、解釈してもいいのじゃないかなぁ

WordPressの仕組み

WordPressは、600を超える(1,000ファイルくらいあるかも…)PHPファイルとジャバスクリプトのような「プログラム」を司るファイルなどでできています。しかし、そのほとんどは、ホームページを作る際にも更新を続けていく中でも、編集する必要はありません。

WordPressでは「テンプレート」のことを「Theme(テーマ)」と呼ぶ

かなりザックリとした表現ですが、WordPressサイトは、「Theme(テーマ)」と呼ばれるテンプレートと、WordPressの機能を拡張するための「プラグイン」を使って作っていきます。

Themeには無料のものと有料のものがあり、プラグインにも無料のものと有料のものがあります。国産のWordPressThemeもあれば、海外版のThemeやプラグインがあります。

これまで私は3,000種類ほどのThemeとプラグインを試してきましたが、Themeとプラグインの相性はもとより、レンタルサーバーとの相性もあります

組み合わせを間違えてしまうと、ホームページが真っ白になったり、管理画面が真っ白になって、何もできなくなるなんてことも体験してきました。

こんな時にはFTPソフトなどを使って、直接サーバーの中に入って、原因となっているThemeやプラグインを削除すれば復旧できます。

キャラ右

この記事は、専門用語がたくさん出てきますが「なんとなく押さえておく」程度でも、問題ないですよ!

メモ1


「テーマ」と「Theme」の記述に関して
このサイトではホームページや記事の「主題」や「内容」を表す「テーマ」に関してはカタカナ表記で「テーマ」と記述し、WordPressのテンプレート的な存在である「Theme」に関しては英字表記を用います。

メモ2


FTPソフトとは

FTPとは「File Transfer Protocol」の略で、あなたのパソコンとレンタルサーバーを直接繋ぐ仕組みです。

無償のFTPソフトには代表的なものとして、私も使っている「FileZilla」がありますが、レンタルサーバーにも「ファイルマネージャ」という機能(レンタルサーバーによっては呼称が異なる場合があります)を使ってファイルのやりとりを行います。

ホームページの仕組み

WordPressはPHPファイルとプログラムコードが記述されている「.js」などのファイルで構成されています。しかし、実際に閲覧されるウェブコンテンツ(ホームページ)は、HTMLとCSSで構成されています。

WordPressなどのCMSを使わない場合は、1ページ1ページこの「HTML」を記述してウェブコンテンツを作っていきます。

WordPress(CMS)は、その手間を省くための便利なシステムなんだという認識でも問題はありません。

HTMLとは

HTMLとは「HyperText Markup Language」の頭文字を取ったもので、ウェブコンテンツの「構造(見出しや箇条書きなど)」と検索エンジンがウェブコンテンツの概要を把握し解析するための「情報」やウェブブラウザ(インターネットエクスプローラやグーグルクローム、サファリなど)がウェブコンテンツに含まれる各要素の意味を理解するための情報が書き込まれているものです。

WordPressでホームページを作る際には、直接HTMLを記述したり編集することは、ほとんどありませんが、テキストエディタを使ってページを作る際には、文章以外に画像を挿入した場合などにHTMLが表示されます。

画像の挿入やリスト(箇条書き)など、文章以外の要素を組み込む場合に、HTMLタグと呼ばれる<img>(画像)や<ul>(箇条書き)<ol>(数字付リスト)などをクリック作業だけで可能にしたのが、このCMSです。

PHPとは、それらの命令を司っているファイルだと覚えておいてください。

CSSとは

CSSとは「Cascading Style Sheets」の頭文字を取ったもので、HTMLが「構造」と「情報」を担当しているのに対しCSSは、その構造や情報を「どのように表示するか」などの「装飾」(「スタイル」と言う)を担当しています。

例えば、文字の色や背景色。画像の配置やパソコンで閲覧された場合とスマートフォンで閲覧された場合のレイアウトを変更する指示もCSSが担当しています。

従来は、この「装飾(スタイル)」は、HTMLの中に含んで記述されていましたが、現在は、HTMLファイルとCSSファイルを分離して管理するのが一般的な方法になっています。

WordPressは常に進化し続けています

WordPressは、無償で提供されているCMSですが、プロジェクトチームによって進化し続けています。

現在のWordPressのバージョンは「5.02」ですが、このバージョンアップは、セキュリティ面の向上や使いやすさの向上などを目的に行われています。そのため管理画面に「更新」のマークが表示されている場合は順次、最新のバージョンに更新することをオススメします。

WordPressの更新と合わせてThemeとプラグインも更新しましょう

WordPressのバージョンが更新されると、Themeやプラグインもバージョンアップされることがあります。

WordPressの更新内容にThemeやプラグインが影響を受けない場合は、更新の対象とならないこともありますが、WordPressのバージョンアップ時以外でもThemeやプラグインのセキュリティの向上や機能向上のために、独自のタイミングで更新ができる場合もあります。

Themeやプラグインも常に最新のバージョンに更新することをお勧めしています。

Themeの選び方

Themeを選ぶ際にお勧めしている選び方は、Themeが定期的に更新されているものを選ぶようにお勧めしています。

WordPressをインストールした際には、「wordpressdotorg」が提供している「Twentyシリーズ」があらかじめインストールされています。

WordPress純正のThemeですので安心安全であり、開発が終了されることもないように感じてしまいますが、「Twentyシリーズ」は、現在「19」となっていて、既に開発が終了した、現在のWordPress・バージョンには合わないThemeも存在するようです。

無料Themeを使うか、それとも有料Themeを購入するか。実はどちらも注意が必要!

このサイトは、国内でも人気の【賢威】というThemeを使っています。

国産のWordPressThemeにも、これまで何年も開発が続いている無償のThemeがありますが、その多くが有料版Themeの機能に一部制限が付いているものである場合がほとんどです。

国内外の有料Themeの相場は、数千円から3万円程度です。中には、デザインテンプレートをたくさん格納した10万円近いThemeも販売されていますが、こちらは、ホームページ制作会社向けと考えて差し支えないでしょう。

本サイトは有料Themeの【賢威】を使っていますが、私が運営する他のホームページには、国産無料Themeの「Lightning 」や「stinger」などで作っているサイトもあれば有料Themeの「AFFINGER」で運営しているものもあります。

どのThemeも優秀なThemeですが、中にはバージョンアップが有償のThemeもありますので、更新状況やバージョンアップが有償になるタイミングなども使用前、購入前にチェックしておくことをお勧めします。

国産の有料Themeの中には「ユーザーフォーラム」が充実したThemeやカスタマイズ方法などを掲載したウェブサイトがたくさんあるThemeがあります。

気になったThemeは、「(Theme名) カスタマイズ」と検索して、その情報の多さを確認したり、購入前にユーザーフォーラムが充実しているのかをチェックするのもとても大切です。

国産Theme以外にも海外版有償Themeで構築しているWordPressサイトも運営しています。

賢威のカスタマイズに関して


本サイトでも賢威のカスタマイズに関して、随時紹介していきたいと考えています。

Themeには「親Theme」と「子Theme」があります。

Themeには、「親Theme」と「子Theme」があり、前述の通りTheme自体もバージョンアップが行われます。「親Theme」にはたくさんのファイルが存在しますが、子Themeは、CSSファイルとfunction.phpファイルの2つだけと言うケースも少なくありません。

「WordPressのカスタマイズ」とは、一般的に、このThemeをオリジナルのもの(特にデザイン(スタイル))にすることを意味するのですが、「親Theme」をカスタマイズするのではなく、「子Theme」のCSSファイルと「function.php」を編集して行います。

また、アクセス解析コードの設定などは「親Theme」の「header.php」をコピーしたものを「子Theme」に移植し編集を行います。

Themeによっては、header.phpを子Themeに移植しなくても解析コードを簡単に(解析コードのコピー&ペーストのみ)設定できるものもあります。

キャラ右

【賢威】も解析タグの設定は、Themeファイルのphpをイジらなくてもできるようになっています。

なぜ、直接「親Theme」を編集しないのかと言うと、「Themeのバージョンアップ」は基本的に「親Theme」に対して行われます。Themeの更新作業を行なった際には、「親Theme」を直接カスタマイズした内容は、この更新とともに消去されてしまうからです。

「子Theme」のCSSファイルや「function.php」、「親Theme」から移植し編集した「header.php」などは、親Themeのバージョンアップの影響を受けないため、カスタマイズされた内容は、Themeのバージョンアプ後も有効になると言うわけです。

編集できるようになりたい3つのファイル

WordPressサイトの機能や可読性、アクセス解析やライバルサイトのチェックをワンランク上のレベルで行いたい場合に編集できるようになっておきたいファイルは、たったの3つです。

それが…

  1. CSSファイル
  2. Function.php
  3. Header.php

上記3ファイルです。

親ThemeにもCSSファイルはあり、各Theme特有のスタイル(装飾)が定義されていますが、それだけだと、同じThemeを使っているホームページと同じデザインになってしまいます。

ホームページにオリジナル性を持たせる理由は、あなたのサイトのファンになった人たちが、「確かにお気に入りのサイトを閲覧している」と、はっきり分かるようにするためです。

キャラ左

過度な装飾や演出は可読性を損なってしまいますので注意しましょう。

CSSファイルを編集し、WordPressでコンテンツを作って行く際には、そのスタイルを呼び出すソースコードを覚える必要があります。

しかし、CSSファイルで定義したスタイルを呼び出すソースコードは「class=”定義したスタイル名”」もしくは「id=”定義したスタイル名”」の2種類ですので、それほど難しくはありません。

ホームページの自社運営に役立つ仕組みをプレゼント』では、このスタイルを呼び出すためのボタンを変種画面に追加するためのfunction.php用コードと、そのスタイルの呼び出しボタンがクリックされた際に定義されている「装飾(スタイル:CSS用コード)」をプレゼントしていますので、一度試してみてください。

「function.php」に記述するコードは、インターネットで検索するといろんな種類のものを見つけることができます。

「header.php」は、主に各ページのHTMLで言う「<head>〜</head>」とメインメニューや各ページの上部共通部分(本文に差し掛かるまで)を管理しているファイルです。

ここの「header.php」にアクセス解析用のタグなどを設置します。

Themeによっては、管理画面に指定された解析タグを貼り付けるだけで反映してくれるものもありますので、2重で解析タグを設置しないようにだけ注意してください

「header.php」を編集するのは、ホームページを作成する時くらいで、サイトの運営を続けていく中で何度も編集するファイルではないため、「header.php」の編集に自信が持てない場合は、専門家に依頼しても良いかもしれません。

アクセス解析タグの設置方法は「WordPress アクセス解析タグの設置方法」と検索すると見つけることができます。

また「header.php」ファイルの編集をプロに依頼したとしてもHTMLコードの<head>〜</head>内に記述してある内容は、ライバルサイトをチェックする際に役立つ情報が詰まっているので、覚えておくのが良いでしょう。
ホームページ更新やライバルサイトのチェックに役立つテクニック

CSSファイルの編集やスタイルの指定方法、どのようなコードがどのようなスタイルを表現していて、どのような約束事があるのかなどは、『HTMLクイックリファレンス(http://www.htmq.com/)』というサイトがとても便利です。

また、気になったデザインを指定しているコードを見つけたら、そのコードをそのまま検索窓に打ち込むと、スタイルの意味や応用方法などを見つけることができます。

CSSは、とても奥の深い言語です。それほど難しい言語でもありませんので、少しずつスキルを積み上げていってください。

プラグインの選び方とお勧めプラグイン

最後にプラグインの選び方とオススメのプラグインをご紹介します。

プラグイン選びは、まず、使用するThemeで推奨されているプラグインがある場合は、それらのプラグインを実装しましょう。

「wordpress おすすめプラグイン」などで検索すると、たくさんのプラグインを無料有料問わず紹介しているサイトを見つけることができますが、冒頭の通り(特に海外性)プラグインにはThemeとの相性やレンタルサーバーとの相性などがありますので、利用する際はひとつずつ追加して、レイアウトの崩れがないか、エラーは出ないかなどをチェックしながら実装してください。

特に、最近注目されているページの表示速度を早めるキャッシュ系のプラグインを導入する場合は注意が必要です。

設定によっては、コンテンツが正しく表示されなかったり、画面が真っ白になってしまったりすることもありますので注意してください。

プラグインの種類は驚くほどあり、便利なものも多いですが、あまりたくさんのプラグインを実装してしまうとホームページの表示速度が非常に遅くなる場合などもありますので注意しましょう。

オススメのプラグイン

オススメのプラグインは、セキュリティ強化のためのプラグインです。

Akismet

Akismet「Akismet」は、WordPressをサーバーにインストールすると自動的にインストールされるセキュリティ強化系のプラグインです。アカウント開設が必要ですが、一度アカウントを開設(APIキーの取得)してしまえば、ひとつのIDで、いくつものサイトを守ることができますので頑張ってみてください(それほど難しくないですよ!)。

キャラ左

AkismetのAPIキー取得方法は、こちらの記事が大変わかりやすいですよ!
https://bazubu.com/akismet-23841.html

SiteGuard WP Plugin

Site Guard WP PluginSiteGuard WP Pluginは、不正ログインや不正アクセス、スパムコメントなどに対するセキュリティを強化してくれるプラグインです。

詳しくは公式ページが判りやすいので本記事では割愛いたします。

キャラ右

このプラグインを有効化するとログインURLが書き換えられますので、必ずブックマークしておいてくださいね!

セキュリティ系プラグインではないですが…

Classic Editorセキュリティ系のプラグインではありませんが、「Classic Editor」もオススメのプラグインです。

WordPressの最新バージョンでは、新しい編集画面に切り替わっているのですが、これがチョット使いづらいんです。初めてWordPressを触る人にとっては、どうだか判りませんが、新しいWordPressの編集画面が使いにくいと感じたら「Classic Editor」をインストールしてみてください。

キャラ左

今後、HTMLやCSSのスキルを上げていきたいという方には特に「Classic Editor」を使った「テキスト・エディタ」での変種をお勧めしています。その場合は「HTML Editor Syntax Highlighter」や「Preserve Editor Scroll Position」もお勧めです。

まとめ


WordPressは超優秀な開発者たちによって、今でも進化し続けている世界でもっとも人気のCMS。WordPressサイトのデザイン性や機能は実装する「Theme」や「プラグイン」によって左右するが、基本的には高度な専門スキルを必要とせず、ホームページを作ることができるようになっている。

ホームページの作成に必要な専門スキルに尻込みせず、WordPressサイト作りを始めるためには、WordPressの構造やホームページがどのような仕組みになっているのかを適切に理解することが重要です。

キャラ右

ワンランク上のWordPressサイトを手にするためには、CSSの知識を定番サイトや検索エンジンを使いながら、焦らず少しずつ積み上げていくことが大切です。

補足


本記事では「オススメのプラグイン」にセキュリティ関連のプラグインしかご紹介していませんが、用途や状況、ホームページの作業環境などに応じたオススメのプラグインを随時コラムなどでご紹介してまいりますので参考にしてみてください。