-
検索結果
-
sakuraさん
セクションは上下に余白が入るのですが、私は余白をなくしたい時にセクションのブロック設定から高度な設定→追加CSSクラスに個別のCSSを付与した上で、padding-top: 0;とpadding-bottom: 0;で上下の余白を0にしています。
スライダーの下にセクションを設置する場合でも、スライダーをセクションの中に組み込むことでセクションとセクションの組み合わせになり、上下の余白なく設置することができることを確認しましたので、よければその方法でお試しくださいませ。
Who liked:
GONSY様 キタジマ様
返信ありがとうございます。まず、トピックを分けていなくて申し訳ありませんでした。
GONSYさんが教えてくださった
li#menu-item-番号 .snow-monkey-mega-menu__figure::before {
background: url(画像のURL) no-repeat 50% 50% / cover;
}
これで、メガメニューの画像は選べました。ただ、「制作物」のメニューだけは、画像が変わりませんでした。
下記のように無理やり詳細度は上げてみましたが、
これでは無理なようです。/* 制作物 */
li#menu-item-1339.menu-item.menu-item-type-taxonomy.menu-item-object-products_tag.menu-item-1339.c-navbar__subitem .snow-monkey-mega-menu__figure::before {
background: url(https://v2.crescent-moon.website/wp-content/uploads/2023/01/family-1.jpg) no-repeat 50% 50% / cover !important;
}tagをメニューに加えると、
メガメニューでは画像では難しいのでしょうか？
キタジマさん
教えてくだっさった
上記は、削除して他のメニューに移動しても大丈夫になりました。
paddingで、アクセントカラーに余白をもたせたかったのですが・・。いつもありがとうございます。
tagをメニューに加えても、画像が任意に選べる方法があれば
ぜひ教えていただきたいです。Who liked: No user@koji さん
GONSY さんが書かれているように、他の方が参照しやすいように1トピック1課題でお願いしているのでトピックはわけるようにお願いします。メガメニューから他のメニューにポインタを移動させると、メガメニューが残ったままです。
検証したのですが、忘れそうなのでここに書いちゃいます><
下記の CSS を独自に追加されていると思います。.p-global-nav .c-navbar__item>a { padding: 2px 4px; min-width: 80px; }メニュー項目の
paddingが上書きされることで、メガメニューの位置がメニュー項目に重なるようになってしまっており、見た目上はマウスがメニュー項目にホバーしているように見えていても、実際は透過されたメガメニューの上にマウスがあり、メニュー項目にはホバーできていないのでメガメニューが開かない、という状態になっているようです。ということで、
paddingを見直してみてください。Who liked:Snow Monkey フォーラムは、1トピックにつき1つの質問や話題というルールになっていますので、トピックは分けてください。
１．メガメニューで独自の画像を設定したい。
こちらのご質問ですが、メガメニューの画像はもともとアイキャッチ画像を表示させるようになっていると思いますので、アイキャッチのないアンカーリンクの場合は表示されません。
私がもし独自の画像を表示させるなら、通常のメガメニューに実装されている擬似要素に画像のURLなどを指定して表示させます。
※メニューのセレクタには、固有の番号が振られていますので、検証ツールでご確認ください。
例li#menu-item-番号 .snow-monkey-mega-menu__figure::before { background: url(画像のURL) no-repeat 50% 50% / cover; }Who liked:
こちらのトピックは Intuitive Custom Post Order（プラグイン）で投稿順を変更した場合の対応例があります。
【最近の投稿】ブロックなので、snow_monkey_recent_posts_widget_argsを使うと思いますが…あるブロックの場合だけ
とあるので、【最近の投稿】ブロックの HTML アンカーに
sort_postsと入力すれば
以下のように指定すれば、該当のブロックだけ適用されます。
snow_monkey_recent_posts_widget_args_sort_posts
あとは、前述のトピックにあるように $query_args を指定してあげればカスタムフィールドの値で順番は変更できると思います。$query_args['meta_key'] = 'カスタムフィールド名'; $query_args['orderby'] = 'meta_value_num'; // 数値 $query_args['order'] = 'ASC'; // 昇順（小さい→大きい）
もっとスマートな方法もあるかと思いますが、一度お試しください。Who liked:
早速ご返信ありがとうございます。
– サーバーの容量がいっぱいで画像がアップロードでいない
– アップロードしようとしている画像のサイズ（縦横 or 容量）が大きすぎてアップロードできない
– アップロードディレクトリに書き込み権限がなくアップロードできないこちらなのですが、
メディアから白紙の部分の詳細を見て、
「画像を編集する」というところからは画像が確認できます。アップロードできなければ表示されないと思うのですが、
別の問題は考えられますでしょうか？
ちなみにここで縮尺変更をしたり、代替テキストを追加して更新しても
改善されませんでした。よろしくお願いいたします。
Who liked: No userlocation.searchの参考ページを張っておきます。前述のコードを参考にちょっと書いてみました。動作未確認＆ESNext 構文で書いているので正しく動かない可能性があります。参考にして調整してみてください。
window.addEventListener( 'load', // ページを完全に読み込んだ後に実行 () => { // 対象とするタブブロックを指定 const tabs = document.querySelector( '[data-tabs-id="0cd7c37d-33db-4b10-b91d-30a091d2f667"]' ); if ( !! tabs ) { // 現在のページのクエリを取得（例： ?tab=hoge） const search = window.location.search; if ( !! search ) { // search からタブの指定を取得 const searchParams = new URLSearchParams( search ); const targetTab = searchParams.get( 'tab' ); // ?tab が「hoge」なら if ( 'hoge' === targetTab ) { // 対象とするタブを指定 const tab = tabs.querySelector( '[aria-controls="block-ce097728-902c-47fa-9c7b-d25e712c782f"]' ); if ( !! tab ) { // 対象のタブを強制クリックする tab.click(); } } } } }, true );Who liked: No user
こちらの設定はどのようになっていますか？
私の環境はこの（上図）状態で<i class="fa-solid fa-moon"></i>メニュー名でアイコンが表示されます。
理由：ページ速度最適化の「軽量なFontAwesome」にチェックを入れたいため
軽量なFontAwesomeは一部のアイコンなので、どれなら表示できるか試していきたいとのことですが、固定メニューの頻繁な変更がなければ、FontAwesomeを使用せず、擬似要素でSVGアイコンを入れることも可能だと思います。
Who liked:
