CTAカード

Let' TRY

新規受講生募集開始

CTAを意識した効果的な誘導ボタンだって作れます

CTA（コールトゥーアクション）と呼ばれるユーザーの行動喚起を促すボタンもAFFINGERならこんな風に作れます。

今すぐ資料請求

資料請求は無料です

<!-- wp:group {"style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"className":"colum-2-p15 st-box-shadow has-st-border has-st-solid-border has-st-medium-border-width","layout":{"type":"constrained"},"stBorderStyle":"solid"} -->
<div class="wp-block-group colum-2-p15 st-box-shadow has-st-border has-st-solid-border has-st-medium-border-width" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:columns {"className":""} -->
<div class="wp-block-columns"><!-- wp:column {"width":"33.33%"} -->
<div class="wp-block-column" style="flex-basis:33.33%"><!-- wp:cover {"url":"http://affinger.com/library/wp-content/uploads/2022/11/technology-791029_1280.jpg","id":300,"dimRatio":50,"minHeight":200,"isDark":false,"className":"h-100"} -->
<div class="wp-block-cover is-light h-100" style="min-height:200px"><span aria-hidden="true" class="wp-block-cover__background has-background-dim"></span><img class="wp-block-cover__image-background wp-image-300" alt="" src="http://affinger.com/library/wp-content/uploads/2022/11/technology-791029_1280.jpg" data-object-fit="cover"/><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"タイトルを入力...","fontSize":"large"} -->
<p class="has-text-align-center has-large-font-size"><span class="huto"><mark style="background-color:rgba(0, 0, 0, 0)" class="has-inline-color has-white-color">Let' TRY</mark></span></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"align":"center","textColor":"white"} -->
<p class="has-text-align-center has-white-color has-text-color">新規受講生募集開始</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:column -->

<!-- wp:column {"width":"66.66%","style":{"spacing":{"padding":{"top":"var:preset|spacing|30","right":"var:preset|spacing|30","bottom":"var:preset|spacing|30","left":"var:preset|spacing|30"}}}} -->
<div class="wp-block-column" style="padding-top:var(--wp--preset--spacing--30);padding-right:var(--wp--preset--spacing--30);padding-bottom:var(--wp--preset--spacing--30);padding-left:var(--wp--preset--spacing--30);flex-basis:66.66%"><!-- wp:heading {"level":4,"className":"is-style-st-heading-custom-diagonal"} -->
<h4 class="is-style-st-heading-custom-diagonal">CTAを意識した効果的な誘導ボタンだって作れます</h4>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>CTA（コールトゥーアクション）と呼ばれる<span class="st-mymarker-s">ユーザーの行動喚起を促すボタン</span>もAFFINGERならこんな風に作れます。</p>
<!-- /wp:paragraph -->

<!-- wp:st-blocks/my-button {"selectedIcon":"st-svg-file-text-o","textFontSize":"90","customBackgroundGradient":"linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)","width":90,"reflection":true,"className":"mb10"} -->
<p class="wp-block-st-blocks-my-button st-mybtn st-reflection st-mybtn-noborder mb10" style="min-width:90%;background:linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);border-width:0px;border-radius:60px;font-size:90%;font-weight:bold;box-shadow:none"><a href="#" style="font-weight:bold"><i class="st-fa st-svg-file-text-o st-css-no" aria-hidden=""></i>今すぐ資料請求<i class="st-fa st-svg-after st-svg-chevron-right st-css-no" aria-hidden=""></i></a></p>
<!-- /wp:st-blocks/my-button -->

<!-- wp:paragraph {"align":"center","fontSize":"small"} -->
<p class="has-text-align-center has-small-font-size">資料請求は無料です</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->