Y.INABA
フォーラムへの返信
-
投稿者投稿
-
Y.INABA参加者nao 様
タクソノミー「分類_自社」について、タクソノミースラッグに余計な半角スペースが入り込んでおり、これが原因と思われます。
よって、タクソノミーの設定についてご確認・再設定いただき、必要に応じてフォームを一度作り直してみてはいかがでしょうか。※つまり、本件においてカスタム投稿タイプは無関係です。
【補足】
タクソノミースラッグ等が正常に設定できていれば、「在庫_自社」のように半角スペースは入り込まないはずです。
(スクリーンショット2枚目参照)Attachments:
You must be logged in to view attached files.
Y.INABA参加者pepepe 様
ひとまずは解決いただけて何よりです。
ただ、順番を変えた方が良いというのは一つの応急処置案というべき内容で、本線は括弧の閉じ忘れによる誤作動、誤認識と思われます。
(ただし、情報の整理のためにも順番を意識した方が良いのは確かですので、そこは認識ください)▼上でも軽く触れましたが、以下閉じ忘れが残ったままなので修正ください。
/* --- モバイル(991.98px以下)の設定 --- */ @media (max-width: 991.98px) { body, html { font-size: 15px; letter-spacing: 1px; } } /* ←不足していた閉じカッコを追加 */ /* --- タブレット・PC(768px以上)の設定 --- */ @media (min-width: 768px) { .gMenu li li { background-color: #d7bc8f; } .gMenu li li a:hover { background-color: #f0e7d4; } .gMenu > li:before, .gMenu > li.menu-item-has-children::after { border-bottom-color: #d7bc8f; } } /* ←不足していた閉じカッコを追加 */
Y.INABA参加者pepepe様
確認しました。
結論、コードを挿入する場所が明らかに間違っています。media (max-width: 991.98px){ body, html { font-size: 15px; letter-spacing: 1px; } /*【非反映】WORKS、EVENTのタイトル・メタ情報を非表示*/ article.works div.entry-meta, article.event div.entry-meta { display:none !important; }これだとタブレット環境以下のみの条件として処理されることになるため、PC環境で表示されても文句は言えません。
※おそらく冒頭のご質問の事象も同じ事が要因ではないでしょうか?
※もし上記mediaの{}括弧が閉じ忘れであれば、ご対応ください。
※細かくは確認していませんが、全体を通して他にも{}括弧の閉じ忘れの可能性もございます。念のためご確認ください。body, html { font-size: 20px; }試しに、冒頭のこの下に記載場所を変えてみて、動作しますでしょうか?
—
拡張機能をすべてオフにする、というのはプラグインをすべて無効化にするということでしょうか?
拡張機能というのは通常ブラウザの拡張機能を指します。
たまにではありますが、ブラウザの拡張機能が要因で誤作動が起こることがあります。
Y.INABA参加者pepepe 様
ご対応ありがとうございます。
非表示が反映されていないとのことですが、少なくともこちらからだと問題なく反映されておりますね。
拡張機能が邪魔しているとか、pepepe様環境が原因の可能性が考えられるかと思います。試しに、拡張機能を全てオフにしていただくか、もしくは全く違うブラウザや普段とは異なる環境からアクセスしてみてはいかがでしょうか?
Attachments:
You must be logged in to view attached files.
Y.INABA参加者pepepe 様
ソースを確認する限り、以下で問題ないかと思います。
/*WORKS、EVENTのタイトル・メタ情報を非表示*/ article.works div.entry-meta, article.event div.entry-meta { display:none; }※もし効き目がなかったら
display:none !important;に変更をお願いします。
※確認する際は、CSS変更後にキャッシュを一度クリアしてからご確認いただく・もしくはスーパーリロードにてご確認いただくことをおすすめします。——
モバイルではタイトルが出ないが、パソコンではタイトルが出る
ソースをよく見れば分かりますが、以下のコードは投稿日・最終更新日等のメタ情報のみを非表示化するものです。
タイトルには.entry-meta_itemsのクラスが指定されていませんので、当然有効ではありません。/*EVENTのタイトルをPC以外非表示*/ .event .entry-meta_items { display: none; } /*WORKSのタイトルをPC以外非表示*/ .works .entry-meta_items { display: none; }
Y.INABA参加者leafletweb 様
ご確認ありがとうございます。
解決できて何よりです。スキンについて失念しておりました。大変失礼いたしました。
おっしゃる通り、OriginIIIでは上記コードだと縁が出てきますね。
解決策について、自己解決いただきありがとうございます。なお、お手数ですがお手すきの際にベストアンサーを設定いただけますと幸いです。
Y.INABA参加者leafletweb 様
カスタマイザー等の範囲では当該の設定ができませんので、追加CSSにて以下のコードを挿入いただく必要がございます。
・ほんの一例です。幅・高さなどは60ピクセルの設定にしておりますが、適宜変更いただければと思います。
・モバイル環境でも同じ幅・高さになりますので、もし振り分けが必要であれば、さらにCSS追加する必要がございます。▼追加CSS内容(一例)
a.page_top_btn { background-image: url(画像のURL); margin: 0; padding: 0; border-radius: 0; border-width: 0; width: 60px; height: 60px; background-size: 100%; background-color: transparent; }Attachments:
You must be logged in to view attached files.
Y.INABA参加者石川 様
お世話になっております。
こちらも迅速にご対応いただきありがとうございます。意図通り動作すること、確認させていただきました。
今後ともどうぞよろしくお願いいたします。
Y.INABA参加者開発の方へ。
本事象、VK Blocks 1.116.0で導入した以下新機能が要因と思われます。
・VK Blocks 1.116.0 ではWordPress 標準のグループブロックで横スクロールができるようになりました
実際、属性名が表とグループブロックで同一になっており、しかもグループブロック側では例外処理がある旨も記載されていることから、副作用として表にも横スクロール無効化となるように処理されてしまっているものと思われます。
こちらについて早急に処理を見直していただき、表とグループブロックで処理を分けていただくようお願いいたします。
【追記】3枚目のスクリーンショットは2枚目のスクリーンショットに赤枠を注釈として記載したのみとなります。2枚目は余分です。大変失礼いたしました。
Attachments:
You must be logged in to view attached files.
Y.INABA参加者pepepe様
ナビゲーション等のブロックを選択いただき、以下ではいかがでしょうか?
selector a:hover { text-decoration: none; }※以下記載だと
text-decoration: none;がaタグ(リンク部分)に直接作用せず、意図通りには動きません。元々のCSSの記載のa:hoverが優先されることになります。selector:not(.wp-element-button):not(.wp-block-pages-list__item__link):hover { text-decoration: none; }Attachments:
You must be logged in to view attached files.
Y.INABA参加者runbird 様
念のため確認ですが、添付のスクリーンショットの箇所(カスタマイザー内)は確認しておりますか?
よく確認せずに画像だけ消してしまったのではないでしょうか?カスタマイザーを見れば分かるように、透過ヘッダー使用時のみ別の画像を使用することが可能となっており、初期設定が残ったままになっていると思われます。
一度ご確認よろしくお願いいたします。
▼確認場所
カスタマイザー>Lightning ヘッダー設定>ヘッダー透過>透過時 ヘッダーロゴ画像Attachments:
You must be logged in to view attached files.
Y.INABA参加者石川 様
お世話になっております。
エラー文が非表示になっていることを確認しました。ご対応いただきありがとうございました。
Y.INABA参加者ご確認ありがとうございます。
以下でご確認よろしくお願いいたします。1. 該当のメニュー箇所のみ抜き出して、Lightning Block Template Partsに名前を付けて登録する(必ず「公開」までお願いします)。
2. カスタマイザー > Lightning ヘッダー設定 > Block Template Parts で先ほど保存したテンプレートパーツ名を選択。
3. カスタマイザーの「保存」を押下。こちらで、ヘッダーのメニューのみスライダーの上部に表示されるようになるかと思います。
以下の記事もご確認よろしくお願いいたします。
・ブロックテンプレートパーツ機能 | Lightning G3 Pro Unit とは | Lightning
【追記】石川様からのご返答とは方向性が異なりますので、どちらか合う方を採用いただければと思います。
Attachments:
You must be logged in to view attached files.
Y.INABA参加者横からすみません。
添付のスクリーンショットのとおり、該当のスライダー箇所を選択し、消すなり編集するなりすればOKと思われますが、いかがでしょうか?
※パターンライブラリはあくまでもブロックエディターで使えるブロックの組み合わせを提供しているに過ぎませんので、後からブロックの配置や並び等変更いただいても問題はございません。
※該当スライダーもVK Blocksのスライダーブロックを編集したものに過ぎません。気に入らなければ、自由に修正・削除してOKです。
Attachments:
You must be logged in to view attached files.
Y.INABA参加者Takatoshi 様
トレタ様のサービスについて見識があるわけではないですが、指定箇所にフォームを挿入するにあたってCSSやJS、HTMLを挿入すれば表示可能という認識でよろしいでしょうか。
《ご参考》予約ウィジェット設定 – Shopify Communityその上で答えるのですが、以下のコードでトップページ内に出力するようにしたと思われるJavaScriptコードが上記URL内に見当たらなかったのですが、ご確認いただけますでしょうか。
1. functions.php に以下のコードを追加しました:
php function toreta_reservation_widget_script() { if (is_front_page() || is_home()) { // JavaScript コード // document.getElementById(‘trt-reservation-widget’) を探して // 予約フォームのHTMLを動的に生成する処理 } } add_action(‘wp_footer’, ‘toreta_reservation_widget_script’, 999);なので、
【問題】 ブラウザのコンソールを確認すると、以下のメッセージが繰り返し表示されます:
⏳ Widget container not found, retrying…
つまり、JavaScript は実行されているものの、document.getElementById(‘trt-reservation-widget’) が null を返しています。上記症状と思われる記載も別のJSのものではないでしょうか?
<div id=”trt-reservation-widget”></div>上記の記述も、ご認識のとおり見当たりません。
ただ、恐れ入りますが、ダブルクオーテーションの記号が誤っており、正しくは以下ではないでしょうか?<div id="trt-reservation-widget"></div>なお、以下エラーについて懸念されておりますが、結論から申し上げると、本症状には無関係の可能性が高いです。
Uncaught SecurityError: Failed to read a named property ‘document’ from ‘Window’:
Blocked a frame with origin “https://imagine-test.com” from accessing a cross-origin frame.
このエラーは VK プラグインまたは Lightning テーマ由来のもので、Toreta ウィジェットとは無関係と思われますが、JavaScript 実行に影響している可能性があります。ページ下の方、Google Map表示の際にiframeを使用しているので、そのために表示されているエラーだと思われます。
《ご参考》ブラウザがjsからiframeのエレメントへのアクセスのブロック現象及び解決方法 | 古松こちらで回答できることとしては以上となります。
ただ、以下のご質問は、質問内容やご共有いただいている内容を見る限り、Lightningに限らず発生しうる問題と思われます。Lightning テーマで TOPページにカスタムHTMLブロックを追加した場合、JavaScript から document.getElementById() で要素を取得できない理由はありますか?
Lightning または VK プラグインが DOM の読み込みタイミングに影響を与えている可能性はありますか?
TOPページで外部ウィジェットを正しく動作させるための推奨方法があれば教えてください。
冒頭のShopifyコミュニティでも回答者がおっしゃっているとおり、まずはトレタ様のサポートにお尋ねいただく方が解決が早いかと思います。
(もしくは、wp_footerがWordPress汎用のフック、カスタムHTMLも汎用ブロックであるため、WordPress公式フォーラムでお尋ねいただいても良いかもしれません) -
投稿者投稿
