賢威8では、これからのSEOに重要だと考えられているコンバージョンさせるためのパーツをいくつか用意しました。
商品を並べたりする際に便利なデザインになっていると思いますので、ぜひさまざまにご活用いただければと思います。
※メルマガ登録フォームやログイン機能は、ボタンや入力フォームのデザインのみで、実際にログイン機能が動作するプログラムではございません。
ご注意ください。
賢威8アップデートに伴い「Font Awesome」のバージョンが5にアップデートされました。
そのため、このページを参考にSNSボタンを設置される場合には賢威のテーマが最新版であることをご確認ください。
コメントボックス
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<div class="commentary-box"> <div class="commentary-box_inner"> <h3 class="commentary-box_title title_no-style p100-r"><span>ボーンが教える</span><br> 説得ではなく「納得」してもらう<br>文章の組み立て</h3> <div class="talker-thumb"><img alt="ボーン片桐" src="./images/sample/cast-bourne.png"></div> <p class="m0-b">何かを主張するときには、それを聞く相手が「自分事」となるような要素を見つけるようにしろ。<br> 主張を支える具体的な言葉が読み手の「自分事」になれば、読み手はその言葉が作り上げる主張を「自分事」と感じ始める。<br> そうなればやがて、相手はあなたの主張に「納得」するだろう。<br><br> 「納得」は「説得」とは異なる。<br> 説得とは相手を説き伏せることを指すが、納得とは、相手が自分の意志で他人の意見を理解することだ。<br><br> ビジネスにおいて大切なのは「人を動かす」こと。<br> 人を動かすためには、相手を説得しようとするのではなく、相手に自分で納得してもらうことが大切なのだ。</p> </div> </div> |
商品ボックス
書籍「沈黙のWebライティング —Webマーケッター ボーンの激闘—」
- 価格：
- 2,160円（税込）
謎のWebマーケッター「ボーン・片桐」の活躍を「ハードボイルドに」描いたストーリーから楽しくWebライディングを学べる実用入門書。
マンガコンテンツを通じてWebで「成果を上げる」ための文章の書き方、SEOに強いライティングのノウハウの基礎を学んだあとは、各章の終わりにある実践的・専門的な解説を読めばより深い知識を身に付けることができます。
ブロガーやライターだけでなくすべてのWeb担当者にもオススメできるライティング本です。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<div class="item-box"> <div class="item-box_thumb"> <a href="#"><img src="./images/sample/sample-book.jpg" alt="商品3" width="241" height="342"></a> </div> <h3 class="item-box_title title_no-style">書籍「沈黙のWebライティング —Webマーケッター ボーンの激闘—」</h3> <div class="item-data"> <dl> <dt>価格：</dt> <dd><span class="red f12em">2,160円</span><small>（税込）</small></dd> </dl> </div> <div class="item-box_desc"> <p class="f08em m0-b">謎のWebマーケッター「ボーン・片桐」の活躍を「ハードボイルドに」描いたストーリーから楽しくWebライディングを学べる実用入門書。<br><br> マンガコンテンツを通じてWebで「成果を上げる」ための文章の書き方、SEOに強いライティングのノウハウの基礎を学んだあとは、各章の終わりにある実践的・専門的な解説を読めばより深い知識を身に付けることができます。<br><br> ブロガーやライターだけでなくすべてのWeb担当者にもオススメできるライティング本です。</p> </div> <div class="btn-detail"> <a href="#" class="btn dir-arw_r btn_gray"><span class="icon_arrow_s_right"></span>Amazonで詳細を見る</a> </div> </div> |
商品ボックス2
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
<section class="item-box02"> <div class="item-box_inner"> <h3 class="item-box_title title_no-style">料金プラン・ご購入</h3> <div class="item-box_thumb"> <img src="./images/sample/sample-service.png" alt="商品3" width="393" height="335"> </div> <div class="item-data"> <div class="item-data_sec al-c"> 初期費用 <span class="f20em red b">5,400</span>円（税込）<br> <span class="f20em">+</span><br> 月額費用 <span class="f20em red b">1,980</span>円（税込）<br> </div> <div class="al-c"> <p class="b m0-b f20rem">支払い方法</p> <div>PayPalを用いたクレジットカード決済</div> </div> <div class="btn-detail"> <a href="#" class="btn dir-arw_r btn_orange"><span class="icon_arrow_s_right"></span>ご購入はこちらから</a> </div> </div> </div> </section> |
商品ボックス3
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
<section class="item-box03"> <div class="item-box_inner"> <h3 class="item-box_title title_no-style">賢威7 WordPress版</h3> <div class="item-box03_col_wrap"> <div class="item-box03_col item-box03_thumb"> <img src="./images/sample/package-keni7.png" alt="商品3" width="309" height="328"> </div> <div class="item-box03_col item-box03_cont"> <p>賢威のWordPressテンプレートでは、特別なプラグインを入れなくても、SEOでよく使う設定を初期設定で組み込んでいます。<br> これが、賢威のWordPressがSEOに強い理由のひとつです。</p> <table class="tl-f"> <tbody> <tr> <th>バリエーション</th> <th>カラム数</th> <th>言語</th> </tr> <tr> <td>25種類</td> <td>3パターン</td> <td>HTML5</td> </tr> <tr> <th>サーバ環境</th> <th>WPのバージョン</th> <th>-</th> </tr> <tr> <td>PHP 5.6以上<br>MySQL 5.5 以上</td> <td>WordPress 4.8 以上</td> <td></td> </tr> </tbody> </table> </div> </div> <div class="btn-detail_wrap"> <div class="btn-detail_col btn-detail_left w40 p10-r"><a href="#" class="btn btn_gray m0 w100">詳細</a></div> <div class="btn-detail_col btn-detail_right w60"><a href="#" class="btn dir-arw_r btn_orange m0 w100"><span class="icon_arrow_s_right"></span>ご購入はこちら</a></div> </div> </div> </section> |
メルマガ登録フォーム
|
1 2 3 4 5 6 |
<div class="btn_mailmaga_wrap"> <a href="#" class="btn btn_style03 w100 al-c f14rem"> <span class="btn_mailmaga"><span class="icon_mail"></span>メルマガに登録する</span><br> ブログの最新情報を確実に受け取れます！ </a> </div> |
メルマガ登録フォーム2
メールマガジンを購読する
ブログの更新情報を週1度お届けします。
メールアドレスを入力
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<div class="form-mailmaga"> <h3 class="form-mailmaga_title title_no-style"><span class="icon_mail"></span>メールマガジンを購読する</h3> <div class="form-mailmaga_inner"> <p class="m10-b">ブログの更新情報を週1度お届けします。</p> <p class="m0-b b">メールアドレスを入力</p> <form method="post"> <div class="form-mailmaga_mail"> <input placeholder="support@seo-keni.jp" size="50" type="text" id="id01" name="mail" value=""> </div> <p class="note"><small>※購読解除はいつでも可能です</small></p> <button class="btn dir-arw_r btn_style03"><span class="icon_arrow_s_right"></span>登録する</button> </form> </div> </div> |
SNSフォローボタン
|
1 2 3 4 5 6 7 8 9 |
<div class="sns-follow-box"> <div class="sns-follow-box_inner"> <p>ブログの更新情報を<br>Twitter／Facebookでチェックする</p> <div class="sns-follow-box_btns_fb"><a href="#"><i class="fab fa-facebook-f" aria-hidden="true"></i></a></div> <div class="sns-follow-box_btns_tw"><a href="#"><i class="fab fa-twitter" aria-hidden="true"></i></a></div> </div> </div> |
ログインフォーム
ログイン
SNSでログインする
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<div class="form-login"> <h3 class="form-login_title title_no-style">ログイン</h3> <div class="form-login_inner"> <form method="post"> <div class="form-login-item"> <p class="m10-b b"><label for="user_mail">メールアドレス</label></p> <div class="form-login_mail"> <input id="user_mail" name="user_mail" size="50" type="email" placeholder="support@seo-keni.jp"> </div> </div> <div class="form-login-item"> <p class="m10-b b"><label for="user_pswd">パスワード</label></p> <div class="form-login_mail"> <input id="user_pswd" name="user_pswd" size="50" type="password" placeholder="半角英数字8～12文字"> </div> </div> <div class="form-login-item_btn"> <button class="btn dir-arw_r btn_style03 "><span class="icon_arrow_s_right"></span>ログインする</button> <p class="link-next02"><a href="#">アカウントを新規で追加する</a></p> <p class="link-next02"><a href="#">パスワードを忘れた方</a></p> </div> </form> <hr data-content="OR"> <h4 class="form-login_title_sub title_no-style">SNSでログインする</h4> <form method="post"> <ul class="list-login-btn_sns"> <li class="login-btn_fb"><button><i class="fab fa-facebook" aria-hidden="true"></i> Facebookでログインする</button></li> <li class="login-btn_tw"><button><i class="fab fa-twitter" aria-hidden="true"></i> Twitterでログインする</button></li> </ul> </form> </div> </div> |
お問い合わせボタン
お問い合わせはこちらから
075-7X8-7X8
（受付時間 平日9:00～18:00）
（受付時間 平日9:00～18:00）
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<div class="contact-box"> <div class="contact-box_inner"> <h3 class="contact-box-title title_no-style">お問い合わせはこちらから</h3> <div class="contact-box_in"> <div class="contact-box-item contact-box_tel"> 075-7X8-7X8 <span>（受付時間 平日9:00～18:00）</span> </div> <div class="contact-box-item contact-box_mail"> <a href="#" class="btn dir-arw_r btn btn_style01"><span class="icon_arrow_s_right"></span><span class="icon_mail"></span>メールでのお問い合わせ</a> </div> </div> </div> </div> |
ボーンが教える
説得ではなく「納得」してもらう
文章の組み立て
何かを主張するときには、それを聞く相手が「自分事」となるような要素を見つけるようにしろ。
主張を支える具体的な言葉が読み手の「自分事」になれば、読み手はその言葉が作り上げる主張を「自分事」と感じ始める。
そうなればやがて、相手はあなたの主張に「納得」するだろう。
「納得」は「説得」とは異なる。
説得とは相手を説き伏せることを指すが、納得とは、相手が自分の意志で他人の意見を理解することだ。
ビジネスにおいて大切なのは「人を動かす」こと。
人を動かすためには、相手を説得しようとするのではなく、相手に自分で納得してもらうことが大切なのだ。