キタジマ タカシ ウィジェットの表示方法の統一とカスタマイザーのメニュー構成の変更など、大きめの変更をいくつか入れたアップデートになります。大きめのアップデートを細切れにリリースすると都度影響がないか確認していただくのも大変だと思うので、いろいろ一気にまとめて対応しました。
CSS もテンプレート周りも結構手を入れたので、子テーマや追加 CSS でカスタマイズをされている方には影響が大きいかもしれません。本番でいきなりアップデートせずに、テスト環境などで試しにアップデートしてみて崩れたりしないか確認されることをお勧めします。
今回はいつもよりたくさんの方にご要望、アドバイス、バグ報告、動作確認などのフィードバックを頂きました。ありがとうございます！
テーマは設定の組み合わせが膨大にあるし、どのようなプラグインと組み合わせて使われるか、どのような環境で使われるかも多様なので、どうしても一人では限界があります。こうやってたくさんのフィードバックを頂けるのは本当に助かります。
主なアップデート内容
機能追加
- ブログトップページにのみ表示される「投稿ページ（上部/下部）ウィジェットエリア」の追加
- GA タグ、タグマネージャータグを管理者でログイン中には除外
- ドロワーナビゲーションに検索ボックスを表示する機能を追加
- ピックアップスライダーウィジェットの設定で、リンク種類の選択機能を追加
- シェアボタンに Google+ ボタンを追加
変更（カスタマイズしている場合に影響がでる場合があり）
- 「フロントページウィジェットエリア」を「ホームページウィジェットエリア」に名称変更
- フロントページウィジェットエリア、アーカイブ上部ウィジェットエリアにおける各ウィジェットの表示方法の統一
- カスタマイザーのメニュー構成の整理
- ブログカードの画像は背景画像ではなく img にする（AMP 対応）
- コメント欄で、その投稿の著者のコメントについては顔が右側になるように変更
- CSS 軽量化のために、プラグインに依存した CSS はメイン CSS から切り出し
- ショーケースウィジェット、スライダーウィジェットで全面リンクを可能に
- 記事一覧部分の各記事表示のカスタム投稿タイプ対応
- 最近の投稿ウィジェット、任意の投稿ウィジェット、ランキングウィジェットでカスタム投稿タイプを指定したときにカテゴリー（カスタムタクソノミー）が表示されない不具合を修正
- og:description が強制的に一定文字数でカットされないように変更
- ブログカードを非同期でレンダリングするように変更
- ブログカードのキャッシュを投稿メタではなく Transient API を利用するように変更
- 記事が複数のカテゴリに属しているとき、詳細ページに属している全てのカテゴリーを表示
不具合の修正
- パンくずの各項目は HTML を除外して表示するように修正
- hタグ以外も目次の項目として指定できるように修正
- スマホ閲覧時、インフィード広告ありで一覧が1カラム表示のとき、サムネイルの画質が低い問題を修正
- 検索結果画面の表示崩れの修正
- お知らせバーの文字列が IE11 で右に寄る不具合の修正
- 任意のタクソノミーの投稿ウィジェットで、カスタム投稿タイプに紐付けられたタクソノミーの記事が表示されない不具合を修正
- Pure CSS ギャラリーで、拡大画像はトリミングしないように修正
- 画像リンクの Pure CSS ギャラリーが発火しない不具合の修正
- 「Pure CSS ギャラリーを使用する」がオフのときは通常画像のライトボックス表示もオフになるように修正
- コンポーネント追加ボタンが PHP エラーになることがある不具合の修正
- カスタム投稿タイプ利用時に記事一覧部分で PHP エラーがでることがある不具合の修正
開発者向け
snow_monkey_prepend_drawer_navアクションフックの追加snow_monkey_append_drawer_navアクションフックの追加snow_monkey_output_google_analyticsフィルターフックの追加snow_monkey_output_google_tag_managerフィルターフックの追加snow_monkey_output_google_analyticsフィルターフックの追加snow_monkey_output_google_tag_managerフィルターフックの追加inc2734_wp_seo_descriptionフィルターフックの追加
今回のアップデートで変更があったテンプレート系ファイル
処理的な部分を除いた、テンプレート系のファイルで変更があったファイルは以下のとおりです。下記のファイルを子テーマで上書きしている場合はデザインの崩れ等が発生する可能性があります。下記ファイルを子テーマで上書きされている方で問題が発生した場合は、新たにファイルをコピーしなおし、そのファイルに必要なカスタマイズを反映してみてください。
- /app/template-tags/get-page-title-from-breadcrumbs.php
- /app/template-tags/the-title-trimed.php
- /app/widget/snow-monkey-recent-posts/_widget.php
- /page-templates/one-column-full.php
- /template-parts/archive-sidebar-widget-area.php
- /template-parts/archive-top-widget-area.php
- /template-parts/breadcrumbs.php
- /template-parts/comments.php
- /template-parts/contents-bottom-widget-area.php
- /template-parts/drawer-nav.php
- /template-parts/footer-widget-area.php
- /template-parts/front-page-widget-area-bottom.php
- /template-parts/front-page-widget-area-top.php
- /template-parts/loop/entry-summary-post.php
- /template-parts/loop/entry-summary.php
- /template-parts/page-header.php
- /template-parts/pings.php
- /template-parts/posts-page-widget-area-bottom.php
- /template-parts/posts-page-widget-area-top.php
- /template-parts/related-posts.php
- /template-parts/sidebar-sticky-widget-area.php
- /template-parts/sidebar-widget-area.php
- /template-parts/title-top-widget-area.php
- /templates/layout/wrapper/left-sidebar.php
- /templates/layout/wrapper/one-column-fluid.php
- /templates/layout/wrapper/one-column-full.php
- /templates/layout/wrapper/one-column-slim.php
- /templates/layout/wrapper/one-column.php
- /templates/layout/wrapper/right-sidebar.php
- /templates/view/archive-post.php
- /templates/view/archive.php
- /templates/view/content-post.php
- /templates/view/front-page.php
- /templates/view/home.php
- /templates/view/no-match.php
- /templates/widget/any-posts.php
- /templates/widget/pr-box.php
- /templates/widget/ranking.php
- /templates/widget/recent-posts.php
- /templates/widget/showcase.php
ブログトップページにのみ表示される「投稿ページ（上部/下部）ウィジェットエリア」の追加
ホームページ（固定フロントページ）用にはフロントページウィジェットエリア（今回のアップデートでホームページウィジェットエリアに改称）というウィジェットエリアを用意していたのですが、投稿ページ（ブログトップページ）専用のウィジェットエリアは無く、アーカイブページ上部ウィジェットエリアがアーカイブページと投稿ページで（ブログトップページ）と共通で使用される、という状況でした。
今回のアップデートで、下記のように変更になりました。
- ホームページにはホームページウィジェットエリアが表示
- 投稿ページには投稿ページウィジェットエリアが表示
- それ以外のアーカイブページ（カテゴリー、タグ、日付アーカイブ）にはアーカイブページ上部ウィジェットエリアが表示
GA タグ、タグマネージャータグを管理者でログイン中には除外
カスタマイザー > SEO/SNS > Google アナリティクス、カスタマイザー > SEO/SNS > Google タグマネージャーからそれぞれオンオフできます。
デフォルトでは、編集者・管理者（manage_options 権限を持つユーザー）のアクセスは除外されるようになっています。どの権限を持つユーザーを除外するかは、snow_monkey_output_google_analytics、snow_monkey_output_google_tag_manager フィルターフックで変更できます。
/**
* manage_options 権限を持つユーザーの場合は Analytics のタグを出力しない
*
* @param boolean $boolean
* @return boolean
*/
add_filter( 'snow_monkey_output_google_analytics', function( $boolean ) {
return ! current_user_can( 'manage_options' );
} );
/**
* manage_options 権限を持つユーザーの場合はタグマネージャーのタグを出力しない
*
* @param boolean $boolean
* @return boolean
*/
add_filter( 'snow_monkey_output_google_tag_manager', function( $boolean ) {
return ! current_user_can( 'manage_options' );
} );
ドロワーナビゲーションに検索ボックスを表示する機能を追加
カスタマイザー > デザイン > 基本デザイン設定 > ドロワーナビゲーション内に検索ボックスを表示するでオンオフできます。
ピックアップスライダーウィジェットの設定で、リンク種類の選択機能を追加
ピックアップスライダーは、これまで各スライドの「READ MORE」のボタンだけがリンクでしたが、今回のアップデートで「ボタンリンク」「全体リンク」が選択できるようになりました。「全体リンク」にするとスライド全体がリンクになります。
フロントページウィジェットエリア、アーカイブ上部ウィジェットエリアにおける各ウィジェットの表示方法の統一
これまでフロントページウィジェットエリアとそれ以外のウィジェットエリアで見出しの表示のされ方が違ったり、ショーケースやスライダーなど一部のウィジェットでコンテンツ幅で表示するかウィンドウ幅で表示するかなど、いくつかの違いがあったのですが、これらの違いがなんとなく付け足し付け足しでつくられたもので、ビシッと統一されたルールが無い状態でした。
そこで、今回のアップデートで統一されたルールをつくることにしました。次のようなルールになります。
- 「ホームページウィジェットエリア」「投稿ページウィジェットエリア」「アーカイブページ上部ウィジェットエリア」はページを構築するためのウィジェットエリア（A）、それ以外のウィジェットエリアは単純にウィジェットを配置するだけのウィジェットエリア（B）として定義する。
- 1カラム系のテンプレートで（A）が表示される場合は、ウィジェットの上下に大きめの padding をとり、ウィジェット間の margin は無くす
- 1カラム系のテンプレートで（A）が表示される場合は、「スライダー」「ピックアップスライダー」「ショーケース」「PR ボックス」はウィンドウ幅で表示する
- 1カラム系のテンプレートで（A）が表示される場合は、「PR ボックス」「Snow Monkey: 最近の投稿」は見出しをセクションタイトルとして表示する
あとはフッターウィジェットエリアと、右サイドバー・左サイドバーの場合のサイドバーウィジェットエリアのような狭い幅で表示されるウィジェットエリアとそれ以外のウィジェットエリアでは、いくつかのウィジェットでちょっと表示が違ったりします
カスタマイザーのメニュー構成の整理
カスタマイザーもウィジェットエリアと同じで、継ぎ足し継ぎ足しで、アップデートを重ねるたびにちょっとここは項目が多すぎるなとか、これとこれはこうしたほうが直感的に理解しやすいのでは？というような部分がでてきました。今回のアップデートで、直感的に理解しやすくなるようにメニューの構成を再構成しました。
ざっくりですが、ビフォー/アフターを書き出してみました。参考まで。
ショーケースウィジェット、スライダーウィジェットで全面リンクを可能に
ショーケースウィジェット・スライダーウィジェットには、「リンクテキスト」と「リンク URL」を入力することでリンクボタンを表示する機能があります。
これまでは「リンクテキスト」の入力がない場合はボタンが表示されず、リンクは設定されない、という仕様だったのですが、「リンク URL」の入力があって「リンクテキスト」の入力がない場合はボタンは表示せずにウィジェット全体がリンクになるという仕様に変更になりました。
Pure CSS ギャラリー機能の修正
Pure CSS ギャラリー機能は、Snow Monkey に搭載されている、いわゆる”ライトボックス”系画像表示機能です。画像リンクをクリックするとページ上で画像が拡大表示される、という機能ですね。デフォルトではギャラリーと、画像にリンクさせた画像に対して適用されます。その Pure CSS ギャラリー機能について下記の修正をいれました。
Pure CSS ギャラリーで、拡大画像はトリミングしないように修正
Pure CSS ギャラリーが適用されたギャラリーは、各画像はトリミングされ、サイズが統一されてピッタリと並んで表示されます。そして、その画像をクリックすると拡大画像が表示されるのですが、その画像もトリミングされてされた状態で表示されていました。これを、拡大画像はトリミングせずに表示するように修正しました。
画像リンクの Pure CSS ギャラリーが発火しない不具合の修正
本来 Pure CSS ギャラリー機能は、ギャラリーと画像リンクに適用される想定で開発していましたが、不具合によりギャラリーにだけ適用され、画像リンクには適用されていませんでした。今回のアップデートで修正をいれ、画像リンクにも適用されるようになりました。
ただ、これまで適用されていなかったものなので、修正したことで他のプラグインやカスタマイズとのバッティングなど、ユーザーさんからしたら逆に不具合では？みたいなこともでてくるかもしれません。その場合は、カスタマイザー > デザイン > 基本デザイン設定 > Pure CSS ギャラリーを使用するをオフにしてください。
シェアボタンに Google+ ボタンを追加
カスタマイザー > SEO/SNS > シェアボタンで、Google+ のボタンも追加しました。
ブログカードを非同期でレンダリングするように変更
これまでブログカードは同期的に表示される仕組みでした。つまり、ブログカードの HTML が組み上がるまでページの表示はストップしていた、ということです。
今回のアップデートでブログカードを非同期でレンダリングするように変更したので、最初に URL が表示されて、ちょっとしてブログカードに置き換わるという動作になりました。これは他の oEmbed なツイートや Facebook 埋め込みと同じ動作になります。非同期にしたことで、ページの表示も若干早くなります。
もし Snow Monkey をアップデートしてこれまで表示されていたブログカードが URL のまま変換されずに表示されてしまう場合は、そのページの編集画面で再度更新してみてください。
v4.0 のコントリビューター
浦上未央さん、村上直子さん、koka さん、シュンスケさん、カッシーさん、コンチさん、メガネさん、齋木弘樹さん、黒石譲さん、高橋文樹さん、三澤拓也さん、赤ペソ先生さん、土居安佳里さん、小龍さん
