「スライダー」の検索結果
-
検索結果
-
返信が含まれるトピック: X-T9 トップページスライドショー モバイル用スライド画像設定について
Lightning 標準のスライドショーのようなカスタマイズ機能はありません。
フォーカルポイントの調整でうまくいく可能性がありますが、
まったく別の画像にしたい場合は、スライダーを複製して、
非表示設定を使ってPC・モバイルで出し分ければできます。■ WordPress のバージョン
WordPress 6.8.3■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
X-T9■ テーマのバージョン
バージョン: 1.37.2■ 期待する動作
Lightningユーザーでしたが、今回パターンライブラリーで素敵な「アーティスト」というデザインを見つけたので、推奨しているX-T9で制作しました。
Lightningのようにモバイル用の画像設定（画像添付します）ができると思っていたのですが、PC版スライダーのフォーカルで中央・左右を選択して表示となっていました。
モバイル版の画像設定をすることはできないのでしょうか。■ 自分で試した事
以前、回答されていた下記を試してみました。[ 解決済 ] スマホサイズでのスライダー画像表示の仕様について
■ 症状が発生するブラウザ
Chrome■ 実際の症状
上記の回答を参考にスライダーにはめてみましたがうまくいきませんでした。
アーティストのデザインがFVの左側にSNSアイコンを表示する形にするため、私の知識不足でうまくいかなかったのかもしれません。Lightningのように、カスタマイズから設定できるような仕様はないのか確認したいです。
■ WordPress のバージョン
6.8.3■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
確認しました。■ テーマの種類
その他■ 関連しそうなプラグインを一つずつ停止して症状が改善するか確認してください。
確認しました。■ プラグインの種類・バージョン
VK Blocks Pro 1.114.2.0■ 期待する動作
大変お世話になっております（齋木）スライダーブロックにおいて高さ指定のフィールドを空欄にしたら高さ指定がなくなる（auto 相当になる）と想像していたのですが、削除後保存しても高さのスタイルが出力されたままになっているようです。
その後該当の編集画面をリロードし高さ指定を確認すると、削除して保存したはずの値が入ったままになっており、「空欄にする＝削除」が無効なようです。
検索したところ「リセットボタン」の実装があるような記事も見たのですが（古い記事？）、そのようなボタンは見当たりませんでした。もしかしたら別の管理画面にそれらの設定があるのかもしれませんが、それを見つけられませんでした。
■ 自分で試した事
* VK Blocks Pro 以外のプラグインを停止し、スライダーブロックの高さ指定のフィールドを空欄にした■ 症状が発生するブラウザ
Google Chrome 142.0.7444.176■ 実際の症状
* スライダーブロックの高さ指定を削除しても、そのスタイルが出力されたままになっている■ WordPress のバージョン
6.8.2■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
15.30.1■ Pro Unit のバージョン
0.29.5■ スキンの種類
Origin III■ プラグインの種類・バージョン
VK Blocks Pro ver.1.109.2.0■ 期待する動作
投稿リストスライダーを使用しています。
表示タイプ：カード（線なし）
表示要素：画像、画像右上分類名、日付、新着表示ここから、画像右上に表示されている分類名（class=”vk_post_imgOuter_singleTermLabel”）
をしたの日付とタイトルが表示されている範囲（class=”vk_post_body card-body”）の中にいれて
タイトルの上に分類名を表示させたいです。■ 自分で試した事
CSSでの調整→レスポンシブで調整が難しい
テンプレートファイルの検索→見つかりませんでした■ 症状が発生するブラウザ
google chrome■ 実際の症状
上記の通り■ WordPress のバージョン
6.8.2■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
15.30.0■ Pro Unit のバージョン
0.29.4■ スキンの種類
Origin III■ 関連しそうなプラグインを一つずつ停止して症状が改善するか確認してください。
確認しました。■ プラグインの種類・バージョン
VK Blocks Pro 1.107.0.0■ 期待する動作
表示時間を 0 に設定して一定速度でスライダーを滑らかに動かしたい。■ 自分で試した事
とりあえず表示時間を 1 に設定して対策してあります。■ 症状が発生するブラウザ
ブラウザに依存しない■ 実際の症状
表示時間を 0 にしてもスライドが一時停止してしまう。https://patterns.vektor-inc.co.jp/vk-patterns/infinite-loop-slider/ のパターンを VK Blocks Pro 1.107.0.0 のサイトに貼り付けると現象を再現できます。
VK パターンライブラリ は VK Blocks Pro 1.104.0.0 になっているので、期待通りの動作をしています。
返信が含まれるトピック: 拡大アニメーションを使おうとすると「アイテムの複数表示設定」が消える
今日・明日あたりにリリース予定、とのことでしたので、VK Blocks 1.107.0.2 にアップデートした時点での感想を書かせていただきます。
仕様と動作がわかりづらい点が気になりました。
具体的には、以下の操作を行いました。
- EFECT を「スライド」に設定して、アイテムの複数表示設定を行う。
- ズームアニメーションを有効にする。
- EFECT が「フェード」に切り替わり、アイテムの複数表示設定の部分が非表示になる。
- EFECT を「スライド」に戻すと、アイテムの複数表示設定がまた表示される。
ということで、仕様としてはズームアニメーションが「フェード」「スライド」の両方に使えてアイテムの複数表示にも対応しているのに、ズームアニメーションを有効にすると「フェード」に切り替わるのは違和感がありますし、戸惑うユーザーがいると思います。（私は戸惑いました）
私としては「フェード」に切り替わらない方がいいように感じました。
それから、アイテムの複数表示＋ズームアニメーションの組み合わせが可能なので、ユーザーの中にはパターンライブラリの ↓ このパターンの「スライダーアイテムの中心が拡大」のような動きを期待(希望)する方が出てくるだろうと思いました。
返信が含まれるトピック: 拡大アニメーションを使おうとすると「アイテムの複数表示設定」が消える
日頃より、VK Bloxks Proをご利用いただきありがとうございます。
拡大アニメーション機能を使用する際に「アイテムの複数表示設定」が消える現象について、こちらは仕様による動作でした。
ただし、ご指摘の通りわかりづらい部分であり、改善を検討いたしますので今しばらくお待ちいただけますと幸いです。## 原因と理由
ズームアニメーショントグルをONにした時点でフェードエフェクトに切り替わるようにしておりました。これは、一般的にズームスライダーが使われる場面ではフェードエフェクトが主流であることを見受けられたためです。
フェードエフェクトでは複数のスライドを同時に表示できないため、「アイテムの複数表示設定」が利用できません。
そのため、結果的にズームアニメーションをONにした時に「アイテムの複数表示設定」が表示されないようになっておりました。
なお、エフェクトをスライドに戻すことは可能です。## 改善検討内容
ズームアニメーションのトグル近くに、エフェクトの設定がフェードに変わることやその影響を説明するメッセージを追加しようと思います。
https://github.com/vektor-inc/vk-blocks-pro/issues/2649どうぞよろしくお願いいたします。
返信が含まれるトピック: NPO法人 フリースクールのパフォーマンス（PSIモバイル-LCP）
横から失礼します。
ご自身でできることもまだあるのではないかと思います。
パッと思いつくものでは、
スライダーをやめる、
アニメーションをやめる、
WebP画像を使用する、
スマホ用の画像 (ダウンロードされたものをそのままお使いなのでしたら、幅が748pxあります。スマホならもっと小さくても問題ありません) をリサイズする、など。
また、PSIは計測した機器や場所にも依存しますし、多くの方が誤解されています。ページスピードの専門家の方がお書きになった以下の記事が勉強になりますので、ぜひ読んでみてください。
返信が含まれるトピック: NPO法人 フリースクールのパフォーマンス（PSIモバイル-LCP）
> お忙しいところ恐縮ですが、これらの提案について、貴社テーマ・プラグインで対応可能かどうか、または他に推奨されるアプローチがございましたら、ご教示いただけますと幸いです。
表示速度の改善については前向きに検討させていただきますが、
スライダーの件や分割読み込みなども、できていないにはできていないなりの理由があって現在の仕様になっています。
現段階でテーマ・プラグインで対応可能な部分を改めて調査するのにも工数が必要なため、前向きに検討・改善したい
とは思いますが、先述の通り現状溜まっているタスクがありますので、
今すぐに対応・調査する事もできない
ので、弊社の対応時期や具体的なアプローチ・回答は現段階ではできません。
何卒ご理解のほどよろしくお願いいたします。
返信が含まれるトピック: NPO法人 フリースクールのパフォーマンス（PSIモバイル-LCP）
石川様、お世話になっております。
ご返答いただきありがとうございました。「具体的に弊社テーマ・プラグインでできそうな事がありましたらその旨ご連絡くださいませ」とのお言葉を受け、PageSpeed Insights (PSI) の詳細な診断結果から、貴社テーマ・プラグインに関連すると思われるレンダリングブロックの原因を特定し、いくつかの技術的な改善提案をまとめましたので、ご回答させていただきます。
【現在の状況の再確認】
モバイルLCPが約15秒と非常に高く、そのうち「レンダリング遅延」が約10秒を占めています。
WP Fastest CacheのHTML/CSS/JS縮小・統合、Gzip、Delay JSなど、可能な限りの最適化は全て有効にしております。
LightningテーマのCSS最適化は無効化しています。
【PSIレポートで特定された貴社テーマ・プラグイン関連の主なレンダリングブロックリソース】
PSIの「レンダリングを妨げるリソースの除外」セクションにて、以下のファイルが継続的に指摘されており、これらがLCPのレンダリング遅延の主要因であると判断しております。https://minnano-piano.org/wp-content/plugins/lightning-g3-pro-unit/inc/vk-blocks/build/js/emjs.js (または類似のファイル名)
その他、vk-blocks/build/パスに含まれる複数の.jsおよび.cssファイル
これらのファイルは、スライダーがあるページだけでなく、スライダーがないページでも共通してレンダリングをブロックしており、サイト全体のモバイルLCPに悪影響を与えていると推測されます。
【ユーザーとSEOへの影響（LCPの重要性）】
現在のモバイルLCP約15秒という数値は、ユーザーにとって非常に長い待ち時間となり、ページの離脱率を高めるなど、ユーザー体験を著しく損ねる状況です。また、Googleは2021年以降、このLCPを含むCore Web Vitals（コアウェブバイタル）を検索ランキングの重要な要因の一つとしています。 LCPが基準値（2.5秒）を大きく超えることで、たとえ他のSEO対策が優れていても、検索順位において不利になる可能性があり、結果として潜在的なユーザーへのリーチが阻害されるという不利益を被っております。
これらの貴社テーマ・プラグインに関連するファイルがレンダリングをブロックし続けることは、私だけに留まらず、貴社製品を利用の全てのユーザー様が、ユーザー様の顧客体験の悪化とSEO上の深刻な不利益を直接的に被ることを意味し、貴社製品の品質に対する信頼にも関わる問題であると認識しております。
【貴社テーマ・プラグインで検討可能な具体的な改善提案】
WP Fastest Cacheのような外部最適化プラグインでは対応しきれない部分があるため、貴社テーマ・プラグインの内部ロジックで対応可能な以下の点について、ご検討いただけないでしょうか。クリティカルCSSの最適化:
ページの初期描画（ファーストペイント）に必要なCSS（クリティカルCSS）のみを自動的に抽出し、HTMLの<head>内にインラインで埋め込む機能、またはそのための仕組みを提供すること。これにより、外部CSSファイルの読み込みを待たずに、ページの主要部分がすぐに表示されるようになります。
残りのCSSは非同期で遅延読み込みさせることで、レンダリングブロックを大幅に削減できます。
JavaScript/CSSの条件付き読み込みの強化（Tree Shaking/Code Splitting）:
現在開いているページで実際に使用されているVK Blocksのブロックや機能に限定して、必要なJavaScriptとCSSのみを読み込むようにする仕組みを強化すること。
例えば、スライダーブロックが使われていないページではスライダー関連のJS/CSSを読み込まない、といった厳密な条件付き読み込みです。
また、大きなJS/CSSファイルを、より小さな機能単位に「コード分割（Code Splitting）」し、必要な時に必要なものだけを読み込むようにすることも有効です。
JavaScriptのより厳密な非同期/遅延読み込みの制御:
WP Fastest Cacheのような外部プラグインに依存せず、テーマ・プラグイン側でJavaScriptをenqueueする際に、より確実にasyncまたはdefer属性を付与するロジックを強化すること。
特に、初期描画に必須ではないJavaScript（例: スクロール時に発動するアニメーションなど）は、徹底的に遅延読み込みさせることで、メインスレッドのブロック時間を短縮できます。
これらの提案は、貴社テーマ・プラグインの構造を熟知されている開発チームであれば、より効果的に実装できる可能性があると考えております。
お忙しいところ恐縮ですが、これらの提案について、貴社テーマ・プラグインで対応可能かどうか、または他に推奨されるアプローチがございましたら、ご教示いただけますと幸いです。
当該貴社製品のすべてのユーザー様の顧客体験の向上とSEOパフォーマンスの改善のため、何卒ご検討のほどよろしくお願い申し上げます。
返信が含まれるトピック: ヘッダーに一瞬別の何かのヘッダーが表示される
先日ご相談させていただいた件について、無事に問題が解決しましたのでご報告いたします。
スライダーで読み込んでいる画像のうち、一つだけサイズが大きいものがあったため画像サイズを調整しましたが、ヘッダーのみのページにしても状況が変わらず、その後、クライアントへエックスサーバーの「XPageSpeed設定」で「CSSの最適化」をONにしていただいたところ、気になっておられた症状がすべて解消されたとの連絡をいただきました。
私自身、「XPageSpeed設定」という機能について今回初めて知ったのですが、実際に大きな改善効果があり、大変勉強になりました。
石川様、瀬戸内ことり様、お忙しい中、アドバイスいただきありがとうございました。返信が含まれるトピック: パターンライブラリのポートフォリオ_トップページで右側カラム内のボタン等が動かない
ベクトルスタッフの松田です。
日頃よりブロックパターンをご利用いただきありがとうございます。本件の症状を確認いたしました。
お手数をおかけし申し訳ございませんが、先ほどパターンライブラリにて修正を行いましたので、再度コピーいただけますと幸いです。なお、もし既に作り込んでいらっしゃる場合は、添付の画像を参考に、スライダーブロックのカスタムCSSで
selector .swiper-wrapperにpointer-events: none;を追加いただけたらと思います。本パターンは公開当初から最近まではご指摘いただいた状態でも問題なく動作しておりましたが、その後のブラウザやWordPressの仕様変更等の影響により、対応版のCSSを明示的に指定しないと同様の挙動にならなくなったようです。
メジャーアップデートのたびに表示や動作は都度確認しておりますが、今回のケースでは最新環境で仕様が変わった部分を取りこぼしてしまっておりました。このたびはご報告いただきありがとうございました。お手数をおかけしますが、ご確認いただけますと幸いです。
今後ともどうぞよろしくお願いいたします。■ WordPress のバージョン
WordPress 6.8.1■ テーマ・プラグインは全て最新版で確認してください。
確認しました。■ テーマの種類
Lightning ( G3 ) + Lightning G3 Pro Unit■ テーマのバージョン
15.29.9■ Pro Unit のバージョン
0.29.4■ スキンの種類
Origin III■ プラグインの種類・バージョン
VK All in One Expansion Unit
バージョン 9.109.0.1VK Block Patterns
バージョン 1.33.2.1VK Blocks Pro
バージョン 1.105.1.1■ 期待する動作
スプリットスクリーンのデザインを試したくパターンライブラリのポートフォリオ_トップページを利用してみました。
エディター画面では右側カラム内のボタン・リンク・投稿のアイキャッチなどマウスオーバーでカラーが変わるなど確認しましたが、固定ページを表示しても右カラムのスクロールはしますがマウスオーバーによる変化やボタンをクリックしても動作しません。
左カラムのリンクはマウスオーバーでカラーが変わりクリックによる動作もします。■ 自分で試した事
カラム外でボタンを作成し右側カラム内に移動すると同様に動作せず。
左カラムのスライダー内にボタンを移動すると正常動作します。
別環境でWordpress新規インストールから再度試しましたが症状変わらず。■ 症状が発生するブラウザ
Windows：chrome、Edge Mac：safari■ 実際の症状
上記パターンライブラリのページのサンプルも同様に右側カラム内のボタン等はマウスオーバーしてもクリックしても同様です。■ その他特記事項
エディター画面内で動作していることがわかるように画像添付いたします。よろしくお願いいたします。
返信が含まれるトピック: スライダーブロック設定方法
> デモサイト https://demo.dev3.biz/architect/ のように文字を左下側に配置し、
こっちは、スライダーアイテムを下揃えにして、
見出しの下にレスポンシブスペーサーを入れればできそうです。> 画面幅が狭くなると文字サイズも少しづつ小さくなるようにしたいのです。
こっちは、CSS を書く必要がありますので、
デモサイトをデベロッパーツールで調べてみてください。返信が含まれるトピック: 「トップページスライダー_左右が見切れている」で右側のスライダーアイテムが表示されなくなる場合がある
