CTA｜トップページ記事向け

croover
初心者でも直感的に使える！
WordPressテーマ「JIN:R」
WordPressのブロックエディターが感じさせる『特有の取っ付きにくさ』を解消して「最高に使いやすいデザインツール」へと昇華させました。
ぜひ実際に手に取って確かめてみてください！
今すぐダウンロード！
ランキング / CTA
コードをコピー
								<!-- wp:jinr-blocks/background {"backgroundDesign":"d\u002d\u002dbackground-design-shadow","backgroundShadowType":"d\u002d\u002dbackground-shadow-m","backgroundBgColor":"#fcfcfc","backgroundBorderDesign":"d\u002d\u002dborder-solid","backgroundBorderColor":"#f9f9f9","className":"wp-block-jinr-blocks-background b\u002d\u002djinr-block b\u002d\u002djinr-background jinr-custom-cta05","jinrBlocksCSSAttribute":"/*行間を狭くする*/\n.jinr-custom-cta05 p{\n\tmargin:2.5rem 0 0 0 !important;\n\tfont-size:1.5rem;\n}\n\n/*画像に影をつける*/\n.jinr-custom-cta05 img{\n\tbox-shadow:0 0 7px -2px #ddd;\n}\n\n/*ボタンの余白調整*/\n@media (min-width: 782px){\n.jinr-custom-cta05 .b\u002d\u002djinr-block{\n\tmargin-bottom:0 !important;\n}\n}\n\n/*デザイン見出し調整*/\n.jinr-custom-cta05 .a\u002d\u002dh2rich-maincopy{\n\tfont-size:1.35em !important;\n}\n\n\n/*SP - スマホ調整*/\n@media (max-width: 551px){\n.jinr-custom-cta05 p{\n\tmargin:2em 0 !important;\n}\n}\n"} -->
<div class="jinr-add-class-container"><div class="wp-block-jinr-blocks-background b--jinr-block b--jinr-background jinr-custom-cta05"><div class="o--background-container d--background-design-shadow d--background-shadow-m d--border-outset"><div class="c--background-inner d--border-solid d--border-1px t--round" style="border-color:#f9f9f9"><!-- wp:columns -->
<div class="wp-block-columns js--scr-animation"><!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%"><!-- wp:image {"id":2615,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="http://jinr-theme.com/wp-content/uploads/2022/06/アートボード-12-1024x576.png" alt="" class="wp-image-2615"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center","width":"50%"} -->
<div class="wp-block-column is-vertically-aligned-center" style="flex-basis:50%"><!-- wp:jinr-blocks/designtitle {"mainText":"WordPressテーマ「JIN:R」","subText":"初心者でも直感的に使える！","divText":"WordPressテーマ「JIN:R」","titleDesign":"2","radioLayout":"center","mainTextColor":"#444444","subTextColor":"#444444","titleDesignColor":"#444444","symbolColor":"#444444","tagSelect":"div","className":"undefined"} -->
<section class="wp-block-jinr-blocks-designtitle b--jinr-block b--jinr-h2rich d--h2rich-center d--h2rich-style2 d--titledesign-weight-thin d--h2rich-none undefined js--scr-animation" style="border-color:#444444"><div class="c--h2rich-contents"><span class="a--h2rich-subcopy ef" style="color:#444444">初心者でも直感的に使える！</span><div class="a--h2rich-maincopy d--bold ef" style="color:#444444">WordPressテーマ「JIN:R」</div></div></section>
<!-- /wp:jinr-blocks/designtitle -->

<!-- wp:paragraph -->
<p>WordPressのブロックエディターが感じさせる『特有の取っ付きにくさ』を解消して<strong>「最高に使いやすいデザインツール」</strong>へと昇華させました。</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>ぜひ実際に手に取って確かめてみてください！</p>
<!-- /wp:paragraph -->

<!-- wp:jinr-blocks/button {"content":"今すぐダウンロード ！","inputUrl":"https://jinr.jp/","toggleTab":true,"className":"d\u002d\u002dbutton-type1 d\u002d\u002dbutton-center jinr-custom-wbutton-fill"} -->
<div class="wp-block-jinr-blocks-button b--jinr-block b--jinr-button d--button-type1 d--button-center jinr-custom-wbutton-fill js--scr-animation">[jinr_button1 target="true" href="https://jinr.jp/" align="d--button-center"]<span>今すぐダウンロード ！</span>[/jinr_button1]</div>
<!-- /wp:jinr-blocks/button --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></div><div class="a--background-color" style="background:#fcfcfc"></div><div class="a--background-image t--round d--background-pattern1" style="opacity:0.29999999999999993;background-size:16.666666666666668%"></div></div><style jsx="true">/*行間を狭くする*/
.jinr-custom-cta05 p{
	margin:2.5rem 0 0 0 !important;
	font-size:1.5rem;
}

/*画像に影をつける*/
.jinr-custom-cta05 img{
	box-shadow:0 0 7px -2px #ddd;
}

/*ボタンの余白調整*/
@media (min-width: 782px){
.jinr-custom-cta05 .b--jinr-block{
	margin-bottom:0 !important;
}
}

/*デザイン見出し調整*/
.jinr-custom-cta05 .a--h2rich-maincopy{
	font-size:1.35em !important;
}


/*SP - スマホ調整*/
@media (max-width: 551px){
.jinr-custom-cta05 p{
	margin:2em 0 !important;
}
}
</style></div>
<!-- /wp:jinr-blocks/background -->
デザイン見本帳
