「WordPress と写真」テーマの選び方 テーマを選んだら試すこと #tokyowp

2019年7月7日(日) テンプル大学にて、Tokyo WordPress Meetup Tokyo WordPress Meetup July 〜WordPressと写真〜が開催された。主催は写真家のシンヤB先生はじめ、映像の戸田さん、WordCamp Tokyo 2019実行委員長の mimi さん、と私の4人。WordPressにかかわりつつ、ふだん写真に触れる機会の多いメンバーだ。

以下は鳥山の発表内容です。

テーマの選び方 テーマを選んだら試すこと

写真ブログを運営したいとき、どんなふうにテーマを選んだり、作ろうとしているだろうか?WordPressでやろうと思ったら、テーマをどうするか?まず最初に考えることと思う。WordPressのテーマは、サイトの見た目を決める大事な要素だ。

今回のMeetupは写真に興味がある人が集まっているなかで、私がふだんこころがけていること、おすすめする方法を伝えたい。

  1. テーマの選び方
  2. テーマを選んだら試すこと
  3. テーマをカスタマイズする
  4. 私が写真ブログで使っているプラグイン

テーマの選び方

今回は写真を見せるのが目的なので、まずは見た目で選んでよいだろう。
写真を大きく見せたいのか、たくさん見せたいのか自分が見せたいイメージを考えたい。最初はぼやっとしたイメージしかなくても、探しているうちにこれいいなと見つけるのもいい。
そして、選んだテーマが安全なのか?自分のブログに使えるのか?確認することを忘れずに。

公式ディレクトリから選ぶ

WordPressのダッシュボードから選んでインストールできる公式ディレトリのテーマは無料で安全、100%GPLが魅力だ。きびしい審査を通っているため最も信頼できる。
WordPress テーマ | WordPress.org

特徴で絞り込む

例えば「フォトグラフィー」「ブロックエディタースタイル」「アイキャッチ画像」「1カラム」といった自分のイメージにあったレイアウトや機能で検索することができる。

最終更新

2年以内かどうかを確認したい。
ブログを始めてから時間がたつにつれWordPressやPHP、MySQLにセキュリティ的な問題がでてくる。その目安が2年。テーマやプラグインも同様で、最終更新から2年すぎているかどうか気にしよう。

2019年時点のデフォルトテーマ TwentyNineteen

WordPress Version

対応しているWordPressのバージョンが最新の2世代以内であること。
今(2019年7月 )WordPressのバージョンは 5.2.2なので、メジャーバージョンの2つ前5.0(2018年12月)以降に対応されているものがのぞましい。WordPressのテンプレートタグなど機能が廃止される場合があり、2世代前までを動作保証しているためだ。

テーマホームページ

詳しい使い方やデモがある(場合がある)。
テーマを有効化しても、なかなか思ったような見た目にならないものだ。テーマのホームページで使い方を調べてみよう。さらにテーマの機能を拡張するような、有料版の案内があることも。

人気テーマ SYDNEYのホームページ

サポートフォーラム

公式のサポートフォーラムが活発かどうか?も信頼できるテーマの目安だ。

TwentyNineteenのサポートフォーラム

開発ログ、Subversion レポジトリ

(※参考程度に)テーマがどのくらいの頻度で更新されていかを参照することができる。

私の配布しているテーマでちょうど2年過ぎたものがあり、「This theme hasn’t been updated in over 2 years. 」の警告が出ている例。

公式ディレクトリからテーマを選んでおけば安心という長所ある反面、種類が少ない、制約があるため機能が少ないといった短所もある。もし物足りない場合は、有料テーマも対象に。

有料テーマから選ぶ

私自身は有料テーマを使わないので、うまく紹介できないものの…お金を払うからには確実にサポートが受けられるテーマを選んでほしい。

WordPress.org 有料サポート GPL テーマ

公式ディレクトリの作者による有料テーマ。
https://ja.wordpress.org/themes/commercial/

国内で有料サポートがあるテーマ

日本語でサポートが受けられるほか、作者がコミュニティに参加している、直接知ってて質問することができるというのは信頼できる大きなポイントとなる。
私が知っているものでは、

どこからかダウンロードしたテーマ

野良テーマと呼ばれ、おすすめしない。
作者に連絡がつき信頼できる、自分で責任をもつ場合はOK。

自作テーマ

デザインが得意で WordPressが好きならテーマを作ってみよう。公式ディレクトリに登録してみるのもいい。自分で作ったテーマを公開することでスキルアップだけでなく、世界中で使ってもらえる嬉しさも。

テーマを選んだら試すこと

テーマチェック

プラグイン:Theme Check
https://ja.wordpress.org/plugins/theme-check/

  • WordPresの古いテンプレートタグを使っていないか?
  • PHPの古い関数や書き方を使っていないか?
  • 不正なURLを呼んでいないか?
  • WordPress特有のclass(画像の配置、最低限のアクセシビリティ、ブロックエディタ)に対応しているか?
  • 隠しファイルや関係ないファイル(Zipや Git)が含まれていないか?
  • あらゆる言語で使われることを想定しているか?(※日本語環境で使いたい場合)

※公式ディレクトリのテーマは通過済み

HTMLの見え方を確認

HTMLの要素がどのように見えるか、自分のイメージや用途にあっているか、デザイン・視認性を確認しておこう。公開されているテーマはデモサイトを提供していることが多く、公式ディレクトリでも簡易プレビューを見ることができる。

自分のブログで確認するには

  • プラグイン: Block Unit Test for Gutenberg
    https://wordpress.org/plugins/block-unit-test/
    ブロックエディタで表現できる基本的なHTML(テキスト、画像の配置など)を網羅した固定ページを生成。
  • テストデータ: theme-unit-test
    https://raw.githubusercontent.com/WPTRT/theme-unit-test/master/themeunittestdata.wordpress.xml
    インポート用のxml。
    WordPressのすべての投稿フォーマットや極端なケースなどを網羅した投稿データ。ブロックエディタ用とクラシックエディタ用の両方のデータが入っている。50件ほどの投稿がインポートされてしまうので、利用するときは気をつけて。
    ※公式ディレクトリのテーマは対応済み
HTMLの見え方

画像の見え方

アイキャッチ

写真ブログでは、とくにアイキャッチが重要と思っている。
一般的な横画像だけでなく、縦画像やスクエアの写真がアイキャッチでどんなふうに表示されるか?画像がはみ出したり欠けたり、サイズがバラバラに見えてしまわないか、アイキャッチがない場合はどう見えるか確認しておきたい。

テーマをカスタマイズする

テーマカスタマイザー

色やレイアウト、表示要素をダッシュボードで選べるようにテーマが提供している(場合がある)。ロゴやファビコン、フォントを変更できるテーマもあり、項目はテーマによって異なる。

ヘッダースライダーを持つテーマ BirdFIELD

プラグイン

子テーマ

子テーマを使うと、親テーマを継承しつつCCSやテンプレートをカスタマイズできる。

  • ロゴを設置したり、 SNS連携したりの見た目
  • カスタムフィールドやカスタム投稿タイプを追加したりの管理面
  •  REST APIを使ったり、画像の遅延表示したりの小技
  • プラグインに比べて自分だけの細かいカスタマイズができる
  • 基本的なアップグレードは親テーマにまかせておける

テーマを直接修正する

おすすめしない。
自身で対応できる場合はOK。

  • 開発元のサポートや動作保証がなくなる
  • PHPやWordPress のアップグレードで動かなくなることがある(画面が真っ白になる問題)

私が写真ブログで使っているプラグイン

最後に、私自身が写真ブログで使っているプラグインを紹介する。

Featured Image Admin Thumb

ダッシュボードの記事一覧にアイキャッチの欄を追加する。アイキャッチ設定し忘れ問題の防止、一覧からアイキャッチを設定することもできる。
https://ja.wordpress.org/plugins/featured-image-admin-thumb-fiat/

Google Maps Photo Gallery

位置情報付きの写真をGoogle Map上に表示するショートコード。写真を撮り歩いた様子がわかる。
https://ja.wordpress.org/plugins/google-maps-photo-gallery/

サイトの良さは「コンテンツ」であるのはもちろんですが、やはり見た目が第一印象と思いませんか?トップページからクリックして記事を読みすすめたり、もっと写真を見てみたいと思ったり、そんな写真のブログにしていきたいですね。

参加者集合写真

ツイートまとめ
» 2019/7/7 Tokyo WordPress Meetup July 〜WordPressと写真〜 ツイートまとめ

発表スライド
https://speakerdeck.com/sysbird/2019-07-7-tokyowp-photo

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください