トピックを立てる前にチェック
- 「フォーラムガイドライン」に必ず目を通してください。
- バージョンアップデート後に表示がおかしくなった場合は、
「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。 - フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
フォーラム
通知
すべてクリア
Topic starter
フルワイドブロックについての質問です。
写真１枚目のオレンジとグレーの背景のところをフルワイドブロックを使用しています。
編集画面だとかなりいい感じなのですがプレビューにしたらフルワイドブロックがそのままフルワイドになってしまいます。
グーグル検索、その他ボーダーで１枚目の編集画面のようにならないか試してみたのですが、なかなかうまくいかず質問させていただきました。
オレンジとグレーのボックスを画像を埋め込む以外で作成する方法、もしくはフルワイドをカラム内に収める方法等ありましたらご教授願いたいです。
お手数おかけいたしますがよろしくお願いいたします。
確認項目
利用中のSWELL本体のバージョン
2.10.0
利用中のWordPressバージョン
6.5.5
利用中のサーバー会社
xサーバー
利用中のプラグイン一覧
Public Post Preview
SEO SIMPLE PACK
WPForms Lite
XML Sitemap Generator for Google
投稿済 : 04/07/2024 5:28 pm
Topic starter
投稿主です写真が１枚しか投稿されていませんでしたので追加で写真を添付します。
こちらの写真が本文中に１枚目と表記している写真になります。
どうぞよろしくお願いいたします。
投稿済 : 04/07/2024 5:36 pm
これでどうでしょう？
コードをコードエディター上にコピペしてみてください。
<!-- wp:loos/columns {"className":"is-style-clmn-shadow"} -->
<div class="swell-block-columns is-style-clmn-shadow"><div class="swell-block-columns__inner"><!-- wp:loos/column {"useCustomPadding":true,"padding":{"top":"0rem","left":"0rem","right":"0rem","bottom":"0rem"}} -->
<div class="swell-block-column swl-has-mb--s" style="--swl-clmn-pddng:0rem 0rem 0rem 0rem"><!-- wp:cover {"customOverlayColor":"#f97336","isUserOverlayColor":true,"minHeight":100,"isDark":false,"className":"u-mb-ctrl u-mb-0","layout":{"type":"constrained"}} -->
<div class="wp-block-cover is-light u-mb-ctrl u-mb-0" style="min-height:100px"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim" style="background-color:#f97336"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"textColor":"white","fontSize":"large"} -->
<p class="has-text-align-center has-white-color has-text-color has-link-color has-large-font-size">タイトル</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover -->
<!-- wp:cover {"overlayColor":"swl-gray","isUserOverlayColor":true,"minHeight":200,"className":"u-mb-ctrl u-mb-0","layout":{"type":"constrained"}} -->
<div class="wp-block-cover u-mb-ctrl u-mb-0" style="min-height:200px"><span aria-hidden="true" class="wp-block-cover__background has-swl-gray-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","fontSize":"large"} -->
<p class="has-text-align-center has-large-font-size"></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"align":"center","style":{"elements":{"link":{"color":{"text":"var:preset|color|black"}}}},"textColor":"black"} -->
<p class="has-text-align-center has-black-color has-text-color has-link-color">ああああああああああああああああああああああああああああ</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:loos/column -->
<!-- wp:loos/column {"useCustomPadding":true,"padding":{"top":"0rem","left":"0rem","right":"0rem","bottom":"0rem"}} -->
<div class="swell-block-column swl-has-mb--s" style="--swl-clmn-pddng:0rem 0rem 0rem 0rem"><!-- wp:cover {"customOverlayColor":"#f97336","isUserOverlayColor":true,"minHeight":100,"isDark":false,"className":"u-mb-ctrl u-mb-0","layout":{"type":"constrained"}} -->
<div class="wp-block-cover is-light u-mb-ctrl u-mb-0" style="min-height:100px"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim" style="background-color:#f97336"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","style":{"elements":{"link":{"color":{"text":"var:preset|color|white"}}}},"textColor":"white","fontSize":"large"} -->
<p class="has-text-align-center has-white-color has-text-color has-link-color has-large-font-size">タイトル</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover -->
<!-- wp:cover {"overlayColor":"swl-gray","isUserOverlayColor":true,"minHeight":200,"className":"u-mb-ctrl u-mb-0","layout":{"type":"constrained"}} -->
<div class="wp-block-cover u-mb-ctrl u-mb-0" style="min-height:200px"><span aria-hidden="true" class="wp-block-cover__background has-swl-gray-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","fontSize":"large"} -->
<p class="has-text-align-center has-large-font-size"></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph {"align":"center","style":{"elements":{"link":{"color":{"text":"var:preset|color|black"}}}},"textColor":"black"} -->
<p class="has-text-align-center has-black-color has-text-color has-link-color">ああああああああああああああああああああああああああああ</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:loos/column --></div></div>
<!-- /wp:loos/columns -->
一般ユーザー
SWELL初心者のために、ブロックパターンライブラリーを運営しています。
投稿済 : 04/07/2024 7:45 pm
Topic starter
投稿済 : 05/07/2024 10:14 am