コラム記述法

導入前の課題
  • 工場のBCP対策と電気代削減によるコストカットを図りたい
導入後の成果・効果
  • 年間で約130万円の電気代削減
  • 事業継続力強化計画認定取得(BCP対策)
  • 設備導入にあたり神奈川県の補助金に採択(かながわスマートエネルギー計画)
コラム記述法

table

汎用table

tableタグに”layout_table”を付与

ああああ ああああああああ
ああああ ああああああああ
ああああ ああああああああ
	
	
cellの色を変える

th または td に、class=”stripe_cell”を付与することで、ボーダー背景に変更できる。

ああああああああ ああああああああ
ああああ ああああああああ ああああああああ
ああああ ああああああああ ああああああああ
	
	
スマホ時、スクロールtable

table要素を class=”scroll_box” を指定した要素に入れる

ああああ ああああああああああああああああああああああああああああああああ
ああああ ああああああああああああああああああああああああああああああああ
ああああ ああああああああああああああああああああああああああああああああ
	
	

scroll_innerで内包することでtable以外にも使用可能

	
	
スマホ時、thが上に来る

table要素を class=”sp_table_box” を指定した要素に入れる

ああああ ああああああああああああああああああああああああああああああああ
ああああ ああああああああああああああああああああああああああああああああ
ああああ ああああああああああああああああああああああああああああああああ
	
	

画像について

 アイキャッチについて

サイズ:800px × 450px

 figure要素

figure要素を使用すると、キャプション等も入れられて便利です。

画像のキャプション
	
	
 pc_half_img(PC時、画像サイズを50%に)

pcで画像サイズ50%かつ中央寄せ

	
	

boxスタイル

 border_box
グレー枠が付与されるboxスタイルです。
	
	

gray_box

グレー背景が付与されるboxスタイルです。
ライトブルー背景が付与されるboxスタイルです。 (class=”liteBlue_box”)
ライトレッド背景が付与されるboxスタイルです。(class=”liteRed_box”)

shadow_box

グレーの境界線と box-shadow が付与されるboxスタイルです。

description_box

タイトル
内容ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

フキダシ

アイコン画像は100×100px

アイコン左

あああああああああああああああああああああああああああああああああああああああああああああ

アイコン右

あああああああああああああああああああああああああああああああああああああああああああああ

aside


引用

ああああああああああああああああああああああああああああああああああああああああああ

ああああああああああああああああああああああああああああああああああああああああああ

引用元

listスタイル

順不同リスト(ul)

list01

  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
	
	

list04

  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
	
	

list05

  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
  • あああああああああああああああああああああああ
	
	

inline_list01

  • あああああ
  • いいいいい
  • ううううう
  • えええええ
  • おおおおお
  • かかかかか

こちらは短文ワードのリストが多いときに使えるかと思います。

	
	
例)class=”border_box”との組み合わせ

box系のクラスと組み合わせると様々なデザインに汎用的に変えられます。
以下は、class=”border_box”と組み合わせた例です。
他には、class=”gray_box” や class=”shadow_box” 等が使えると思います。

  • あああああああああああああああああああ
  • あああああああああああああああああああ
  • あああああああああああああああああああ
		
		
例)class=”icon_Blue”でアイコン色を変更

ulまたはol要素に、class=”icon_Blue” を付与し、listのアイコンカラーを変更できます。
いまは水色しか用意していないですが、必要に応じて追加します。

  • あああああああああああああああああああ
  • あああああああああああああああああああ
  • あああああああああああああああああああ
		
		

タイトル付きリスト

title_list

  • リストタイトル
    ああああああああああああああああああああああああああ
  • リストタイトル
    ああああああああああああああああああああああああああ
  • リストタイトル
    ああああああああああああああああああああああああああ

番号リスト

num_list01

  1. あああああああああああああああああああ
  2. あああああああああああああああああああ
  3. あああああああああああああああああああ

num_list02

  1. あああああああああああああああああああ
  2. あああああああああああああああああああ
  3. あああああああああああああああああああ

タイトル付き番号リスト

num_list01

  1. リストタイトル
    ああああああああああああああああああああああああああ
  2. リストタイトル
    ああああああああああああああああああああああああああ
  3. リストタイトル
    ああああああああああああああああああああああああああ

注記リスト

caution_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

caution_num_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

その他装飾リスト

voice_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

check_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

circle_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

cross_list

  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ
  • ああああああああああああああああああああああああああ

リンク

ボタン



ブログカード

ワードプレスのショートコードで記述します。

コラム記述法 コラム記述法

「/column/」以下はコラムページのパス

見積もりフォームへのカード

[quote title=”お見積りはこちら!!!”]

title=”” のところに入力したテキストが、ブログカードのテキストとして出力される。


空白または[quote]だけの場合、「お見積り作成(無料)」となる。

[quote title=””] [quote]

画像

そのままimgタグを埋め込んでもコラムの最大幅を上回らないようになっています。
最大幅以下の画像の場合、真ん中寄せになります。

回り込み画像

右回り込み

テキストが右に回り込みます。ああああああああああああああああああああああああああああああああああああああああああああああああああああ

ああああああああああああああああああああああああああああああああああああああああああああああああああああ


左回り込み

テキストが左に回り込みます。ああああああああああああああああああああああああああああああああああああああああああああああああああああ

ああああああああああああああああああああああああああああああああああああああああああああああああああああ


画像の角丸化

画像が角丸になります。


動画掲載


fontスタイル

fontサイズ

class=”f_s” フォントサイズがデフォルト値の 89% になります。(約-2pt)
class=”f_l” フォントサイズがデフォルト値の 120% になります。
class=”f_xl” フォントサイズがデフォルト値の 120% になります。

font太さ

strong要素やb要素は使用せず、こちらを使用する。

class=”f_bold” テキストが 太字 になります。

fontカラー

class=”f_Navy” フォントのカラーが ネイビー になります。
class=”f_L-Blue” フォントのカラーが ライトブルー になります。
class=”f_Gold” フォントのカラーが ゴールド になります。
class=”f_Red” フォントのカラーが レッド になります。

マーカー・ライン

class=”maker_Yellow” テキストに 半分マーカーペンを引いたようなスタイル になります。
class=”maker_Yellow_full” テキストに 全体にマーカーペンを引いたようなスタイル になります。
class=”maker_L-Bule_full” テキストに 半分マーカーペンを引いたようなスタイル になります。
class=”maker_L-Bule_full_full” テキストに 全体にマーカーペンを引いたようなスタイル になります。
class=”underline_Gold” テキストに ゴールドの下線 を引きます。
class=”underline_L-Blue” テキストに ライトブルーの下線 を引きます。

余白のスタイル

下余白

class=”m_xs” 要素の 下に5px marginをとります。
class=”m_ss” 要素の 下に10px marginをとります。
class=”m_s” 要素の 下に15px marginをとります。
class=”m_l” 要素の 下に25px marginをとります。
class=”m_ll” 要素の 下に30px marginをとります。
class=”m_xl” 要素の 下に40px marginをとります。
class=”m_xxl” 要素の 下に50px marginをとります。

上余白

class=”mt_xs” 要素の 上に5px marginをとります。
class=”mt_ss” 要素の 上に10px marginをとります。
class=”mt_s” 要素の 上に15px marginをとります。
class=”mt_l” 要素の 上に25px marginをとります。
class=”mt_ll” 要素の 上に30px marginをとります。
class=”mt_xl” 要素の 上に40px marginをとります。
class=”mt_xxl” 要素の 上に50px marginをとります。

タグ

span要素等にお使い下さい。

class=”tag_L-Blue” タグ ライトブルーのタグ
class=”tag_White” タグ ホワイトのタグ

ツールチップ

テキストにカーソルを合わせるとツールチップが表示されます

事業所の屋根・駐車場・遊休地などの敷地を活用してソーラーパネルを設置し、太陽光によって作った電気を事業所へ供給する仕組みを「自家消費型太陽光発電」といいます。 電力会社から自家消費型太陽光発電に電力の供給を切り替えることで、電気料金の負担を大幅に削減します。 また、太陽光発電によって作られた電気(再生可能エネルギー)を使うことで、CO2排出量を削減し企業価値向上に繋がります。

ツールチップの追加は、 /tooltip/tippy.js に記述していく。

CTAショートコード

自家消費型太陽光発電

Contact
太陽光発電に関する
ご相談・見積もり
はこちら

FIT権利・発電所売却

[cta_fit]

土地買取

Contact
土地・農地の買取査定
はこちら

PHPインクルードショートコード

事例スライダー


Warning: include(/home/houseproduce/taiyoukou-secchi.com/public_html/test/wp-content/themes/taiyo-new2023/include-file/jirei.php): failed to open stream: No such file or directory in /home/houseproduce/taiyoukou-secchi.com/public_html/test/wp-content/themes/taiyo-new2023/functions.php on line 216

Warning: include(): Failed opening '/home/houseproduce/taiyoukou-secchi.com/public_html/test/wp-content/themes/taiyo-new2023/include-file/jirei.php' for inclusion (include_path='.:/opt/php-7.4.33-2/data/pear') in /home/houseproduce/taiyoukou-secchi.com/public_html/test/wp-content/themes/taiyo-new2023/functions.php on line 216

PHPファイルのディレクトリは、
/taiyoukou-secchi.com/public_html/wp-content/themes/taiyo-new2022/include


執筆者:株式会社ハウスプロデュース広報部

執筆者のイラストイメージ
当社は、産業用太陽光発電システムのEPC工事を専門に手がけています。経験豊富な電気工事士やエネルギーマネジメントアドバイザーなどの有資格者が在籍。一次情報や専門家からの取材を基に、EPC事業者としての「現場から得たノウハウ」を活かしたコンテンツ作りに取り組んでいます。

Contact
太陽光発電に関する
ご相談・見積もり
はこちら

さらに詳しく知りたい方へ
気になるポイントを詳しく解説します

概算見積もりはこちら 資料イメージ
コラム記述法
https://test.taiyoukou-secchi.com/column/write-rule/