メインコンテンツへ移動

キタジマ タカシ

フォーラムへの返信

15件の投稿を表示中 - 2,266 - 2,280件目 (全7,506件中)
  • 投稿者
    投稿
  • アバター画像キタジマ タカシ
    参加者
    2595

    特に「ノーマル」については「要素間の余白」ではなく「セクションブロック内側の余白」とお伝えした方が正しかったと気付きました。失礼

    添付いただいた画像の例であれば、1枚目の形で「セクション」の下部 padding を0にするよりは、2枚目の「セクション」の中に「セクション(ブロークングリッド)」を入れるほうが素直な形だと思います。

    この場合は適切な余白だと思いますが、セクションの中にセクションを入れることになることから、状況によっては手間が増えたり他に影響が出たりする可能性もあるように思うため、できれば避けた方がよいのかなと思っています。

    状況によってはなにかあるかもしれませんが、こちらが意図しない崩れが発生するかどうかという点でいえば、基本的には大丈夫だと考えています。

    また2つの「ブロークングリッド」の間も、「全幅」以外では少し余白が入ります。このままでもよい場合が多いとも思いますが、「なし」や「幅広」の時にも2つをぴったりとくっつけたいケースもあるように思っています。

    前述したように「全幅に後続する全幅」以外の場合は余白が入ります。「「なし」や「幅広」の時にも2つをぴったりとくっつけたいケースもある」とのことで、どこかに設定を追加するのも良いかなと思ったのですが、どこにどういう設定をもたせるかが悩みますね。各ブロックに設定を持たせるか、要素間余白調整用のブロックを別途つくるか…。

    簡単に済ませるなら下記のような CSS を追加して、

    .u-margin-top\:0 {
      margin-top: 0 !important;
    }

    添付の画像でいえば画像が右寄せのセクション(ブロークングリッド)ブロックの追加 CSS クラスにクラスを追加するかですね…。

    このように、ページ全体のフォントではなく、カスタマイズ画面の項目のフォントが、すべて明朝体になってしまう、という意味でした。

    カスタマイザー → 追加 CSS に追加してみましたが再現しませんでした。CSS を追加したのはカスタマイザーではなくて独自の CSS ファイルですかね? 独自の CSS ファイルであれば、セレクタを調整するのが良いと思います(セクションタイトルだけを明朝にしたいのであれば .smb-section__title とか)。

    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595

    現在は「ノーマル」を除いた「ブロークングリッド」「サイド見出し」「背景画像/動画」では、高さを「フィット」にしていてもセクションの設定を「全幅」にすることで希望の状態にはなるのですが、「なし」「幅広」では余白が入ります。

    全幅に後続する全幅は上余白が0になるようになっています。これは通常幅・幅広の場合は後続の要素をくっつけずに普通通りに並べる、幅広に後続する幅広の場合は要素をくっつける、という表示が一般的かなと思ったのでそういう仕様にしています。通常幅・幅広のときでもくっつけるという想像があまりできていないのですが、参考までに実際のページを見せていただくことってできますか?

    なお「ノーマル」では「全幅」にしても余白がゼロにならないため、上記の「ゼロ」設定に加えて「ノーマル」でも他のセクション同様の仕様になると、なおありがたいところです。

    「セクション」ブロックも、全幅に後続する全幅セクションブロックは上余白が0になります(要素間の余白は後続する要素の margin-top で実現されています)。これはセクションに限らずどのブロックでも同じになります。

    なので「「ノーマル」でも他のセクション同様」というのはなにか独自に追加された CSS が影響していたりしないのかなと思うのですがどうでしょうか?

    タイトルのみ明朝体にしたく、フォント設定として「h1, h2, h3, h4, h5, h6 {font-family: serif;}」をCSSに書き入れているのですが、そうするとカスタマイズ画面のフォントもすべて明朝体になってしまいます。

    カスタマイザーを開き追加 CSS に上記の CSS を追加してみたのですが、意図したとおり h1, h2, h3, h4, h5, h6 だけが明朝体になりました。「すべて」というのはこれらの見出し以外のすべての要素、という意味ですかね?

    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595

    なるほど。これ、Snow Monkey 自体に変更をいれて、例えばこんな感じにしたほうが良さそうですかね?

    <span class="c-hamburger-btn__label">
    	<?php echo wp_kses_post( $args['_label'] ); ?>
    </span>
    <span class="c-hamburger-btn__close-label">
    	<?php echo wp_kses_post( $args['_close-label'] ); ?>
    </span>
    .c-hamburger-btn[aria-expanded="true"].c-hamburger-btn__label {
      display: none;
    }
    .c-hamburger-btn[aria-expanded="false"].c-hamburger-btn__close-label {
      display: none;
    }
    2
    Who liked:
    アバター画像キタジマ タカシ
    参加者
    2595

    Contact Form 7 は document.addEventListener とドキュメントが対象になっていますが、Snow Monkey Forms はフォームが対象になっているのが違う点です。

    const form1 = document.querySelector( '#snow-monkey-form-1' );
    form1.addEventListener( 'smf.submit', ( event ) => ga( ... ) );
    
    const form2 = document.querySelector( '#snow-monkey-form-2' );
    form2.addEventListener( 'smf.submit', ( event ) => ga( ... ) );

    みたいな感じではないでしょうか。

    1
    Who liked:
    アバター画像キタジマ タカシ
    参加者
    2595

    Snow Monkey Forms のカスタム DOM イベントは Google アナリティクスにデータを送信する専用のものというわけではないので、アナリティクスに送信するデータにフォームを識別できる情報を含んでおけば識別できたりしないですかね? 僕はアナリティクスのイベントのことは全然詳しくないので想像ですが…。

    多分↓の関数で送信するのだと思いますが、

    「eventLabel」をフォームごとに別々のものにするとか。

    Snow Monkey Forms のフォーム自体の識別は、フォームについている ID(例:snow-monkey-form-49283)でできると思います。

    1
    Who liked:
    返信先: メディア設定のスマホ対応方法 #102877
    アバター画像キタジマ タカシ
    参加者
    2595

    セクション(背景画像/動画)ブロックは背景画像を object-fit: cover; で表示します。つまり画像ではなくコンテンツにフィットする形でブロックは表示され、その範囲に表示される分だけ画像が表示されます。なのである程度の範囲はトリミングされます。

    .smb-section-with-bgimage__bgimage img {
      object-fit: contain;
    }

    にすれば一切トリミングされませんが、ブロックの上部と下部が画像で埋められなくなるので空白が出るはずです。

    1
    Who liked:
    返信先: メディア設定のスマホ対応方法 #102839
    アバター画像キタジマ タカシ
    参加者
    2595

    実は後から車ぶつけられて、これからの病院です。

    わ、まじですか!気をつけててもぶつけられたらどうしょうもないですもんね…。何事もなければ良いですね><

    0
    Who liked: No user
    返信先: メディア設定のスマホ対応方法 #102825
    アバター画像キタジマ タカシ
    参加者
    2595

    どの部分についてのことか書かれていなかったので一番上部のセクションの背景画像かなと思ったのですがあっていますか?

    一応そこをみてみたら、PC 用にもスマホ用にも同じ画像(画像ID 2560)が設定されているようです。

    試しにスマホ用の画像のアップローダーで真っ黒な画像とかぜんぜん違う画像を設定してみたらどうなりますか?

    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595
    wp_enqueue_script(
    	'cookie', // cookie
    	'https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js',
    	['jquery'],
    	true
    );

    だと第4引数(バージョン指定)が true になっちゃうので、

    wp_enqueue_script(
    	'cookie', // cookie
    	'https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.js',
    	['jquery'],
    	false,
    	true
    );

    みたいな感じかなと思います。

    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595

    v15.0.2 で修正しました!

    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595

    仕様について「キーワードが日本語の場合と英語の場合で挙動が違うのか」

    こちら問い合わせた結果、「テーマ側の担当範囲の話である」とのことでした。

    調べてみました。これ、TwentyTwentyOne でも英語検索だと2ページ目以降が404ステータスになる(けど index.php があるからページは表示される)ので、テーマではなくてプラグイン側が怪しいと思います。一応プラグインも見てみたのですが、Toolset 関連のプラグインが複数あり、それぞれが結構複雑でちょっとどこでどうなっているかわかりませんでした。

    ということで、Snow Monkey は index.php が空なので、やはり前述のコードを追加するのがベストかなと思います。

    1
    Who liked:
    返信先: タブレット時のメニュー表示について #102796
    アバター画像キタジマ タカシ
    参加者
    2595

    下記のコードを My Snow Monkey か子テーマの functions.php に追加してみてください。

    add_filter(
    	'snow_monkey_template_part_render_template-parts/header/1row',
    	function( $html ) {
    		$html = str_replace( 'u-invisible-md-down', 'u-invisible-sm', $html ); // タブレット以下で非表示 を スマホサイズでのみ非表示に変更
    		$html = str_replace( 'u-invisible-lg-up', 'u-invisible-md-up', $html ); // PC サイズ以上で非表示 を タブレットサイズ以上で非表示に変更
    		return $html;
    	}
    );
    0
    Who liked: No user
    アバター画像キタジマ タカシ
    参加者
    2595

    キーワードが日本語の場合と英語の場合で挙動が違うのか、普通に使う分にはには問題ないと思いますが、今回のようにエッジケースがあることがわかり、原因がなんなのか興味があるので時間があるときに調べてみますね!

    1
    Who liked:
    アバター画像キタジマ タカシ
    参加者
    2595

    ありがとうございます、確認できました! どうも画像データに不具合があるみたいです。アップデートで修正をいれようと思います。ご報告ありがとうございます!

    1
    Who liked:
    アバター画像キタジマ タカシ
    参加者
    2595

    こちらの環境では確認できなかったので直接見たほうがなにかわかるかなと思いまして。見れないということであれば状況をこちらで再現したいのですが、セクションの中に入れているコンテンツ(ブロックやコンテンツ量によるのかもなので)、セクションの設定を教えてもらえますか?

    また、独自に CSS を追加したりカスタマイズしている場合、それを外しても改善しないでしょうか?

    0
    Who liked: No user
15件の投稿を表示中 - 2,266 - 2,280件目 (全7,506件中)

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。