VK Blocksでの CTA作成例２（ 要 Lightning Pro ）

<!-- wp:vk-blocks/spacer {"pc":40,"tablet":30,"mobile":20} -->
<div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:40px"></div><div class="vk_spacer-display-tablet" style="height:30px"></div><div class="vk_spacer-display-mobile" style="height:20px"></div></div>
<!-- /wp:vk-blocks/spacer -->

<!-- wp:vk-blocks/outer {"bgColor":"#000000","bgImage":"https://www.vektor-inc.co.jp/wp-content/uploads/2015/08/entrepreneur-1340649_640.jpg","padding_left_and_right":"1","padding_top_and_bottom":"0","opacity":0.9,"borderRadius":4} -->
<div class="vk_outer vk_outer-width-normal vk_outer-paddingLR-use vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.9)), url(https://www.vektor-inc.co.jp/wp-content/uploads/2015/08/entrepreneur-1340649_640.jpg);border:0px none #000;border-radius:4px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"pc":30,"tablet":25,"mobile":20} -->
<div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:30px"></div><div class="vk_spacer-display-tablet" style="height:25px"></div><div class="vk_spacer-display-mobile" style="height:20px"></div></div>
<!-- /wp:vk-blocks/spacer -->

<!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":2.8,"titleColor":"#eeeeee","titleMarginBottom":-0.3,"subTextColor":"#eeeeee"} -->
<div class="vk_heading vk_heading-style-plain" style="margin-bottom:2.8rem"><h2 style="color:#eeeeee;font-size:2.6rem;text-align:center;margin-bottom:-0.3rem" class="vk_heading_title vk_heading_title-style-plain">初心者でも簡単！無料WordPressテーマ</h2><p style="color:#eeeeee;font-size:1.8rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain">100%GPL / 商用利用可能</p></div>
<!-- /wp:vk-blocks/heading -->

<!-- wp:columns -->
<div class="wp-block-columns has-2-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:paragraph {"textColor":"very-light-gray"} -->
<p class="has-text-color has-very-light-gray-color">Lightningは WordPress公式ディレクトリに登録されているカスタマイズ性の高いテーマです。<br>デモデータも配布されているので、ビジネスサイトの雛形が数分でセットアップできます。</p>
<!-- /wp:paragraph -->

<!-- wp:vk-blocks/button {"buttonUrl":"https://lightning.nagoya/ja/","buttonColorCustom":"#ff6900","buttonAlign":"block","fontAwesomeIconBefore":"fas fa-arrow-circle-right","fontAwesomeIconAfter":"fas fa-external-link-alt"} -->
<div class="wp-block-vk-blocks-button vk_button vk_button-color-custom vk_button-align-block"><a href="https://lightning.nagoya/ja/" id="vk_button_link" class="btn vk_button_link btn-primary btn-md btn-block" role="button" aria-pressed="true" style="background-color:#ff6900;border:1px solid #ff6900"><i class="fas fa-arrow-circle-right vk_button_link_before"></i><span class="vk_button_link_txt">Lightning 公式ウェブサイト</span><i class="fas fa-external-link-alt vk_button_link_after"></i></a></div>
<!-- /wp:vk-blocks/button --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"id":8322} -->
<figure class="wp-block-image"><img src="https://www.vektor-inc.co.jp/wp-content/uploads/2015/08/responsive_visual_plain.png" alt="" class="wp-image-8322"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:vk-blocks/spacer {"pc":30,"tablet":25,"mobile":20} -->
<div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:30px"></div><div class="vk_spacer-display-tablet" style="height:25px"></div><div class="vk_spacer-display-mobile" style="height:20px"></div></div>
<!-- /wp:vk-blocks/spacer --></div></div>
<!-- /wp:vk-blocks/outer -->