ブロックウィジェットでのgoogle検索
ブロックウィジェットでのgoogle検索
タグ: google検索
- このトピックには14件の返信、3人の参加者があり、最後に
komori0321により2年、 10ヶ月前に更新されました。
-
投稿者投稿
-
2021年10月13日 11:51 AM #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が2年、 11ヶ月前に変更しました。
-
このトピックは
石川@Vektor,Inc.が2年、 11ヶ月前に変更しました。
Attachments:
You must be logged in to view attached files.該当URL : https://*********※該当URLはフォーラムライセンスが有効のユーザーにのみ表示されます
2021年10月13日 12:12 PM #57107
うなこモデレーターテーマ側のtableの装飾のcssが入ってしまっているようでした。
以下のCSSを子テーマや追加CSSなどに追記しますと、消えますか?.gsc-search-box td{ border: none; padding: 0; } .gsc-search-box .gsc-input{ margin-bottom:0; }
githubのLightningのissueをたてました
-
この返信は2年、 11ヶ月前に
うなこが編集しました。
2021年10月13日 12:34 PM #57114
komori0321参加者うなこ様
いつもありがとうございます
子テーマのcssに追記しています表示は統一されましたが
やけに細くなりました
確認願います>githubのLightningのissueをたてました
了解しました-
この返信は2年、 11ヶ月前に
komori0321が編集しました。
2021年10月13日 1:39 PM #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; }
-
この返信は2年、 11ヶ月前に
うなこが編集しました。
2021年10月13日 2:32 PM #57122
komori0321参加者うなこ様
何度もすみません
頂いたcssに修正したところ
cssを追加しないときと同じようになります。
現在、下記を追記した状態です追加scc
>.gsc-search-box td{
>border: none;
>}
>.gsc-search-box td.gsc-input{
>margin-bottom: 0;
>padding: 0 12px 0 0;
>}2021年10月13日 2:52 PM #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; }
-
この返信は2年、 11ヶ月前に
うなこが編集しました。
2021年10月13日 3:18 PM #57128
komori0321参加者うなこ様
お世話になります
うまく表示されるようになりました
お手数をおかけしました。
ありがとうございます>githubのLightningのissueをたてました
修正可能でしたら よろしくお願いします2021年10月13日 4:33 PM #57130
komori0321参加者うなこ様
お世話になります
今気が付いたのですが
もともと表示が大きくなっていたページでは
検索文字を入力した瞬間に、厚みが倍近くに変化します文字入力後 厚みがますページ
正常ページご連絡まで
2021年10月13日 5:24 PM #57132追加した検索関連CSSを削除した上で、
新規に作成した空のページで症状は発生しますか?2021年10月13日 5:45 PM #57134
komori0321参加者石川様
お世話になります
>追加した検索関連CSSを削除した上で、
>新規に作成した空のページで症状は発生しますか?別のtestサイトで試してみました
新規で2ページほど作成してみましたが今のところ正常表示です
現象の出るページを再作成の必要があるのでしょうか?-
この返信は2年、 11ヶ月前に
komori0321が編集しました。
2021年10月13日 5:48 PM #57135症状の出るページの中身に問題がある可能性があります。
新規作成して正常に表示されているページに症状の出ているページの中身を貼り付けてみて、不具合が発生するか確認してみてください。
発生する場合は再度中身を削除して 少しずつ追加してみて、原因となるブロックを特定してみてください。
2021年10月13日 6:05 PM #57138
komori0321参加者石川様
お世話になります
>新規作成して正常に表示されているページに症状の出ているページの中身を貼り付けてみて、不具合が発生するか確認し>てみてください。
>発生する場合は再度中身を削除して 少しずつ追加してみて、原因となるブロックを特定してみてください。
→私の時間的な問題で、作業は来週になると思います
結果 連絡しますとりあえずは うなこ様に教えていただいたcssで回避しておこうと思います
うなこ様、石川様
お手数をかけました。ありがとうございます
小森
2021年10月14日 9:49 AM #57151
komori0321参加者石川様
うかこ様お世話になります
少し時間ができたのでtestしてみました
結果
通常のテーブルブロックを使うとこの現象は起こるようです
テーブルブロックを削除すると正常表示です
下記参考testページ(テーブルブロック組込中)
よろしくお願いします
尚
ページを新規で作成しても同様です-
この返信は2年、 11ヶ月前に
komori0321が編集しました。
2021年10月19日 1:02 AM #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; }
-
この返信は2年、 10ヶ月前に
石川@Vektor,Inc.が編集しました。
2021年10月19日 9:18 AM #57304
komori0321参加者石川様
お世話になります
お手数をおかけしました>ただ、 Google 検索については Lightning のユーザー全員が設置するものではないので、
>Lightning側での対応ではなく、下記のCSSを追加CSSなどに記載してご利用お願いいたします。了解しました。ありがとうございます
sccをはめ込んでの表示結果
・テーブルブロックを使ったページでgoogle検索を設置した時、検索文字入力エリアに罫線が表示され大きくなる
→上記現象はなくなり、通常の表示になりました
・検索文字を入力した瞬間に、厚みが倍近くに変化します(テーブルブロックを使った時)
→うなこ様にいただいたcssと同様に厚みは変化します結果 弊社のページでの表示は、うなこ様にいただいたcssと同様の表示です。
報告まで ありがとうございました
-
このトピックは
-
投稿者投稿
- このトピックに返信するにはログインが必要です。
- トピックタグ
- google検索