Arkheは有料ライセンスを使うとSWELLに近い機能が使えるようになります。
実際に課金しても、制作上、必須と言える機能はほぼ無いので、無課金のままArkheを使って企業サイトを制作しました。
この記事では、Arkheを無課金で企業サイトを制作した時の課題や問題点についてまとめています。
Arkheはjavascriptで実装された機能が外せない
Arkheは無料テーマですが、独自のjavascriptで実装された機能がいくつかあります。
主には、スムーススクロールやスクロール検出などです。
これらのjavascriptで実装された機能は、main.jsで提供され、コードは圧縮されています。
これらの機能を外したい時には、main.js自体を差し替えるしかありません。
main.js自体はadd_actionをremoveすれば、差し替えることが可能でした。
スムーススクロールの問題点
スムーススクロールは、ヘッダーサイズを計算して、ジャンプ位置を調整するようになっています。
しかし、ヘッダーサイズは常に変更されないという前提になっていて、ページ読み込み時にサイズ計算しています。
スクロール中にヘッダーサイズが変更されるケースでは、ジャンプ後に位置がずれる問題が起きます。
ヘッダーサイズを別途指定できればいいのですが、Arkheではそれができないのと、スムーススクロールのjavascriptだけを差し替えることも出来ません。
スクロール検出の問題点
ArkheやSWELLはページ先頭に要素を配置して、それを検出することでスクロール検出をしています。
この部分にはintersection observerが使われていますが、あまり良い実装ではなく、チャタリングする問題があります。
この部分も書き換えたくても、main.jsにあるため書き換えられません。
コード内に機能があるのに有効化されていない
Arkheは、ロゴと一緒にサイトのキャッチフレーズを表示する機能がテーマファイルにはありますが、テーマの設定からは有効化できません。
Arkheは、カスタマイズしないと、サイトのキャッチフレーズが常に表示されません。
これは、Arkhe Toolkitで有効になるのか謎なのですが、フックで書き換えてあげれば、キャッチフレーズが表示できるようになります。
add_filter('arkhe_part_args__header/logo',function($args){
//var_dump($args);
$args['show_tagline']=1;
$args['show_tagline_sp']=1;
return $args;
});
まとめ
Arkheは、Arkhe Toolkitが使う機能がテーマのコード内部に転がっている場合があるので、自分でフックを使ってスイッチを書き換えると使えるようになります。
Arkheは無料テーマとしては完成度がとても高いと思いますが、カスタマイズが前提となっていますので、初心者向けではないと思います。
コメント