うなこ
フォーラムへの返信
-
投稿
-
スライダーアイテムにOuterを重ねてみたが、スライドショーが全幅にならなかった(方法が分からない)ので、うまくいく方法があれば教えてほしい
Outerを入なくても、スライダーアイテムに背景画像を設置することができます
【スライド設定> エフェクトをフェードに設定する】
参考サイトのようにするなら、エフェクトをフェードにします。
スライダーを全幅で設置して、親のスライダーを選択して、右側のスライダーの設定画面から【スライド設定】> 「エフェクト」を「フェード」にします。【スライダー全幅でスライダーアイテムに背景画像を設置】
※添付画像参照
スライダーアイテムを選択しますと、右側のスライダーアイテムのブロック設定画面に【背景設定】が出てきます。背景画像（PC）、背景画像 ( タブレット )、背景画像 ( モバイル )が設置できますので、お好みで設置してください。
背景画像サイズは、「カバー」にすると、画像が見切れずに配置できます。【スライドアイテム内に画像を配置】
今回はPCとスマホで画像を出しわけしたいということですので
スライドアイテム内にPC用の画像とスマホ用の画像を配置します。ブロックごとに「非表示設定」機能がありますので、
PCサイズ用の画像は、非表示 ( 画面サイズ : sm ) 非表示 ( 画面サイズ : xs )」をオンにして、スマホサイズ用の画像は、非表示 ( 画面サイズ : xxl )、非表示 ( 画面サイズ : xl )、非表示 ( 画面サイズ : lg )、
非表示 ( 画面サイズ : md )をオンにすると、切り替えて表示できます。
※全部のスライダーアイテムに、同じ画像を配置する感じになります。フェードになっているので、後ろの背景だけが切り替わっているように見えると思いますがいかがでしょうかポイントは、まずはスライダーアイテムを1つ目を完成させて、2つ目からは複製してアイテムを増やすと背景画像を差し替えるだけなので作業が楽かもしれません。
▼▼▼参考ページ▼▼▼
お世話になっております。
クラス名が違っていたり、calcの計算のマイナスが全角になっているようです。
クラス名は以下になります。
/*幅を調整*/
@media (min-width: 992px){
.main-section–col–two{
width: 82.5%;
}
.sub-section–col–two {
width: calc(17.5% – 2rem);
}
}【テキストファイルが添付できない件につきまして】
error.txt ファイルがアップできないようですので、
お手数ですが、firestorage や おくりん坊 などのファイル転送サービスにテキストファイルをアップしていただき、URLを共有 という形になります私のKatawaraの環境では、症状が確認できませんでした。
VK Blocks Pro が最新バージョンではない場合は、更新をしてください（現時点ではバージョン 1.50.1.0 が最新）
——
VK Blocks Pro を更新しても症状が治らない場合は、以下のようにコードを共有していただけますでしょうか▼共有方法
該当のページの編集画面を開き、右上にある「三点リーダー」をクリックして、「コードエディター」にします。
コード表示された内容をコピーしていただき、フォーラムに貼り付けるか、error.txt などテキストファイルを作成して投稿に添付していただけますでしょうか？単純にカスタム投稿一覧ページをカード表示にしたい場合は「アーカイブページ設定」からできますが、
今回の場合は、「パターンライブラリ」のパターンを使用するということですので、その方法になると思います。もしくは、URLが二つになるのが嫌な場合は、アーカイブページ設定から「カード」表示にして、パターンに書いてあった「カスタムCSS」のCSSをアーカイブページ用に書き換えて、追加CSSなどにはりつけるという方法もあるかなと思います。
カスタマイズのスクロール時のロゴ、透過時のロゴを設定していますが、デフォルトサムネイル設定をすると、その画像がトップページ（ヘッダを透過）のヘッダロゴの上に重複して表示されるのを回避したい。
テキストだけですと、お互いの認識に食い違いがあるかもしれませんので、もし可能であれば、症状が確認できる画面のキャプチャなどを添付していただくことは可能でしょうか。
すこしお聞きしても良いでしょうか？
VKパターンライブラリ からではなく、1からVk スライダーブロックを配置した場合もエラーがでる、ということでしょうか—
もしほかの方で、同じような状況で「こうしたらエラーが解消された」などありましたら、お気軽にコメントください🙇♀️
いろんなブロックを置いて公開してみたら、スライダーブロックを置いたときエラーが出ます。
全然違う問題かもしれませんが、、
スライダーブロックに「ブロックのリカバリーを試行」ボタンが出ていたりしますか？
「ブロックのリカバリーを試行」ボタンがでているものは、全て「ブロックのリカバリーを試行」ボタンをクリックしてみてください。そうするとエラーが消えた方が過去にいらっしゃったので、一度ご確認くださいmm
現在は、bodyのfont-sizeは、デフォルトでは16px、991.98px以下では14pxになります。
body, html { font-size: var(--vk-size-text); } @media (max-width: 991.98px){ body, html { font-size: calc(var(--vk-size-text) * .875); } }いろいろ書き方はありますが、以下のCSSでいかがでしょうか
数字はお好みで変えてください。body, html { font-size: 18px; } @media (max-width: 991.98px){ body, html { font-size: 14px; } }—–
上記のCSSはbodyのfont-sizeを変えています。
「カスタム書式設定」機能や、ブロックスタイルを追加できる「カスタムブロックスタイル設定」という機能にCSSを追記して調整する方法もあります。
▼カスタム書式設定
▼カスタムブロックスタイル設定
CSSのカスタマイズ方法はこちらをご覧ください
▼できる！WordPressカスタマイズ #01 簡単なデザイン（CSS）カスタマイズ方法徹底解説カスタマイズ > 追加CSS に以下のCSSを追加すると非表示にできます。
そのほかの方法では、
VK Blocks Proのスライダーブロックを使用すれば、「スライド設定」>「ページネーションの種類」から非表示にできます。
スライダーブロックの方が柔軟なデザインか可能です。/*Lightningページネーションを非表示*/ .lightning_swiper-container .swiper-pagination{ display:none; }
