フォームのテキスト入力エリアにプレースホルダーを表示させる（placeholder）

a-blog cmsでは、フォームのテキスト入力エリア内にあらかじめ任意の文字を表示しておくプレースホルダーの機能（placeholder）の設定が標準で実装されています。（v1.3.0より）

サンプル）

---

<form action="" method="post" name="searchForm" id="searchForm">
	<input type="text" name="keyword" value="%{KEYWORD}" size="15" class="js-placeholder" title="キーワードを入力" />
	<input type="text" name="iebug" value="" style="display:none;" class="iebug" />
	<input type="submit" name="ACMS_POST_2GET" value="検索" />
	<input type="hidden" name="tpl" value="/search.html" />
	<input type="hidden" name="bid" value="%{BID}" />
</form>

---

フォームのテキスト入力エリアにプレースホルダーを表示させる（placeholder）

1. 設定の編集

この機能の設定は、/js/acms/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。詳しくは「組み込みのJavaScriptの設定を編集する」を参照してください。

    //-------------
    // placeholder
    placeholderMark   : '.js-placeholder',
    placeholderColor  : 'silver',

placeholderMark	ここで指定したセレクタがプレースホルダーになります。
placeholderColor	プレースホルダーの文字色です。色のキーワードやRGB値（#FF0000, rgb(255,0,0),rgb(100%,0%,0%)）で指定できます。

2. HTMLとCSSの編集

HTML

指定したクラスをHTMLのinput要素もしくはtextarea要素に記述します。プレースホルダーとして表示する文字列は、title属性に記述します。

例）placeholderMarkで「.js-placeholder」と指定した場合

---

<form action="" method="post" name="searchForm">
	<input type="text" name="keyword" value="%{KEYWORD}" size="15" class="js-placeholder" title="キーワードを入力" />
	<input type="text" name="iebug" value="" style="display:none;" class="iebug" />
	<input type="submit" name="ACMS_POST_2GET" value="検索" />
	<input type="hidden" name="tpl" value="/search.html" />
	<input type="hidden" name="bid" value="%{BID}" />
</form>

---