[Murota]

おっしゃる通りですね！

後方互換性や、安定性を考えるとunitone自体を修正していただいた方が良い気がします。

今後も度々ご報告させていただくことになるかもしれませんが、よろしくお願いいたします。

本件もありがとうございました！

♥ 1

いいねをした人：

[Murota]

丁寧なご対応ありがとうございました！

該当箇所はCSSで対応したいと思います。

本筋とはズレてしまいますが、divブロックやデコレーターブロックのおかげで、簡単な不具合やブロックの相性問題は簡単に修正できてしまうんですよね。

どこまで北島さんにご報告すべきなのか、と迷うことが時々あります…。

♥ 1

いいねをした人：

[Murota]

すみません！

ナビゲーションのボタン部分に余計なクラスをつけていました。

正しくはこちらです。

<!-- wp:navigation-link {"label":"Sample1","type":"page","id":8,"url":"http://unitone.local/sample1/","kind":"post-type"} /-->

<!-- wp:navigation-link {"label":"Sample2","type":"page","id":10,"url":"http://unitone.local/sample2/","kind":"post-type"} /-->

<!-- wp:navigation-link {"label":"Sample3","type":"page","id":12,"url":"http://unitone.local/sample3/","kind":"post-type"} /-->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"unitone":{"minWidth":"300px"},"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a>サンプルボタン</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

あと、サンプルボタンの部分は class="wp-block-button__link wp-element-button" の a タグで囲まれています。

♥ 0

いいねをした人： いません

[Murota]

ご連絡が遅れてしまい、申し訳ありません…。

ローカルサイトで実験しているので、ブロックコードを共有させていただきます。

↓ヘッダー部分のコード

<!-- wp:unitone/section {"tagName":"div","unitone":{"maxWidth":"100%","padding":"-1"},"align":"full"} -->
<div class="alignfull unitone-section"><div data-unitone-layout="gutters"><div data-unitone-layout="container"><div data-unitone-layout="stack"><!-- wp:unitone/both-sides {"unitone":{"alignItems":"center","gap":{"column":"-1","row":"-2"}}} -->
<div data-unitone-layout="both-sides"><!-- wp:unitone/stack {"unitone":{"gap":"0"}} -->
<div data-unitone-layout="stack"><!-- wp:site-logo /-->

<!-- wp:site-title /--></div>
<!-- /wp:unitone/stack -->

<!-- wp:navigation {"ref":14,"className":"is-style-unitone-accordion","style":{"typography":{"fontWeight":"600","fontStyle":"normal"}},"fontSize":"unitone-s","layout":{"type":"flex","orientation":"horizontal","justifyContent":"left"}} /--></div>
<!-- /wp:unitone/both-sides --></div></div></div></div>
<!-- /wp:unitone/section -->

↓ナビゲーション部分のコード

<!-- wp:navigation-link {"label":"Sample1","type":"page","id":8,"url":"http://unitone.local/sample1/","kind":"post-type"} /-->

<!-- wp:navigation-link {"label":"Sample2","type":"page","id":10,"url":"http://unitone.local/sample2/","kind":"post-type"} /-->

<!-- wp:navigation-link {"label":"Sample3","type":"page","id":12,"url":"http://unitone.local/sample3/","kind":"post-type"} /-->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"unitone":{"minWidth":"300px"},"className":"is-style-fill min-400"} -->
<div class="wp-block-button is-style-fill min-400"><a>サンプルボタン</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

ご確認をお願いいたします。

♥ 0

いいねをした人： いません

[Murota]

ありがとうございます！

アップデートしたところ、最小幅が効いていることが確認できました。

 

ただ、やはり両端ブロック内にナビゲーションブロックを設置すると最小幅は効きませんでした。

追加CSSで最小幅は設定できるので、両端ブロックの特性としてわざわざ修正する必要もない気もしますが…。

♥ 0

いいねをした人： いません

[Murota]

ありがとうございます！

 

いただいたコードを追加したところ、ナビゲーションブロック単体の場合は最小幅が機能しました。（ただし、エディター上では反映されませんでした）

 

また、どうも両端ブロックとの相性もありそうな感じでした。

• 両端ブロック
  • サイトロゴ
  • ナビゲーション

というよくあるヘッダー構成にしたところ、いただいたコードを追加しても最小幅が効きませんでした🤔

♥ 0

いいねをした人： いません

[Murota]

アップデート対応ありがとうございます！

早速触ってみましたが、かなり使いやすくなりました。

いつも迅速なご対応に感謝します🙇‍♂️

♥ 1

いいねをした人：

[Murota]

ご対応ありがとうございます。

該当箇所が修正されていることが確認できました。

最近はレイヤーブロックの柔軟さにハマっているので助かります。

今後ともよろしくお願いいたします！

♥ 1

いいねをした人：

[Murota]

本当ですか！

これは超嬉しいアップデートです！

楽しみにお待ちしております。

♥ 0

いいねをした人： いません

[Murota]

そうだったのですね！

SWELLさんとかは、確かオリジナルブロックが一番上に表示されていたはず…。

どうやってやってるんでしょうね〜🤔

♥ 0

いいねをした人： いません

[Murota]

ご確認ありがとうございます！

アップデートを楽しみにお待ちしております！

♥ 0

いいねをした人： いません

[Murota]

ご連絡ありがとうございます！

うまく動作しない構成をお送りします。

<!-- wp:unitone/layers -->
<div data-unitone-layout="layers -portrait"><!-- wp:paragraph {"unitone":{"alignSelf":"stretch","justifySelf":"stretch","gridColumn":"1 / -1","gridRow":"1 / -1","minHeight":"200px"},"style":{"elements":{"link":{"color":{"text":"var:preset|color|unitone-background"}}}},"backgroundColor":"unitone-accent","textColor":"unitone-background"} -->
<p class="has-unitone-background-color has-unitone-accent-background-color has-text-color has-background has-link-color">サンプル文章</p>
<!-- /wp:paragraph --></div>
<!-- /wp:unitone/layers -->

♥ 0

いいねをした人： いません

[Murota]

ご対応ありがとうございました！

修正、確認できました。

 

ブロックの入れ子構造は無限にあるので、対応大変ですね…笑

本当にいつもありがとうございます。

また何かありましたらご報告させていただきます！

♥ 1

いいねをした人：

[Murota]

迅速なご対応、ありがとうございます！

ネガティブマージンが機能していることを、確認できました！

いつもありがとうございますm(_ _)m

♥ 1

いいねをした人：

[Murota]

ありがとうございます！確認しました！

 

今回のアップデートもなかなかのボリュームですね（笑）

色々と触りながら楽しみます！

♥ 1

いいねをした人：

[投稿者]

投稿