テンプレート一覧

ついてくるフッター_シングル

修正中

ついてくるフッター_ダブル（横並び）

修正中

直にカゴへ

[contact-form-7 id="3386" title="休業期間のお知らせ"]

<!-★★の部分を適宜変更してください-->
<!--非表示にしたい時は全文をコメントアウトで囲むか、このページの内容を消去してください-->
<!--以下テンプレート
<h2>★★休業のお知らせ</h2>
<p>平素は格別のお引き立てをいただき厚くお礼申し上げます。</p>
<p>当院では、誠に勝手ながら下記日程を★★休業とさせていただきます。</p>

<h3>◆ ★★休業期間◆</h3>
<p>2023年★★月★★日(★)～2023年★★月★★日(★)</p>

<p>休業期間中にいただいたごお問合せにつきましては、</p>
<p>休業明けの営業開始日以降に順次返信させていただきます。</p>
<p>皆様には大変ご不便をおかけいたしますが、何卒ご理解の程お願い申し上げます。</p>
-->

サイト内検索

タイトル

タイトル

名前

指導士になりたいあなたへ

<h2 class=”blueBird”>指導士になりたいあなたへ</h2>

<h2 class="pinkGradation--outside">タイトル</h2>

タイトル

<h2 class="pinkGradation--outside--left">タイトル</h2>

ジャンプ先の名前など
ジャンプ先の名前など
入れ子にしたい時
さらに入れ子にしたい時
ジャンプ先の名前など

<section class=”APNA_index”>
<details>
<summary>目次</summary>
<div class=”details-content”>
<ul>
<li><a href=”#ジャンプ先のidの中身”>ジャンプ先の名前など</a></li>
<li><a href=”#ジャンプ先のidの中身”>ジャンプ先の名前など</a></li>
<li><a href=”#ジャンプ先のidの中身”>入れ子にしたい時</a>
<ul>
<li><a href=”#ジャンプ先のidの中身”>入れ子にしたい時</a></li>
<li><a href=”#ジャンプ先のidの中身”>入れ子にしたい時</a></li>
<li><a href=”#ジャンプ先のidの中身”>入れ子にしたい時</a></li>
</ul>
</li>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a>
<ul>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a></li>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a></li>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a>
<ul>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a></li>
<li><a href=”#ジャンプ先のidの中身”>さらに入れ子にしたい時</a></li>
</ul>
</li>
</ul>
</li>
<li><a href=”#ジャンプ先のidの中身”>ジャンプ先の名前など</a></li>
</ul>
</div>
</details>
</section>
入れ子にしたい時は該当箇所のliを閉じる手前にulで新しいリストをぶち込むイメージ
現在は見出し（h2タグ）の上基準で入れてます！
<div id=”目次と同じ名前” class=”fixedAdjust”></div>
<h2 class=”fusen”>診療方針</h2>

見出し

小見出し

タイトル

本文

本文
本文

<details>
<summary>タイトル</summary>
<div class=”details-content”>
<p>本文</p>
<p>改行すると<br>
これくらいの行間</p>
</div>
</details>

薄緑背景点線ボックス

項目	項目
内容	内容
内容	内容
内容	内容
内容	内容

タイトル

文章

リンク

            <details>
              <summary>タイトル</summary>
              <div class="details-content">
              <p>本文</p>
              <p>改行すると<br>
              これくらいの行間</p>
              </div>
              </details>

左側

右側

タイトル

本文

お名前

<div class="balloon_l">
  <div class="faceicon"><img src="/wp-content/uploads/2023/03/icon-human.png" alt="" loading="lazy"></div>
  <div class="says">
    <p>左側</p>
  </div>
</div>

<div class="balloon_r">
  <div class="faceicon"><img src="/wp-content/uploads/2023/03/icon-human.png" alt="" loading="lazy"></div>
  <div class="says">
    <p>右側</p>
  </div>
</div>

<article id="APNA_studentVoice">
  <section>
    <div class="balloon_l">
      <div class="faceicon"><img src="/wp-content/uploads/2023/03/icon-human.png" alt=""></div>
      <div class="says">
        <p>タイトル</p>
      </div>
    </div>
    <div class="balloon_l--inside">
      <p>本文</p>
      <p class="balloon_l--inside--name">お名前</p>
    </div>
  </section>
</article>

手書き風英字のCSS見出し

白

黒

ピンク

緑

名前

左側

右側

<h2 class="heading07" data-en="Recruit">手書き風英字のCSS見出し</h2>
  <h2 class="cursive--white--diagonal" data-en="Recruit">白</h2>
  <h2 class="cursive--black--diagonal" data-en="Recruit">黒</h2>
  <h2 class="cursive--pink--diagonal" data-en="Recruit">ピンク</h2>
  <h2 class="cursive--green--diagonal" data-en="Recruit">緑</h2>
  <h2 class="cursive--white" data-en="Text">名前</h2>
  <h2 class="cursive--black" data-en="Text">名前</h2>
  
<div class="balloon_l">
  <div class="faceicon"> <img src="/wp-content/uploads/2023/03/icon-animal.png" alt="" loading="lazy"> </div>
  <div class="says">
    <p>左側</p>
  </div>
</div>
<div class="balloon_r">
  <div class="faceicon"> <img src="/wp-content/uploads/2023/03/icon-animal.png" alt="" loading="lazy"> </div>
  <div class="says">
    <p>右側</p>
  </div>
</div>

横並びボタンボタンボタン縦並び

ボタン

/*横並び*/
<a href="リンク" class="APNA_btn">ボタン</a>
<a href="リンク" class="APNA_btn">ボタン</a>
<a href="リンク" class="APNA_btn">ボタン</a>

/*縦並び*/
<div><a href="リンク" class="APNA_btn">ボタン</a></div>
<div><a href="リンク" class="APNA_btn">ボタン</a></div>
<div><a href="リンク" class="APNA_btn">ボタン</a></div>

<p><a href="リンク" target="_blank" class="column1--buy--supplement"></a></p>

<p><a href="リンク" target="_blank" class="column1--buy--amazon"></a></p>

<p><a href="リンク" target="_blank" class="column1--buy--rakutenBooks"></a></p>

テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力

テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力

テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力

<div class="box--heartful--border--double">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

<div class="box--heartful--blah">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

<div class="box--heartful--border--dashed">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

<div class="box--confidenceInFood--border--double">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

<div class="box--confidenceInFood--blah">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

<div class="box--confidenceInFood--border--dashed">テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力テキストを入力</div>

テキスト

<h2 class="i--nabe--white bar--orange">テキスト</h2>

LPなどでヘッダー、フッターなどを削除したい時

<style type="text/css">
#header, #footer_information, #footer_banner, #footer_menu_area, #footer_bottom, #footer_button, #dp-footer-bar{
    display: none;
}
</style>

受講者様の声

さま

テキスト

  <div class="TestimonialsFromStudents">
    <h2>さま</h2>
    <p>テキスト</p>
  </div>

ついてくるフッター_シングル

ついてくるフッター_ダブル（横並び）

タイトル

タイトル

名前

指導士になりたいあなたへ

タイトル

見出し

小見出し

小見出し

手書き風英字のCSS見出し

白

黒

ピンク

緑

名前

名前

テキスト

LPなどでヘッダー、フッターなどを削除したい時

受講者様の声

さま

メルマガはこちら

お問い合わせ

HOME

講座について

資格について

受講者の声