[ 質問者返信待ち ] ブロックウィジェットでのgoogle検索

VWSとは フォーラム Lightning [ 質問者返信待ち ] ブロックウィジェットでのgoogle検索

[ 質問者返信待ち ] ブロックウィジェットでのgoogle検索

タグ: 

15件の投稿を表示中 - 1 - 15件目 (全15件中)
  • 投稿者
    投稿
  • #57102

    komori0321
    参加者

    ■ WordPress のバージョン
    5.8.1

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Lightning ( G3 ) + Lightning G3 Pro Unit

    ■ テーマのバージョン
    14.11.4

    ■ Pro Unit のバージョン
    0.12.0

    ■ スキンの種類
    Origin III

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ 期待する動作
    正常な表示

    ■ 自分で試した事
    可能な限りのプラグインの停止

    ■ 症状が発生するブラウザ
    Edge Chrome safari(iphone)

    ■ 実際の症状
    ページにより
    検索文字の入力領域以外に枠が表示されてします
    TOPページとtop直下のページは正常と思われる
    3層目以降の表示で意図しない表示になります

    画像を添付します
    回避方法をご助言願えれば幸いです
    よろしくお願いします

    • このトピックはkomori0321が1週、 1日前に変更しました。
    • このトピックは石川@Vektor,Inc.が1週、 1日前に変更しました。
    Attachments:
    You must be logged in to view attached files.

    該当URL : https://*********

    ※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます

    #57107

    うなこ
    モデレーター

    テーマ側のtableの装飾のcssが入ってしまっているようでした。
    以下のCSSを子テーマや追加CSSなどに追記しますと、消えますか?

    .gsc-search-box td{
    border: none;
    padding: 0;
    }
    .gsc-search-box .gsc-input{
    margin-bottom:0;
    }

    githubのLightningのissueをたてました

    • この返信は1週、 1日前にうなこが編集しました。
    #57114

    komori0321
    参加者

    うなこ様

    いつもありがとうございます
    子テーマのcssに追記しています

    表示は統一されましたが
    やけに細くなりました
    確認願います

    >githubのLightningのissueをたてました
    了解しました

    • この返信は1週、 1日前にkomori0321が編集しました。
    #57120

    うなこ
    モデレーター

    ほんとですね、、tableが入子になっているようで、 中のtd全体のpaddingを0にしてしまっていました。
    以下のCSSでいかがでしょうか。まだ変でしたら教えてくださいmm

    .gsc-search-box td{
    border: none;
    }
    .gsc-search-box td.gsc-input{
    margin-bottom: 0;
    padding: 0 12px 0 0;
    }
    • この返信は1週、 1日前にうなこが編集しました。
    #57122

    komori0321
    参加者

    うなこ様

    何度もすみません
    頂いたcssに修正したところ
    cssを追加しないときと同じようになります。
    現在、下記を追記した状態です

    データ消去装置 PRO-S01

    追加scc
    >.gsc-search-box td{
    >border: none;
    >}
    >.gsc-search-box td.gsc-input{
    >margin-bottom: 0;
    >padding: 0 12px 0 0;
    >}

    #57123

    うなこ
    モデレーター

    こちらこそすみません!同じクラス名がついているので、間違えてしまいました。。m(_ _)m
    おそらく以下のCSSで大丈夫だと思います。

    .gsc-search-box td{
    border: none;
    }
    .gsc-search-box td.gsc-input{
    padding: 0 12px 0 0;
    }
    .gsc-search-box table.gsc-input{
    margin-bottom: 0;
    }
    • この返信は1週、 1日前にうなこが編集しました。
    #57128

    komori0321
    参加者

    うなこ様

    お世話になります
    うまく表示されるようになりました
    お手数をおかけしました。
    ありがとうございます

    >githubのLightningのissueをたてました
    修正可能でしたら よろしくお願いします

    #57130

    komori0321
    参加者

    うなこ様

    お世話になります
    今気が付いたのですが
    もともと表示が大きくなっていたページでは
    検索文字を入力した瞬間に、厚みが倍近くに変化します

    文字入力後 厚みがますページ

    データ消去装置 PRO-S01


    正常ページ

    HOME

    ご連絡まで

    #57132

    追加した検索関連CSSを削除した上で、
    新規に作成した空のページで症状は発生しますか?

    #57134

    komori0321
    参加者

    石川様

    お世話になります

    >追加した検索関連CSSを削除した上で、
    >新規に作成した空のページで症状は発生しますか?

    別のtestサイトで試してみました
    新規で2ページほど作成してみましたが今のところ正常表示です
    現象の出るページを再作成の必要があるのでしょうか?

    testサイト

    • この返信は1週、 1日前にkomori0321が編集しました。
    #57135

    症状の出るページの中身に問題がある可能性があります。

    新規作成して正常に表示されているページに症状の出ているページの中身を貼り付けてみて、不具合が発生するか確認してみてください。

    発生する場合は再度中身を削除して 少しずつ追加してみて、原因となるブロックを特定してみてください。

    #57138

    komori0321
    参加者

    石川様

    お世話になります
    >新規作成して正常に表示されているページに症状の出ているページの中身を貼り付けてみて、不具合が発生するか確認し>てみてください。
    >発生する場合は再度中身を削除して 少しずつ追加してみて、原因となるブロックを特定してみてください。
    →私の時間的な問題で、作業は来週になると思います
    結果 連絡します

    とりあえずは うなこ様に教えていただいたcssで回避しておこうと思います

    うなこ様、石川様

    お手数をかけました。ありがとうございます

    小森

    #57151

    komori0321
    参加者

    石川様
    うかこ様

    お世話になります
    少し時間ができたのでtestしてみました
    結果
    通常のテーブルブロックを使うとこの現象は起こるようです
    テーブルブロックを削除すると正常表示です
    下記参考testページ(テーブルブロック組込中)

    データ消去装置 PRO-M02


    よろしくお願いします
    尚 
    ページを新規で作成しても同様です

    testサイト

    • この返信は1週前にkomori0321が編集しました。
    #57299

    原因としては

    * google検索が table タグで構成されている
    * Lightning が table タグに対して余白を設定している
    * CSS最適化を有効化していると table が存在しないページでは table タグに余白を付与する CSS が出力されない → Google検索の表示が正常に見える

    という現象でした。

    ただ、 Google 検索については Lightning のユーザー全員が設置するものではないので、
    Lightning側での対応ではなく、下記のCSSを追加CSSなどに記載してご利用お願いいたします。

    body .gsc-control-cse{
    padding:0;
    }
    .gsc-search-box td{
    border: none;
    }
    .gsc-search-box td.gsc-input{
    padding: 0 12px 0 0;
    }
    .gsc-search-box table.gsc-input{
    margin-bottom: 0;
    }
    .gsc-search-box td.gsc-search-button{
    padding:0;
    }
    #57304

    komori0321
    参加者

    石川様

    お世話になります
    お手数をおかけしました

    >ただ、 Google 検索については Lightning のユーザー全員が設置するものではないので、
    >Lightning側での対応ではなく、下記のCSSを追加CSSなどに記載してご利用お願いいたします。

    了解しました。ありがとうございます

    sccをはめ込んでの表示結果
    ・テーブルブロックを使ったページでgoogle検索を設置した時、検索文字入力エリアに罫線が表示され大きくなる
    →上記現象はなくなり、通常の表示になりました
    ・検索文字を入力した瞬間に、厚みが倍近くに変化します(テーブルブロックを使った時)
    →うなこ様にいただいたcssと同様に厚みは変化します

    結果 弊社のページでの表示は、うなこ様にいただいたcssと同様の表示です。

    報告まで ありがとうございました

15件の投稿を表示中 - 1 - 15件目 (全15件中)
  • このトピックに返信するにはログインが必要です。