段組み機能
“wrapper” “row” “column” のショートコードを使用して段組みレイアウトを行います。
- “wrapper”は、セクションの縦方向のスペーシングとブロックの背景色等を設定します。
- “row”は、横幅の規定と「段組ブロック」の区切りとして使用します。”row”が閉じられる、次に始まる”row”は、いったん段組みが解除され、新たな段組みとして表示されます。
- “column”は、「段組みブロック」の中の「段」の横幅を規定します。”row”の横幅に収まる “column”は、横方向に隣り合って配置されます。
[wrapper]
[row]
[column class="w-1-2"]コンテンツ[/column]
[column class="w-1-2"]コンテンツ[/column]
[/row]
[/wrapper]
wrapper
[wrapper id="" class="bg-gray less-spacing"][/wrapper]
主に全幅(サイドバー無)テンプレートで使用します。
- id=””:id属性をもたせることで、ページ内部のアンカーポイントとなり、リンクの行き先として機能します。リンク先のurlの記述では通常のURLの後に、「”#” + “id属性”(#id-name)」を追加して適用します。同一ページ内での移動は、「# + “id属性”」のみでページ内リンクが機能します
- class=”less-spacing”:通常のブロック内の余白(縦方向)を通常より少なく取ります。
- class=”bg-white bg-gray bg-green bg-beige”:ブロックの背景色を規定するclass。
row
[row class="w-95 less-spacing"][/row]
- id=””:id属性をもたせることで、ページ内のアンカーポイントンクとなり、リンクの行き先として機能します。
- class=”w-95″:主に全幅(サイドバー無)テンプレートで、横幅をせばめて表示したいときに、”w-95″ 〜 “w-5″(wide 95% 〜 wide 5%)のclassを使用します。5%から95%まで、5%刻みのclassが規定されています。(w-5 / w-10 / w-15 / w-20 / w-25 / w-30 / w-35 / w-40 / w-45 / w-50 / w-55 / w-60 / w-65 / w-70 / w-75 / w-80 / w-85 / w-90 / w-95 )
- class=”less-spacing”:”row”(行) 内に配置された “column”(列)の隙間を通常より少ないサイズにします。
column
[column class="w-5-12"][/column]
[column class="w-7-12"][/column]
- id=””:id属性をもたせることで、ページ内のアンカーポイントンクとなり、リンクの行き先として機能します。
- class=”w-6-12″:”column”の横幅を規定します。1〜12を分母とした、整数値の分子による横幅classが規定済みです。
1:4の比率(20%:80%)
w-1-4
w-4-5
2:7の比率(22.22%:77.77%)
w-2-9
w-7-9
1:3の比率(25%:75%)
w-1-4
w-3-4
3:8の比率(27.27%:72.72%)
w-3-11
w-8-11
2:5の比率(28.57%:71.42%)
w-2-7
w-5-7
3:7の比率(30%:70%)
w-3-10
w-7-10
1:2の比率(33.33%:66.66%)
w-1-3
w-2-3
4:7の比率(36.36%:63.63%)
w-4-11
w-7-11
3:5の比率(37.5%:62.5%)
w-3-8
w-5-8
2:3の比率(40%:60%)
w-2-5
w-3-5
5:7の比率(41.66%:58.33%)
w-5-12
w-7-12
3:4の比率(42.85%:57.14%)
w-3-7
w-4-7
4:5の比率(44.44%:55.55%)
w-4-9
w-5-9
5:6の比率(45.45%:54.54%)
w-5-11
w-6-11
2等分
w-1-2
w-1-2
3等分
w-1-3
w-1-3
w-1-3
4等分
w-1-4
w-1-4
w-1-4
w-1-4
5等分
w-1-5
w-1-5
w-1-5
w-1-5
w-1-5
6等分
w-1-6
w-1-6
w-1-6
w-1-6
w-1-6
w-1-6
mat
囲いのあるハイライトブロックを生成。
[mat class="bordered"]
コンテンツ〜
[/mat]
コンテンツ〜(class=”bordered”)
コンテンツ〜(class=”bg-gray”)
コンテンツ〜(class=”bg-green”)
コンテンツ取得表示機能
サブページ取得ショートコード
ボタンスタイル
[sub-pages class="button-list"]
カードスタイル(画像付)
[sub-pages class="card-list" img="medium"]
- class=”cart-list”:カードスタイル
- class=”button-list”:ボタンスタイル
- class=”col-2/col-3″:列数を変更。(ボタンスタイルは、標準で2列。カードスタイルは標準で3列)
- parent=”slug”:別のページのサブページを表示する場合に使用(ページ指定はスラッグ)。指定しない場合は現在のページのサブページを取得する。
- exclude=”slug”:取得したサブページから特定のページを除外(ページ指定はスラッグ)。カンマ区切りで複数指定可。
- include=”slug”:指定したページのリストを取得(ページ指定はスラッグ)。カンマ区切りで複数指定可。include記述時は、parentは無効。
※スラッグでのページ指定の場合、階層がある場合は親階層の記載も必要。ex: subjects/inheritance
画像・テキスト自由記載型カード
[element-banner href="https://www.souzoku-yotsubasougou.com/consultation/message/"]
[div class="thumbnail"]
画像
[/div]
[div class="text"] 見出し
企業法務のご相談にいらした方々からの直筆メッセージ・事例を一部ご紹介いたします。
[/div]
[/element-banner]
youtubeビデオ
[youtube v="abcde" button="0 or 文字列"]
- v=”abcde” 取得するyoutubeのビデオID、URLの”v=”後の文字列
title=”タイトル” 取得するビデオのタイトル。モーダルウィンドウ下部でも表示される - button=”0/文字列” 再生ボタンを出力するか。出力しない場合は”0″。記述無しでデフォルトの「動画を再生する」を表示。文字列を入力した場合は、入力した文字列を表示。
その他のショートコード
TOC(Table Of Content)
[div class="internal-links"]
このページのコンテンツ
[/div]
このページのコンテンツ
escape
一時的に内容を隠したり、コメントを入れておくために使用します。
[escape]
このセクションは表示されません。
[/escape]
問い合わせフォーム
“お問い合わせ > コンタクトフォーム” 管理項目の一覧からショートコードをコピーします。
[contact-form-7 id="4364" title="テスト用フォーム"]
ボタン
リンク
日本公証人連合会サイト > 公証事務 > 1.遺言(ページ内の 「Q. 公正証書遺言を作成する場合の手数料は、どれくらいかかるのですか?」)