block-template-panel.js
5 years ago
block.js
5 years ago
default-templates.js
6 years ago
helper.js
6 years ago
index.js
5 years ago
sidebar.js
5 years ago
default-templates.js
326 lines
| 1 | /** |
| 2 | * WordPress dependencies |
| 3 | */ |
| 4 | const { parse } = wp.blocks; |
| 5 | |
| 6 | /** |
| 7 | * External dependencies |
| 8 | */ |
| 9 | import memoize from "memize"; |
| 10 | |
| 11 | const defaultTemplates = [ |
| 12 | { |
| 13 | name: "Cover", |
| 14 | icon: "", |
| 15 | content: ` |
| 16 | <!-- wp:vk-blocks/outer {"bgColor":"#000000","bgImage":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/programming-942487_1920.jpg","outerWidth":"full","padding_top_and_bottom":"0","opacity":0.7} --> |
| 17 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/programming-942487_1920.jpg);border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":4.5,"tablet":4.5,"mobile":4.5} --> |
| 18 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4.5rem"></div><div class="vk_spacer-display-tablet" style="height:4.5rem"></div><div class="vk_spacer-display-mobile" style="height:4.5rem"></div></div> |
| 19 | <!-- /wp:vk-blocks/spacer --> |
| 20 | |
| 21 | <!-- wp:vk-blocks/pr-content {"titleColor":"#eeeeee","contentColor":"#eeeeee","url":"https://example.com","buttonType":"1","buttonColorCustom":"#eeeeee","Image":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/device_01.png","layout":"right","fontAwesomeIconBefore":"fas fa-arrow-circle-right","fontAwesomeIconAfter":""} --> |
| 22 | <div class="wp-block-vk-blocks-pr-content vk_prContent vk_prContent-layout-imageRight"><div class="col-sm-6 vk_prContent_colImg"><img class="vk_prContent_colImg_image" src="https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/device_01.png" alt="画像をアップロード" style="border:none"/></div><div class="col-sm-6 vk_prContent_colTxt"><h3 class="vk_prContent_colTxt_title" style="color:#eeeeee">自社のコンセプトやキャッチコピーが� |
| 23 | �ります。</h3><p class="vk_prContent_colTxt_text" style="color:#eeeeee">この部分には、自社について説明が� |
| 24 | �ります。<br>自社のコンセプトや理念など、大切にしていることについて説明しましょう。お客様に一番伝えたいことを書くことをおススメします。</p><div class="vk_button vk_button-color-custom"><a href="https://example.com" class="btn btn-block vk_button_link vk_prContent_colTxt_btn btn-primary" style="background-color:transparent;border:1px solid #eeeeee;color:#eeeeee" rel="noopener noreferrer"><i class="fas fa-arrow-circle-right vk_button_link_before"></i><span class="vk_button_link_txt">さらに詳しく</span></a></div></div></div> |
| 25 | <!-- /wp:vk-blocks/pr-content --> |
| 26 | |
| 27 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":2,"tablet":4,"mobile":4} --> |
| 28 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:2rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 29 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 30 | <!-- /wp:vk-blocks/outer --> |
| 31 | `, |
| 32 | }, |
| 33 | { |
| 34 | name: "Full Wide Title Set", |
| 35 | icon: "", |
| 36 | content: ` |
| 37 | <!-- wp:vk-blocks/outer {"bgColor":"#0c7abb","outerWidth":"full","padding_top_and_bottom":"0","opacity":1} --> |
| 38 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(12, 122, 187, 1), rgba(12, 122, 187, 1));border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":3,"tablet":3,"mobile":3} --> |
| 39 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:3rem"></div><div class="vk_spacer-display-tablet" style="height:3rem"></div><div class="vk_spacer-display-mobile" style="height:3rem"></div></div> |
| 40 | <!-- /wp:vk-blocks/spacer --> |
| 41 | |
| 42 | <!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":0,"titleColor":"#ffffff","titleMarginBottom":0,"subTextColor":"#ffffff"} --> |
| 43 | <div class="wp-block-vk-blocks-heading vk_heading vk_heading-style-plain" style="margin-bottom:0rem"><h2 style="color:#ffffff;font-size:2rem;margin-bottom:0rem;text-align:center" class="vk_heading_title vk_heading_title-style-plain" placeholder="タイトルを� |
| 44 | �力">Title test</h2><p style="color:#ffffff;font-size:1.2rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain" placeholder="サブテキストを� |
| 45 | �力">Sub title text</p></div> |
| 46 | <!-- /wp:vk-blocks/heading --> |
| 47 | |
| 48 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":3,"tablet":3,"mobile":3} --> |
| 49 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:3rem"></div><div class="vk_spacer-display-tablet" style="height:3rem"></div><div class="vk_spacer-display-mobile" style="height:3rem"></div></div> |
| 50 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 51 | <!-- /wp:vk-blocks/outer --> |
| 52 | `, |
| 53 | }, |
| 54 | { |
| 55 | name: "Service", |
| 56 | icon: "", |
| 57 | content: `<!-- wp:vk-blocks/outer {"bgColor":"#ffffff","outerWidth":"full","padding_top_and_bottom":"0"} --> |
| 58 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5));border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 59 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 60 | <!-- /wp:vk-blocks/spacer --> |
| 61 | |
| 62 | <!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":3,"titleMarginBottom":0} --> |
| 63 | <div class="wp-block-vk-blocks-heading"><div class="vk_heading vk_heading-style-plain" style="margin-bottom:3rem"><h2 style="color:#000000;font-size:2rem;margin-bottom:0rem;text-align:center" class="vk_heading_title vk_heading_title-style-plain" placeholder="タイトルを� |
| 64 | �力">サービスの特徴など</h2><p style="color:#000000;font-size:1.2rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain" placeholder="サブテキストを� |
| 65 | �力">提供しているサービスの特徴などを画像つきで紹介します</p></div></div> |
| 66 | <!-- /wp:vk-blocks/heading --> |
| 67 | |
| 68 | <!-- wp:vk-blocks/card {"name":"vk-blocks/card"} --> |
| 69 | <div class="vk_posts wp-block-vk-blocks-card"><!-- wp:vk-blocks/card-item {"url":"/"} --> |
| 70 | <div class="vk_post card card-post vk_card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4 vk_post-btn-display"><div class="vk_post_imgOuter"><a href="/"><div class="card-img-overlay"></div></a></div><div class="vk_post_body card-body"><a href="/"><h5 class="vk_post_title card-title text-left">サービスの特徴</h5></a><p class="vk_post_excerpt card-text text-left">サービスの特徴についての紹介文などが� |
| 71 | �りますサービスの特徴についての紹介文などが� |
| 72 | �ります。</p><div class="vk_post_btnOuter text-right"><a class="btn btn-primary vk_post_btn" href="/">Read more</a></div></div></div> |
| 73 | <!-- /wp:vk-blocks/card-item --> |
| 74 | |
| 75 | <!-- wp:vk-blocks/card-item {"url":"/"} --> |
| 76 | <div class="vk_post card card-post vk_card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4 vk_post-btn-display"><div class="vk_post_imgOuter"><a href="/"><div class="card-img-overlay"></div></a></div><div class="vk_post_body card-body"><a href="/"><h5 class="vk_post_title card-title text-left">サービスの特徴</h5></a><p class="vk_post_excerpt card-text text-left">サービスの特徴についての紹介文などが� |
| 77 | �りますサービスの特徴についての紹介文などが� |
| 78 | �ります。</p><div class="vk_post_btnOuter text-right"><a class="btn btn-primary vk_post_btn" href="/">Read more</a></div></div></div> |
| 79 | <!-- /wp:vk-blocks/card-item --> |
| 80 | |
| 81 | <!-- wp:vk-blocks/card-item {"url":"/"} --> |
| 82 | <div class="vk_post card card-post vk_card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4 vk_post-btn-display"><div class="vk_post_imgOuter"><a href="/"><div class="card-img-overlay"></div></a></div><div class="vk_post_body card-body"><a href="/"><h5 class="vk_post_title card-title text-left">サービスの特徴</h5></a><p class="vk_post_excerpt card-text text-left">サービスの特徴についての紹介文などが� |
| 83 | �りますサービスの特徴についての紹介文などが� |
| 84 | �ります。</p><div class="vk_post_btnOuter text-right"><a class="btn btn-primary vk_post_btn" href="/">Read more</a></div></div></div> |
| 85 | <!-- /wp:vk-blocks/card-item --></div> |
| 86 | <!-- /wp:vk-blocks/card --> |
| 87 | |
| 88 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":2,"tablet":2,"mobile":2} --> |
| 89 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:2rem"></div><div class="vk_spacer-display-tablet" style="height:2rem"></div><div class="vk_spacer-display-mobile" style="height:2rem"></div></div> |
| 90 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 91 | <!-- /wp:vk-blocks/outer -->`, |
| 92 | }, |
| 93 | { |
| 94 | name: "About", |
| 95 | icon: "", |
| 96 | content: ` |
| 97 | <!-- wp:vk-blocks/outer {"outerWidth":"full","padding_top_and_bottom":"0","upper_level":-60} --> |
| 98 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(243, 244, 245, 0.5), rgba(243, 244, 245, 0.5));border:none;border-radius:0px"><div class="vk_outer_separator vk_outer_separator-position-upper vk_outer_separator-type-tilt" style="padding-bottom:60px"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 100 100" preserveaspectratio="none"><path d="m100,40 L0,100 L100,100 z" strokewidth="0" fill="#fff"></path></svg></div><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 99 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 100 | <!-- /wp:vk-blocks/spacer --> |
| 101 | <!-- wp:vk-blocks/pr-content {"url":"https://example.com","buttonColorCustom":"#cf2e2e","Image":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/pr-img.png","layout":"right"} --> |
| 102 | <div class="wp-block-vk-blocks-pr-content vk_prContent vk_prContent-layout-imageRight"><div class="col-sm-6 vk_prContent_colImg"><img class="vk_prContent_colImg_image" src="https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/pr-img.png" alt="画像をアップロード" style="border:none"/></div><div class="col-sm-6 vk_prContent_colTxt"><h3 class="vk_prContent_colTxt_title">自社のコンセプトやキャッチコピーが� |
| 103 | �ります。</h3><p class="vk_prContent_colTxt_text">この部分には、自社について説明が� |
| 104 | �ります。<br>自社のコンセプトや理念など、大切にしていることについて説明しましょう。お客様に一番伝えたいことを書くことをおススメします。</p><div class="vk_button vk_button-color-custom"><a href="https://example.com" class="btn btn-block vk_button_link vk_prContent_colTxt_btn btn-primary" style="background-color:#cf2e2e;border:1px solid #cf2e2e" rel="noopener noreferrer"><span class="vk_button_link_txt">さらに詳しく</span></a></div></div></div> |
| 105 | <!-- /wp:vk-blocks/pr-content --> |
| 106 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 107 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 108 | <!-- /wp:vk-blocks/spacer --> |
| 109 | |
| 110 | </div></div><!-- /wp:vk-blocks/outer --> |
| 111 | `, |
| 112 | }, |
| 113 | { |
| 114 | name: "Icon Card Set", |
| 115 | icon: "", |
| 116 | content: `<!-- wp:vk-blocks/outer {"bgColor":"#ffffff","outerWidth":"full","opacity":1,"clientId":"c0a133ef-fa45-4fba-bfd2-554fcb772305"} --> |
| 117 | <div class="vkb-outer-c0a133ef-fa45-4fba-bfd2-554fcb772305 wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-use vk_outer-bgPosition-normal" style="border:0px none #000;border-radius:0px"><style>.vkb-outer-c0a133ef-fa45-4fba-bfd2-554fcb772305{background: linear-gradient(rgba(255, 255, 255, 1), rgba(255, 255, 255, 1))}!important;</style><div><div class="vk_outer_container"><!-- wp:vk-blocks/icon-card --> |
| 118 | <div class="vk_posts wp-block-vk-blocks-icon-card"><!-- wp:vk-blocks/icon-card-item {"url":"/service/","icon":"far fa-file-alt","color":"#337ab7"} --> |
| 119 | <div class="wp-block-vk-blocks-icon-card-item vk_post vk_icon-card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4"><a href="/service/" class="vk_icon-card_item_link" target="_self" rel="noopener noreferrer"><div class="vk_icon-card_item_icon_outer" style="background-color:transparent;border:1px solid #337ab7"><i class="far fa-file-alt vk_icon-card_item_icon" style="color:#337ab7"></i></div><h3 class="vk_icon-card_item_title vk_icon-card_item_title has-text-align-center">サービス案� |
| 120 | </h3><p class="vk_icon_card_item_summary vk_icon_card_item_summary has-text-align-center">弊社が提供するサービス＆ソリューションについてご紹介しています。経験豊富なスタッフがこだわりを持って取り組んでいます。</p></a></div> |
| 121 | <!-- /wp:vk-blocks/icon-card-item --> |
| 122 | |
| 123 | <!-- wp:vk-blocks/icon-card-item {"url":"/company/","icon":"far fa-building","color":"#337ab7"} --> |
| 124 | <div class="wp-block-vk-blocks-icon-card-item vk_post vk_icon-card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4"><a href="/company/" class="vk_icon-card_item_link" target="_self" rel="noopener noreferrer"><div class="vk_icon-card_item_icon_outer" style="background-color:transparent;border:1px solid #337ab7"><i class="far fa-building vk_icon-card_item_icon" style="color:#337ab7"></i></div><h3 class="vk_icon-card_item_title vk_icon-card_item_title has-text-align-center">会社案� |
| 125 | </h3><p class="vk_icon_card_item_summary vk_icon_card_item_summary has-text-align-center">弊社代表挨拶や会社の基本� |
| 126 | 報について記載しています。また、弊社の歴史なども紹介していますので是非ご覧ください。</p></a></div> |
| 127 | <!-- /wp:vk-blocks/icon-card-item --> |
| 128 | |
| 129 | <!-- wp:vk-blocks/icon-card-item {"url":"/recruit/","icon":"fas fa-users","color":"#337ab7"} --> |
| 130 | <div class="wp-block-vk-blocks-icon-card-item vk_post vk_icon-card_item vk_post-col-xs-12 vk_post-col-sm-6 vk_post-col-md-4 vk_post-col-lg-4 vk_post-col-xl-4"><a href="/recruit/" class="vk_icon-card_item_link" target="_self" rel="noopener noreferrer"><div class="vk_icon-card_item_icon_outer" style="background-color:transparent;border:1px solid #337ab7"><i class="fas fa-users vk_icon-card_item_icon" style="color:#337ab7"></i></div><h3 class="vk_icon-card_item_title vk_icon-card_item_title has-text-align-center">採用� |
| 131 | 報</h3><p class="vk_icon_card_item_summary vk_icon_card_item_summary has-text-align-center">株式会社サンプルでは一緒に働く仲間を募集しています。自分で考えていろいろな事にチャレンジできるやりがいのある仕事です。</p></a></div> |
| 132 | <!-- /wp:vk-blocks/icon-card-item --></div> |
| 133 | <!-- /wp:vk-blocks/icon-card --></div></div></div> |
| 134 | <!-- /wp:vk-blocks/outer -->`, |
| 135 | }, |
| 136 | { |
| 137 | name: "Information ( Text )", |
| 138 | icon: "", |
| 139 | content: ` |
| 140 | <!-- wp:vk-blocks/outer {"outerWidth":"full"} --> |
| 141 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-use vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(243, 244, 245, 0.5), rgba(243, 244, 245, 0.5));border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":2,"titleMarginBottom":0} --> |
| 142 | <div class="wp-block-vk-blocks-heading"><div class="vk_heading vk_heading-style-plain" style="margin-bottom:2rem"><h2 style="color:#000000;font-size:2rem;margin-bottom:0rem;text-align:center" class="vk_heading_title vk_heading_title-style-plain" placeholder="タイトルを� |
| 143 | �力"><strong>お知らせ</strong></h2><p style="color:#000000;font-size:1.2rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain" placeholder="サブテキストを� |
| 144 | �力">Information</p></div></div> |
| 145 | <!-- /wp:vk-blocks/heading --> |
| 146 | |
| 147 | <!-- wp:vk-blocks/post-list {"name":"vk-blocks/post-list","layout":"postListText"} /--> |
| 148 | |
| 149 | <!-- wp:vk-blocks/button {"buttonUrl":"/information/","buttonType":"2","buttonColorCustom":"#313131","buttonAlign":"right","fontAwesomeIconAfter":"fas fa-arrow-circle-right"} --> |
| 150 | <div class="wp-block-vk-blocks-button vk_button vk_button-color-custom vk_button-align-right"><a href="/information/" id="vk_button_link" style="color:#313131" class="vk_button_link vk_button_link-type-text btn-md" role="button" aria-pressed="true" rel="noopener noreferrer"><span class="vk_button_link_txt">お知らせ一覧</span><i class="fas fa-arrow-circle-right vk_button_link_after"></i></a></div> |
| 151 | <!-- /wp:vk-blocks/button --> |
| 152 | |
| 153 | </div></div> |
| 154 | <!-- /wp:vk-blocks/outer --> |
| 155 | `, |
| 156 | }, |
| 157 | { |
| 158 | name: "Information ( Card )", |
| 159 | icon: "", |
| 160 | content: ` |
| 161 | <!-- wp:vk-blocks/outer {"bgColor":"#ffffff","outerWidth":"full","opacity":0.9} --> |
| 162 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-use vk_outer-bgPosition-normal" style="background:linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.9));border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":3,"titleMarginBottom":0} --> |
| 163 | <div class="wp-block-vk-blocks-heading vk_heading vk_heading-style-plain" style="margin-bottom:3rem"><h2 style="color:#000000;font-size:2rem;margin-bottom:0rem;text-align:center" class="vk_heading_title vk_heading_title-style-plain" placeholder="タイトルを� |
| 164 | �力"><strong>お知らせ</strong></h2><p style="color:#000000;font-size:1.2rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain" placeholder="サブテキストを� |
| 165 | �力">Information</p></div> |
| 166 | <!-- /wp:vk-blocks/heading --> |
| 167 | |
| 168 | <!-- wp:vk-blocks/post-list {"name":"vk-blocks/post-list"} /--> |
| 169 | |
| 170 | <!-- wp:vk-blocks/button {"buttonUrl":"https://example.com/","buttonSize":"sm","buttonAlign":"right","fontAwesomeIconBefore":"fas fa-arrow-circle-right"} --> |
| 171 | <div class="wp-block-vk-blocks-button vk_button vk_button-align-right"><a href="https://example.com/" id="vk_button_link" class="btn vk_button_link btn-sm btn-primary" role="button" aria-pressed="true" rel="noopener noreferrer"><i class="fas fa-arrow-circle-right vk_button_link_before"></i><span class="vk_button_link_txt">一覧を見る</span></a></div> |
| 172 | <!-- /wp:vk-blocks/button --></div></div> |
| 173 | <!-- /wp:vk-blocks/outer --> |
| 174 | `, |
| 175 | }, |
| 176 | { |
| 177 | name: "Feature Posts", |
| 178 | icon: "", |
| 179 | content: ` |
| 180 | <!-- wp:vk-blocks/outer {"bgColor":"#eeeeee","outerWidth":"full","padding_left_and_right":"1","padding_top_and_bottom":"0","clientId":"88b8ebeb-19b0-46cc-9690-90c26b4835c5"} --> |
| 181 | <div class="vkb-outer-88b8ebeb-19b0-46cc-9690-90c26b4835c5 wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-use vk_outer-paddingVertical-none vk_outer-bgPosition-normal" style="border:0px none #000;border-radius:0px"><style>.vkb-outer-88b8ebeb-19b0-46cc-9690-90c26b4835c5{background: linear-gradient(rgba(238, 238, 238, 0.5), rgba(238, 238, 238, 0.5))}!important;</style><div><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"pc":30} --> |
| 182 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:30px"></div><div class="vk_spacer-display-tablet" style="height:30px"></div><div class="vk_spacer-display-mobile" style="height:20px"></div></div> |
| 183 | <!-- /wp:vk-blocks/spacer --> |
| 184 | <!-- wp:vk-blocks/post-list {"name":"vk-blocks/post-list","col_xs":2,"col_sm":3,"col_xl":6,"display_date":false} /--></div></div></div> |
| 185 | <!-- /wp:vk-blocks/outer --> |
| 186 | `, |
| 187 | }, |
| 188 | { |
| 189 | name: "Call To Action", |
| 190 | icon: "", |
| 191 | content: ` |
| 192 | <!-- wp:vk-blocks/outer {"bgColor":"#000000","bgImage":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/programming-942487_1920.jpg","bgPosition":"fixed","padding_left_and_right":"1","padding_top_and_bottom":"0","opacity":0.7,"borderRadius":8} --> |
| 193 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-normal vk_outer-paddingLR-use vk_outer-paddingVertical-none vk_outer-bgPosition-fixed" style="background:linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/programming-942487_1920.jpg);border:0px none #000;border-radius:8px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 194 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 195 | <!-- /wp:vk-blocks/spacer --> |
| 196 | |
| 197 | <!-- wp:vk-blocks/pr-content {"titleColor":"#eeeeee","contentColor":"#eeeeee","url":"https://example.com","buttonColorCustom":"#cf2e2e","Image":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/device_01.png","layout":"right","fontAwesomeIconBefore":"fas fa-arrow-circle-right","fontAwesomeIconAfter":""} --> |
| 198 | <div class="wp-block-vk-blocks-pr-content vk_prContent vk_prContent-layout-imageRight"><div class="col-sm-6 vk_prContent_colImg"><img class="vk_prContent_colImg_image" src="https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/device_01.png" alt="画像をアップロード" style="border:none"/></div><div class="col-sm-6 vk_prContent_colTxt"><h3 class="vk_prContent_colTxt_title" style="color:#eeeeee">Call To Action Title</h3><p class="vk_prContent_colTxt_text" style="color:#eeeeee">この部分には、自社について説明が� |
| 199 | �ります。<br>自社のコンセプトや理念など、大切にしていることについて説明しましょう。お客様に一番伝えたいことを書くことをおススメします。</p><div class="vk_button vk_button-color-custom"><a href="https://example.com" class="btn btn-block vk_button_link vk_prContent_colTxt_btn btn-primary" style="background-color:#cf2e2e;border:1px solid #cf2e2e" rel="noopener noreferrer"><i class="fas fa-arrow-circle-right vk_button_link_before"></i><span class="vk_button_link_txt">さらに詳しく</span></a></div></div></div> |
| 200 | <!-- /wp:vk-blocks/pr-content --> |
| 201 | |
| 202 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":4.5,"tablet":4,"mobile":4} --> |
| 203 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4.5rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 204 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 205 | <!-- /wp:vk-blocks/outer --> |
| 206 | |
| 207 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 208 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 209 | <!-- /wp:vk-blocks/spacer --> |
| 210 | `, |
| 211 | }, |
| 212 | { |
| 213 | name: "Contact", |
| 214 | icon: "", |
| 215 | content: ` |
| 216 | <!-- wp:vk-blocks/outer {"bgColor":"#313131","bgImage":"https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/home-office-336373_1920-e1513588377670.jpg","outerWidth":"full","bgPosition":"fixed","padding_top_and_bottom":"0","opacity":0.7} --> |
| 217 | <div class="wp-block-vk-blocks-outer vk_outer vk_outer-width-full vk_outer-paddingLR-none vk_outer-paddingVertical-none vk_outer-bgPosition-fixed" style="background:linear-gradient(rgba(49, 49, 49, 0.7), rgba(49, 49, 49, 0.7)), url(https://www.vektor-inc.co.jp/vk-blocks-tmpl-images/home-office-336373_1920-e1513588377670.jpg);border:0px none #000;border-radius:0px"><div class="vk_outer_container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":3,"tablet":3,"mobile":3} --> |
| 218 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:3rem"></div><div class="vk_spacer-display-tablet" style="height:3rem"></div><div class="vk_spacer-display-mobile" style="height:3rem"></div></div> |
| 219 | <!-- /wp:vk-blocks/spacer --> |
| 220 | |
| 221 | <!-- wp:vk-blocks/heading {"align":"center","titleStyle":"plain","outerMarginBottom":0,"titleColor":"#eeeeee","titleMarginBottom":0,"subTextColor":"#eeeeee"} --> |
| 222 | <div class="wp-block-vk-blocks-heading vk_heading vk_heading-style-plain" style="margin-bottom:0rem"><h2 style="color:#eeeeee;font-size:2rem;margin-bottom:0rem;text-align:center" class="vk_heading_title vk_heading_title-style-plain" placeholder="タイトルを� |
| 223 | �力">無料体験実施中！</h2><p style="color:#eeeeee;font-size:1.2rem;text-align:center" class="vk_heading_subtext vk_heading_subtext-style-plain" placeholder="サブテキストを� |
| 224 | �力">体験� |
| 225 | �会大歓迎です。お気軽にご連絡ください。</p></div> |
| 226 | <!-- /wp:vk-blocks/heading --> |
| 227 | |
| 228 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":1.5,"tablet":1.5,"mobile":1.5} --> |
| 229 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:1.5rem"></div><div class="vk_spacer-display-tablet" style="height:1.5rem"></div><div class="vk_spacer-display-mobile" style="height:1.5rem"></div></div> |
| 230 | <!-- /wp:vk-blocks/spacer --> |
| 231 | |
| 232 | <!-- wp:columns --> |
| 233 | <div class="wp-block-columns"><!-- wp:column --> |
| 234 | <div class="wp-block-column"><!-- wp:vk-blocks/button {"subCaption":"お気軽にお問い合わせください","buttonUrl":"/contact/","buttonColor":"success","buttonColorCustom":null,"buttonAlign":"block","fontAwesomeIconBefore":"far fa-envelope"} --> |
| 235 | <div class="wp-block-vk-blocks-button vk_button vk_button-align-block"><a href="/contact/" id="vk_button_link" class="btn vk_button_link btn-md btn-success btn-block" role="button" aria-pressed="true" rel="noopener noreferrer"><i class="far fa-envelope vk_button_link_before"></i><span class="vk_button_link_txt">メールでのお問い合わせ</span><p class="vk_button_link_subCaption">お気軽にお問い合わせください</p></a></div> |
| 236 | <!-- /wp:vk-blocks/button --> |
| 237 | </div> |
| 238 | <!-- /wp:column --> |
| 239 | |
| 240 | <!-- wp:column --> |
| 241 | <div class="wp-block-column"><!-- wp:vk-blocks/button {"subCaption":"電話でのお問い合わせはこちら","buttonUrl":"tel:000-000-0000","buttonColor":"danger","buttonColorCustom":null,"buttonAlign":"block","fontAwesomeIconBefore":"fas fa-phone-square-alt"} --> |
| 242 | <div class="wp-block-vk-blocks-button vk_button vk_button-align-block"><a href="tel:000-000-0000" id="vk_button_link" class="btn vk_button_link btn-md btn-danger btn-block" role="button" aria-pressed="true" rel="noopener noreferrer"><i class="fas fa-phone-square-alt vk_button_link_before"></i><span class="vk_button_link_txt">000-000-0000</span><p class="vk_button_link_subCaption">電話でのお問い合わせはこちら</p></a></div> |
| 243 | <!-- /wp:vk-blocks/button --> |
| 244 | </div> |
| 245 | <!-- /wp:column --></div> |
| 246 | <!-- /wp:columns --> |
| 247 | |
| 248 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":1,"tablet":1,"mobile":1} --> |
| 249 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:1rem"></div><div class="vk_spacer-display-tablet" style="height:1rem"></div><div class="vk_spacer-display-mobile" style="height:1rem"></div></div> |
| 250 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 251 | <!-- /wp:vk-blocks/outer -->`, |
| 252 | }, |
| 253 | { |
| 254 | name: "Step set", |
| 255 | icon: "", |
| 256 | content: ` |
| 257 | <!-- wp:group {"className":"is-style-default","color":"#eeeeee"} --> |
| 258 | <div class="wp-block-group is-style-default"><div class="wp-block-group__inner-container"><!-- wp:vk-blocks/spacer {"unit":"rem","pc":2,"tablet":32,"mobile":2} --> |
| 259 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:2rem"></div><div class="vk_spacer-display-tablet" style="height:32rem"></div><div class="vk_spacer-display-mobile" style="height:2rem"></div></div> |
| 260 | <!-- /wp:vk-blocks/spacer --> |
| 261 | |
| 262 | <!-- wp:vk-blocks/step --> |
| 263 | <div class="wp-block-vk-blocks-step vk_step"><!-- wp:vk-blocks/step-item --> |
| 264 | <div class="wp-block-vk-blocks-step-item vk_step_item vk_step_item_lineStyle-default"><div class="vk_step_item_content"><!-- wp:heading {"level":4} --> |
| 265 | <h4><strong>お問い合わせ</strong></h4> |
| 266 | <!-- /wp:heading --> |
| 267 | |
| 268 | <!-- wp:paragraph --> |
| 269 | <p>まずは<a>お問い合わせフォーム</a>または電話にてご連絡ください。</p> |
| 270 | <!-- /wp:paragraph --></div><div class="vk_step_item_dot vk_step_item_style-default" style="background-color:#337ab7;color:#ffffff"><div class="vk_step_item_dot_caption">STEP</div><div class="vk_step_item_dot_num">1</div></div></div> |
| 271 | <!-- /wp:vk-blocks/step-item --> |
| 272 | |
| 273 | <!-- wp:vk-blocks/step-item {"dotNum":2} --> |
| 274 | <div class="wp-block-vk-blocks-step-item vk_step_item vk_step_item_lineStyle-default"><div class="vk_step_item_content"><!-- wp:heading {"level":4} --> |
| 275 | <h4><strong>サービスのご提供</strong></h4> |
| 276 | <!-- /wp:heading --> |
| 277 | |
| 278 | <!-- wp:paragraph --> |
| 279 | <p>ご提案させていただいた� |
| 280 | 容にて業務を実施いたします。</p> |
| 281 | <!-- /wp:paragraph --></div><div class="vk_step_item_dot vk_step_item_style-default" style="background-color:#337ab7;color:#ffffff"><div class="vk_step_item_dot_caption">STEP</div><div class="vk_step_item_dot_num">2</div></div></div> |
| 282 | <!-- /wp:vk-blocks/step-item --> |
| 283 | |
| 284 | <!-- wp:vk-blocks/step-item {"styleLine":"none","dotNum":3} --> |
| 285 | <div class="wp-block-vk-blocks-step-item vk_step_item vk_step_item_lineStyle-none"><div class="vk_step_item_content"><!-- wp:heading {"level":4} --> |
| 286 | <h4><strong>ご� |
| 287 | �金</strong></h4> |
| 288 | <!-- /wp:heading --> |
| 289 | |
| 290 | <!-- wp:paragraph --> |
| 291 | <p>納品月の末締めで請求書を発行させていただきますので、翌月末にてご� |
| 292 | �金願います。</p> |
| 293 | <!-- /wp:paragraph --></div><div class="vk_step_item_dot vk_step_item_style-default" style="background-color:#337ab7;color:#ffffff"><div class="vk_step_item_dot_caption">STEP</div><div class="vk_step_item_dot_num">3</div></div></div> |
| 294 | <!-- /wp:vk-blocks/step-item --></div> |
| 295 | <!-- /wp:vk-blocks/step --> |
| 296 | |
| 297 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":4,"tablet":4,"mobile":4} --> |
| 298 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:4rem"></div><div class="vk_spacer-display-tablet" style="height:4rem"></div><div class="vk_spacer-display-mobile" style="height:4rem"></div></div> |
| 299 | <!-- /wp:vk-blocks/spacer --></div></div> |
| 300 | <!-- /wp:group --> |
| 301 | `, |
| 302 | }, |
| 303 | { |
| 304 | name: "Border box", |
| 305 | icon: "", |
| 306 | content: `<!-- wp:vk-blocks/border-box {"faIcon":"fas fa-exclamation"} --> |
| 307 | <div class="vk_borderBox vk_borderBox-color-red wp-block-vk-blocks-border-box is-style-vk_borderBox-style-solid-kado-tit-tab"><div class="vk_borderBox_title_container"><i class="fas fa-exclamation"></i><h4 class="vk_borderBox_title">枠線ブロックサンプル</h4></div><div class="vk_borderBox_body"><!-- wp:list {"className":"is-style-vk-check-mark vk-has-vivid-red-color","color":"#cf2e2e"} --> |
| 308 | <ul class="is-style-vk-check-mark vk-has-vivid-red-color"><li>これはリストのスタイルのサンプルです。</li><li>これはリストのスタイルのサンプルです。</li><li>これはリストのスタイルのサンプルです。</li><li>これはリストのスタイルのサンプルです。</li></ul> |
| 309 | <!-- /wp:list --></div></div> |
| 310 | <!-- /wp:vk-blocks/border-box --> |
| 311 | |
| 312 | <!-- wp:vk-blocks/spacer {"unit":"rem","pc":2,"tablet":2,"mobile":2} --> |
| 313 | <div class="vk_spacer"><div class="vk_spacer-display-pc" style="height:2rem"></div><div class="vk_spacer-display-tablet" style="height:2rem"></div><div class="vk_spacer-display-mobile" style="height:2rem"></div></div> |
| 314 | <!-- /wp:vk-blocks/spacer -->`, |
| 315 | }, |
| 316 | ]; |
| 317 | |
| 318 | const parsedTemplates = memoize(() => |
| 319 | defaultTemplates.map((template) => ({ |
| 320 | ...template, |
| 321 | blocks: parse(template.content), |
| 322 | })) |
| 323 | ); |
| 324 | |
| 325 | export default parsedTemplates; |
| 326 |