Snow Monkey 開発日誌【2018年8月29日】

今日は3つの新機能を追加した Snow Monkey v4.2 のリリースを行いました。

アップデートのお知らせは Snow Monkey 公式サイトに掲載したほうが良いと思ったのでそっちに書きましたが、今日はそれしかネタがないので、開発日誌どうするかなーという感じでして、まぁ上のリンクはるだけだとつまらないので、ちょっと技術的な詳細について書いたりしてみたいと思います。

アーカイブページを noindex にできる設定項目の追加

カスタマイザーで、各種アーカイブページを noindex に設定できるようにしました。カスタマイザー > SEO/SNS > クローラー > noindex の設定で設定できます。

はい、まずこちらです。僕は SEO とかあんまり知識なくて、「タグページとかカテゴリーページとかを noindex にしたほうが良い」という情報をちょいちょい見かけるものの、WordPress が標準的に noindex にしてないんだから別にやらなくても大丈夫でしょ、くらいの認識だったのですが、先日参加したものくろキャンプのときにいろいろ事例などの情報を伺って、個々人が noindex にするにしろしないにしろ、できるように機能としては用意しておいたほうが良さそう、という印象を持ったのでさっそく機能追加しました。

ちなみに、この機能の根幹の部分は inc2734/wp-seo という composer ライブラリに含まれています(Snow Monkey の機能は、このような複数の自作 composer ライブラリで構成されています)。

今回だと、inc2734/wp-seo の wp_seo_meta_robots というフィルターフックで各アーカイブページの meta robots の設定を制御しています。inc2734/wp-seo を require して下記のようなコードを書けば、自作のテーマやプラグインでも似たようなことができます。

add_filter( 'wp_seo_meta_robots', function( $robots ) {
	if ( is_tag() ) {
		$robots = [ 'noindex' ];
	}
	return $robots;
} );

検索ボックスやドロワーナビをどこからでも開く仕組みを追加

検索ボックス

#sm-overlay-search-box というリンク先を設定したリンクをクリックすると、全画面オーバレイの検索ボックスが開くようにしました。

これ結構良さげだと思うんですがどうでしょう?このサイトの、スマホにだけ表示されるフッター固定メニューにも追加してみたので、ぜひクリックしてみてください。

実はこの機能、CSS だけで実装されています。普通こういうのって JavaScript で出したり消したりしますよね?(え、しませんか…するっていうことにしておいてください…)

どうやってやっているかというと、:target というセレクタを使って実現しています。:target セレクタは、例えば「ブラウザに 2inc.org/#sm-overlay-search-box みたいな URL が打ち込まれたときに、#sm-overlay-search-box な要素に対して CSS を適用できるセレクタ」になります。

つまり、

<div id="sm-overlay-search-box" class="p-overlay-search-box">〜</div>

という HTML だったとして、

.p-overlay-search-box {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  visibility: hidden;

  &:target {
    visibility: visible;
  }
}

みたいな CSS を書くと、URL に #sm-overlay-search-box があるときとないときで出したり消したりできる、というわけです。なかなか便利じゃないですか?

ドロワーナビ

#sm-drawer というリンク先を設定したリンクをクリックすると、ドロワーナビゲーション(メニューを設定しておく必要があります)が開閉するようにしました。

こっちについては既存のドロワーナビの実装にあわせて aria-hidden の制御やハンバーガーボタンの制御なども必要だったので JavaScript を使っています。

なんか Snow Monkey の JavaScript、全体的に冗長な気がしていて、それで極端に遅くなっているということは(多分)無いのですが、なんかムズムズしてきているので、もうちょっと jQuery 使わなくても簡単にできそうなところは使わないでやるとか、なんでもかんでも class にしちゃってるので必要なさそうなところはしないとか、そういった感じのリファクタリングを後々やりたいなぁと考えています。

サポートフォーラム

あとはちょこちょこサポートフォーラムでの質問に回答したりしました。

WordCamp Tokyo 2018 スポンサーブース用のノベルティ

まだちゃんと告知できてなかったですが、WordCamp Tokyo 2018 にスポンサードしており、ブースを出させていただくことになっています。

WordCamp Osaka 2018 でもスポンサーブースを出していて、このときはチラシ作戦で挑んだものの期待していたほどの効果はなく、他のテーマ開発会社さんと情報交換したときに聞いてみたらやっぱりチラシはさほど効果を感じられなかった、ということだったので、今回はチラシはやめて、ノベルティ作戦で挑んでいます。

詳しくはブース出します記事を書いたときに書こうと思いますが、すでにノベルティつくるためにかなりお金がかかっており、もはや直接的な意味で利益回収することは諦め気味であります…。なんかこうジワーッと長期的に効いてくれれば良いかなぁと…どうだろうなぁ、効いてくれないとキツいなぁ…(悲しみ)

オンラインコミュニティのほうにはちょいちょい書いていますが、オンラインコミュニティメンバーの方で、ブースに手伝いに来てくれたり遊びに来てくれたりした方には特別なノベルティを用意しています(これがめっちゃ高かった)。数に限りがあるので、というか捌けないともったいないことになるので、オンラインコミュニティメンバーの方はぜひぜひブースにお越しください。Snow Monkey を購入しているけどオンラインコミュニティに参加していないという方はぜひこの機会にご参加ください!

あ、WordCamp Osaka 2018 のときのチラシ作戦の結果は下記の記事のメンバー限定部分に書いています。

明日の予定

しばらく Snow Monkey 本体よりアドオンの Snow Monkey Awesome Custom Blocks の開発ばっかりやっていたので、久しぶりに Snow Monkey の開発をしたり触ったりしていると、新たな気付きがいろいろとあって、今日だけで結構 issue がたまりました。明日はそれをちょこちょこ潰していてマイナーアップデートをリリースしようかなという感じです。

  • ブックマーク
  • Feedly

この記事を書いた人

キタジマタカシ

長崎在住、フリーランスのWordPress テーマ / プラグインデベロッパー。 多数のプロダクトをオープンソースで開発・公開しています。現在は WordPress 有料テーマ Snow Monkey を開発・販売しています。