BizVektor で管理バーの「編集ガイド SHOW / HIDE」の切り替えが動作しない問題の対策

WordPress テーマ BizVektor を使用しているサイトで、管理バーの「編集ガイド SHOW / HIDE」の切り替えが動作しないことに気がつきました。

実は前からこの症状に気づいていたのですが、このままでもあまり困らないので、ずっとこの状態で運用していました。

サイトによっては切り替えが動作するんですね。

そこで、原因を調べてみたところ、VK All in One Expansion Unit がインストールされているとこの症状が起きることがわかりました。

クリックすると SHOW ⇔ HIDE をトグルで切り替える仕様になっているのですが、BizVektor と VK All in One Expansion Unit の両方がトグル切り替え処理を行うので、SHOW ⇒ HIDE ⇒ SHOW の動作を行って、結局元に戻ってきてしまう、という症状でした。

そこで、子テーマに以下のコードを追加して切り替えが動作するようにしています。

JavaScript

(function(w,d,i,c,f){
	w.addEventListener('load', function(){
		var e=document.getElementById(i);
		if(e){e.addEventListener('click', function(){
			if(e.classList.contains(c)){
				e.classList.remove(c);d.body.classList.remove(f);
			}else{
				e.classList.add(c);d.body.classList.add(f);
			}
	})}})
})(window,document,'wp-admin-bar-veu_disable_admin_edit','ujs-active','ujs_hide_edit_guide')

CSS

#wp-admin-bar-veu_disable_admin_edit.ujs-active .ab-item ._show {
    display: none;
}

#wp-admin-bar-veu_disable_admin_edit.ujs-active .ab-item ._hide {
    display: inline;
}

body.ujs_hide_edit_guide :is(.adminEdit,.edit-link,.veu_adminEdit) {
    display: none;
}

サイト運営者プロフィール

対馬 俊彦魚沼情報サービス (新潟県南魚沼市)

【日本全国対応】WordPress のサイト制作、設定、カスタマイズ、トラブルでお悩み、お困りの方、お手伝いいたします。

Lightning / VK Blocks / VK Filter Search のサポート、カスタマイズを得意としています。

遠方からのご依頼の場合、打ち合わせ・サポートを Zoom や電子メール・電話などを併用して行わせていただきます。

オンラインレッスン形式でのホームページ制作サポートも行っています。お客様ご自身でホームページを制作・運用する上でうまくいかない部分をサポートいたします。設定やカスタマイズを手伝ってもらいたい、同時に便利な使い方や設定方法、カスタマイズのやり方も知ることができたら...という方にご好評いただいています。

デザイナー様、制作業者様のサイト制作のお手伝いも数多く行っています。難しい部分のコーディング ( PHP / CSS / jQuery ) をやってほしい、いま人手が足りない等、お仕事の依頼をお待ちしています。

ご要望をうかがった上で費用見積り（無料）を提示させていただきますので、お気軽にお問い合わせください。

≫メールでのお問い合わせはこちら

最新の投稿

この著者の記事一覧

• WordPress2024年10月6日【ブロックエディター対応】画像をテキストの形で切り抜く(クリップする)やり方
• WordPress2024年9月30日BizVektor で管理バーの「編集ガイド SHOW / HIDE」の切り替えが動作しない問題の対策
• WordPress2024年9月29日クエリーループの新着記事スライダー実装例（重なったカードが切り替わる）
• WordPress2024年9月27日画像ブロックにフォトフレームをつけるやり方の比較