[ 解決済 ] ウィジェットの出し分け機能

[momo]

DRILL LANCERさん、早速の回答ありがとうございます。
サブスクリプション検討中との事、DRILL LANCERさんのこれまでのノウハウ蓄積時間、その他諸々と、私のように勉強せずに恩恵に預かれる事を考えれば有料化は当然だと思います。

個人的には出来れば、今回の出し分けプラグイン単品だったら買い切り1000円とかだと嬉しいです。
コロナ不況が年内か、数年か？分からない中で、Adobeとか色々のサブスクリプションの重複が、我が身に重くなるかも知れませんし。

[DRILL LANCER]

単体ではなく、記事で紹介したものをすべてひっくるめたものを考えています。
単品でプラグイン化するつもりはありません。

[momo]

DRILL LANCERさん、了解しました。
その時が来たらプラグイン内容と懐具合などで考えます。

[石川＠Vektor,Inc.]

VK Blocks のブロック非表示機能は、最初 Bootstrapのクラスでやろうとしたのですが、指摘のように xs が非表示になどできなかったので、独自の非表示クラスを設定しています。

下記ページの下部で確認するとちゃんと効く事が確認できると思います。

VK Blocks（WordPress標準ブロック拡張）

おそらくですが、DRILLさんのソースコードだとどれか一つのサイズで非表示になってしまい、
その指定クラスの影響でをうけてしまうのだと思います。

なので、「通常表示」の選択肢を増やす必要があるのではないかと思います。

[DRILL LANCER]

記事のほうを修正しておきました。
私のコードの方の原因はやはり d-xs-none → d-none で d-xs-none が存在しないことのようでした。

また Bootstrap 4 が提供する下記 CSS に対し

.d-block {
    display: block!important;
}

.d-none {
    display: none!important;
}

@media (min-width: 576px) {

	.d-sm-block {
	    display: block!important;
	}

	.d-sm-none {
	    display: none!important;
	}
}

@media (min-width: 768px) {

	.d-md-block {
	    display: block!important;
	}

	.d-md-none {
	    display: none!important;
	}
}

@media (min-width: 992px) {

	.d-lg-block {
	     display: block!important;
	}

	.d-lg-none {
	    display: none!important;
	}
}

@media (min-width: 1200px) {

	.d-xl-block {
	     display: block!important;
	}

	.d-xl-none {
	    display: none!important;
	}
}

下記のような HTML を出力するので問題ないと思います。
<div class="d-block d-sm-none d-md-block d-lg-none d-xl-block widget widget_pudge" id="pudge-8">

• この返信は4年前にDRILL LANCERが編集しました。

[momo]

DRILL LANCERさん、ご対応ありがとうございました！

[momo]

kurudriveさん

下記の件

＞おそらくですが、DRILLさんのソースコードだとどれか一つのサイズで非表示になってしまい、
＞その指定クラスの影響でをうけてしまうのだと思います。

について質問相談です。

DRILL LANCERさんのfunction.phpに追記する件は、今朝の時点で既に修正して頂いておりますが、
いずれにしても、御社の「ブロック出し分け機能」に対して、このfunction.phpカスタマイズが干渉する関係性は
変わらないような気がします。（素人空想）
私の昨日の実験でも、iPhone出し分け不良が出た時は、両方の機能に出たと思うので、function.phpに
記載した事項がVektorさんの出し分け機能よりも強い作用した印象があります。

そうなるとVektorさんのテーマ側のブロック出し分け機能だけにしないと、この先スマホサイズが更に
増えた場合など、つまり出し分け機能に影響がある世の中の変更が出た都度、なんらかの注意が必要になってきます。

この場合は、Vektorさんのブロック出し分けに頼り、サイドバーのウイジェットは固定ページ表示ウイジェットに
すべきかも知れないのですが、ブロックもウイジェットもDRILL LANCERさんの手法で一括で出し分け対応が
出来たら最強な気もします。

技術力が無い私の立場としては、DRILL LANCERさんの手法がVektorさんのテーマに組み込まれたら
ウイジェットの出し分けもブロック出しわけも揃って一番シンプルです。

しかし、現在Vektorさんが取られたブロック出し分け手法（内容はサッパリ理解できてません）が、
Vektorさんとしては、DRILL LANCERさんの案を見た今の時点でも、御社方式が一番良い方法と判断される
のであれば、Lightningユーザーであり、自力で問題解決する技術力が無い私としては、
Vektorさんのブロック出し分け機能と固定ページウイジェットの組み合わせでサイドバーウイジェットの
出し分けを利用する方向になるのかも知れません。

と言う事で、DRILL LANCERさんの方式をfunction.phpに入れたままでは、御社の出し分け機能に
影響を及ぼすのかどうか知りたいです。
もちろん今の時点では、DRILL LANCERさんが敏速に修正してくださったので、影響しているとしても
結果はVektorさん機能と、DRILL LANCERさん機能が一致しているから問題ないとは思うのですが。

[DRILL LANCER]

私は bootstrap のに搭載されたものを使用していて、VK Block Pro は独自に定義されたクラスを使用しています。
bootstrap の方では !important がついており、VK Block Pro はついていないため私のほうが強くなるのは現状での仕様です。

また、私が干渉している部分はウィジェット全体であり、VK Block Pro + VK 固定ページ本文 が干渉しているのは中身の部分です。

例えば私のコードだとウィジェットのタイトルを消せますが、VK Block Pro + VK 固定ページ本文 の場合はウィジェットのタイトルは残ると思います。

• ウィジェットをまるごと消したいのであれば私のコードで非表示
• ウィジェットの中身の一部分を消したいのであれば VK Block Pro + VK 固定ページ本文 を使用

というわけで、併用＆使い分けは一応可能です。

私のコード と VK Block Pro + VK 固定ページ本文 を併用した例

<!-- ウィジェットの HTML 開始 -->
<!-- 私はここで表示・非表示を制御 -->
<div class="d-block d-sm-none d-md-block d-lg-none d-xl-block widget widget_pudge" id="pudge-7">
	<div id="widget-page-2270" class="widget_pageContent entry-body">
		<!-- 固定ページ本文開始 -->
		<!-- VK Blocks Pro の表示・非表示の制御領域開始 -->
		<!-- 私の設定項目で非表示の場合は問答無用で表示されない -->
		<p style="color:#ffffff" class="has-text-color has-background has-text-align-center has-vivid-red-background-color vk_hidden-xl vk_hidden-lg vk_hidden-md vk_hidden-sm">xs</p>
		<p style="color:#ffffff" class="has-text-color has-background has-text-align-center has-luminous-vivid-orange-background-color vk_hidden-xl vk_hidden-lg vk_hidden-md vk_hidden-xs">sm</p>
		<p style="color:#ffffff" class="has-text-color has-background has-text-align-center has-luminous-vivid-amber-background-color vk_hidden-xl vk_hidden-lg vk_hidden-sm vk_hidden-xs">md</p>
		<p style="color:#ffffff" class="has-text-color has-background has-text-align-center has-light-green-cyan-background-color vk_hidden-xl vk_hidden-md vk_hidden-sm vk_hidden-xs">lg</p>
		<p style="color:#ffffff" class="has-text-color has-background has-text-align-center has-pale-cyan-blue-background-color vk_hidden-lg vk_hidden-md vk_hidden-sm vk_hidden-xs">xl</p>
		<!-- VK Blocks Pro の表示・非表示の制御領域終了 -->
		<!-- 固定ページ本文終了 -->
	</div>
</div>
<!-- ウィジェットの HTML 終了 -->

• この返信は4年前にDRILL LANCERが編集しました。
• この返信は4年前にDRILL LANCERが編集しました。
• この返信は4年前にDRILL LANCERが編集しました。

[momo]

DRILL LANCERさん、明快な回答をありがとうございます。

＞ウィジェットをまるごと消したいのであれば私のコードで非表示
＞ウィジェットの中身の一部分を消したいのであれば VK Block Pro + VK 固定ページ本文 を使用

そう言う使い分けで考えれば良いのですね。
そうするとウイジェットの一部分と言う可能性もあるので、汎用性を考えると私の場合は
「VK Block Pro + VK 固定ページ本文」
となりそうです。

この方法を使い込んだ場面を想像すると、修正作業の時には、

1、サイドバーウイジェットに私がどの固定ページを入れたかを思い出す
2、覚えてない場合は、ウイジェットを一度開いて固定ページ名を確認し、該当固定ページを開いて編集して。。。

となりますので、ウイジェットをダイレクトに編集する事が出来るDRILL LANCERさん方式の方が楽かも知れません。
でも、とりあえずは、上手に両機能を併用する自信がないので、今回はVektorさん純正の「VK Block Pro + VK 固定ページ本文」の方法で進めてみます。

DRILL LANCERさんの詳しい回答と、細かなご対応を感謝申し上げます。

[投稿者]

投稿