こんにちは、yujiです。
今回は、ワードプレスの人気テーマであるストークについて書いていきます。このブログでも使っているストークですが、たびたびのアップデートを繰り返して、ついに2019年の11月に新しいテーマ『ストーク19』をリリースしました。
まだストークを使っていない方はそのままストーク19を使えば問題ないですが、僕のように旧ストークを使っていてストーク19に変更したい場合は色々と疑問点がでてきます。
- サイトカラーの設定はそのまま引き継げるの？
- 追加CSSとfunction.phpはどうなる？
- ショートコードはやり直し？
- ウィジェットは？
- と言うかストーク19になって何が変わったの？
結論から言うと、引き継げるものもあるけど引き継げないものもあります。なので、引き継げるものはよしとして、引き継げないものの対策方法と、ストーク19の変更点について解説していきますね。
- そもそもストーク19になって変わったこと
- 旧ストークからストーク19に変更する際の注意点と対策
- 旧ストークからストーク19に変えるメリットはあるのか？
それではどうぞ^^
Contents
ストーク19になって追加された機能
まず最初に「そもそもストーク19になって何が変わったの？」と言うことで、ストーク19になって追加された機能をみていきましょう。
- エディタ『Gutenberg』に対応
- ショートコードの追加
- ピックアップバナー機能
- 表示速度の改善
- ヘッダーの固定
- ヘッダー下の『お知らせテキスト』のカラーをグラデーションにできる
- 記事下の『前後の記事を消せる
- 記事下のSNSフォローボタンの設置
- Googleフォントの変更
- 記事の見出しデザインの変更と追加
ざっとこんなところかと思います。（まだあったらスミマセン…）
ちなみに個人的に気にいってる部分は、以下4つです。
- 見出しのデザイン変更と追加
- ショートコードの追加
- ピックアップバナー機能
- 表示速度の改善
①見出しのデザイン変更
旧ストークは、見出しデザインがデフォルトで見出し3までしかありませんでした。ですが、ストーク19はカスタマイズなしで見出し4までデザインが追加されています。
見出し２
見出し３
見出し４
②ショートコードの追加
ショートコードが追加されたことで見せ方のバリエーションが増えました。
ボックスのショートコードやカテゴリリストの関連記事など、cssやfunction.phpをいじらなくてもデフォルトで良い感じの見た目をキープできます。これはストークの魅力である、プログラミングがわからなくても見栄えがキレイにできる要素の１つですね。
③ピックアップバナー機能
ピックアップバナーで『どこになにがあるか』をわかりやすくできたこと。ちなみにピックアップバナー機能とは、画像の赤枠部分のことです。
ユーザーが読みたい記事、またはユーザーに読んで欲しい記事を一目でわかるようにできるので、回遊率を上げやすくなります。
④表示速度の改善
そして何と言っても、表示速度の改善ですね。
WEB媒体は表示速度にやたらとシビアです。なにか調べ物をする時、ページの読み込み速度が30秒以上かかるとユーザーの約40％が離脱すると言われています。そして旧ストークは、ネット上の評判に『表示速度が遅い』というのをよく目にします。
なので、表示速度の改善はストーク19の大きなメリットだと言えますね。
旧ストークからストーク19に変更
前置きが長くなりましたが、それでは早速テーマを変更する際の注意点をみていきましょう^^
まず、テーマを変更する際にそのまま引き継げるものと引き継げないものを確認します。
- ショートコード
- ウィジェット(要確認)
- サイトの設定（サイトカラーなど）
- 追加CSSとfunction.php
こんな感じで分かれます。
ショートコード（引き継げる）
ショートコードは、ワードプレスのテーマによって変わります。そのテーマに合ったショートコードがあるので、通常だとテーマを変えるときはショートコードも変更しないとダメです。ですが、ストークは、旧ストークのショートコードをそのまま引き継げるので全く問題ありません。
ちなみにショートコードはAdd Quicktagで登録して使いやすいように設定しておきましょう。（↓こんなやつです）
ウィジェット（引き継げるけど要確認）
ストークの公式サイトには「ウィジェットは引き継がれない」と書いてありますが、僕の場合はそのまま引き継がれました。ですが、公式で引き継がれないと書いてあるので、一応引き継がれなかった時の対策はしておいた方がいいと思います。
対策方法は、設定している項目をスクリーンショットで残しておきましょう。僕の場合だとこんな感じです。
全体的なウィジェットの並びをスクショ。
テキストやカスタムHTMLなど、何か書き込みしているものがある場合は、『全選択＋コピー』でメモ帳などのアプリに貼り付けておきます。そうすることで、新しくウィジェットを設定する場合も、貼り付けるだけでオッケーです。
後はこの操作を繰り返すだけで、ウィジェットが引き継がれなかった場合も安心して元通りにできます。
サイトの設定（サイトカラーなど）
次に引き継げないものですが、こちらも基本的にはスクリーンショットとメモ帳で解決できます。まずサイトの設定ですが、『外観⇨カスタマイズ』で各項目をスクショしていきましょう。
サイト設定のスクショは枚数が多くなるので、『サイトの設定』のフォルダをつくって、そこに各項目のタイトルを入れて保存しておくと、後々わかりやすいですね。
ただ、サイト設定の中でも
- 設定している文字（サイトタイトルやリンク文字）
- 設定しているリンク
この2つはそのまま引き継がれたので、実際はカラーの設定のみでオッケーでした。
追加CSSとfunction.php
いよいよ最後の、追加CSSとfunction.phpですね。しつこいようですが、こちらもスクリーンショットとメモ帳で対応していきます。
追加CSSは、さっきの『外観⇨カスタマイズ⇨追加CSS』に進んでください。で、その中を全てコピーしてメモ帳に貼り付けておきます。
次にfunction.phpですね。
『外観⇨テーマエディタ⇨テーマのための関数』と進むと、今までカスタマイズした内容があると思います。
function.phpをカスタマイズしていない場合は関係ないのでスルーしてください。
そして、『11』から下の部分を、コピーしてメモ帳に貼り付けます。
以上で、旧ストークからストーク19に変更する準備はOKです。お疲れ様でした^^
旧ストークからストーク19に変えるメリットはあるのか？
上記のようにスクショ＆メモ帳のコピペで安心して旧ストークからストーク19に変えれると思います。
最後に1番肝心な、『旧ストークからストーク19に変えるメリットはあるのか？』についてですが、僕はあると思います。実際に変えてみて、公式では書いてないようなちょっとした変更が多くありました。
『細部に神はやどる』と言いますが、本当に細かいとこまで気を使ってくれているんだなと感じますし、テーマを使う側(書く側)のことも見る側のことも配慮しているように感じます。
新しくストーク19を使おうと思ってる場合はもちろん、特に旧ストークを使ってる方はストーク19に変えるメリットはかなりでかいと思いますよ^^
まとめ
- ストークとストーク19は別のテーマ扱い
- 引き継がれるものと引き継がれないものがある
- 引き継がれないものは、『スクリーンショットとメモ帳のコピペ』で対策
以上が旧ストークからストーク19に変える際の注意点と対策方法でした。
サイト設定や追加CSS、function.phpなど引き継がれないものはあるにしても、全く別のテーマに変えるよりはかなりハードルは低いです。たぶんストーク19変えてから見栄えを元通りにするまで1時間とかからないと思います。
しかも僕の場合は、
なので、旧ストークからストーク19に変えようか悩んでる方は、ぜひ検討してみてください。
それではまた^^
