ワードプレスのプラグイン「Contact Form 7」で設定しておきたい項目
［］は半角にしてお使い下さい。上の例で全角にしてあるのは、ここで有効化されてしまうため。 これを記述したページにはメールフォームが設置されているはずです。 基本的な使い方は以上になりますが、今回はこれにプラスして設定しておいた方がいい、いくつかの項目をご紹介します。 『フォーム』の部分に下記のコードに書き換えます。 お問い合わせフォームの外見を調整する部分です。 必要に応じてさらに変更してください。 <p style="line-height:1.2;"><span style="font-size:15px;">お名前</span><span style="font-size:10px;color:#ff2121;">※必須 </span><br /><span style="font-size:10px;color:#bcbcbc;">Your Name (required)</spa
wordpress Contactform7をカスタマイズ | D-31N.COMデザインスタジオ
wordpressの問い合わせフォームを作るのに便利なContactform7 他にも問合せフォームを作るプラグインはあるけれど、やっぱり私はこれに頼らざるえない。 だが他の問合せフォームで見るような２点の機能が無い。それは・・ ■ 確認用にメールアドレスを２回入力させ、尚且つチェックする機能 ■ 郵便番号を入力すると自動で住所が入力される機能 というわけで 上記の２点をContactform７に対応させてみました。 確認用にメールアドレスを２回入力させ、尚且つチェックする機能 こちらはとても簡単に実装出来ます。Contactform7は透かし文字も入れられるので、下の画像のようにテキストエリアに文字を入れられます。 1:まずfunction.phpに下記の記述を追加します。 /* custom contactform7 */ add_filter( 'wpcf7_validate_ema
クリックするとフォーム内の字が消えるJavascript * Devotion Time
検索やメールアドレス記入のための入力フォームに、あらかじめ「検索キーワードの挿入」といった薄い文字が記されていて、クリックすると消える。しかもフォームの外をクリックすると字が復活する、そういう入力フォームをhtmlとjavascriptで簡単に実装しましょう。 フォーム内のvalueの値はjavascriptと関係なく自由に変えることができます。 <form> <input type="text" value="ご記入下さい" onFocus="cText(this)" onBlur="sText(this)" style="color:#999"> </form> <script type="text/javascript"><!-- function cText(obj){ if(obj.value==obj.defaultValue){ obj.value=""; obj.style
CSS3とjQueryでフォームを美しく装飾する方法
2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです！そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト！ フォームの仕様 今回チャレンジするフォームの主な仕様です！ グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける（モダンブラウザ） 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ？という人もひとつひとつ記述していけば意外と簡単に作れるはずです！リンクをクリックで各項目にジャンプします。 テキストボック
ログインフォームに大切な7つの要素と重要な1つの機能
ログインフォームを実装する際に、大切な7つの要素と重要な1つの機能を紹介します。 元記事では下記のCSS3で実装されたフォームもダウンロードできます。 フォームのタイトル このフォームが何についてのものであるか手短に説明されたタイトル。特に、ウェブサイトの名称を記すことは非常に重要です。 非メンバー用のリンク 非メンバーが偶然、このページを見つけてしまうことがあるかもしれません。そして、メンバーを増やすチャンスもあるので、登録ページへの誘導も行っておきます。 ラベルとフィールド ログインフォームは通常、2つのフィールドで構成されていますが、ラベルは読みやすいようにします。 パスワードを忘れた場合 これは同じく、非常に重要なリンクです。多くのユーザーは多数のアカウントとパスワードをもっているものです。そして、しばしばそれはあなたのサイトでどれなのか忘れてしまうことがあります。 また、配置する
Google Chromeでfloatレイアウトが崩れる件について
Google Chromeでfloatレイアウトが崩れる事象が発生しました。 かなりレアケースと思われますが、備忘録として以下に詳細を残しておきます。 １．サンプル サンプルはdl/dt/dd要素を使ったfloatレイアウトで、コメントフォームを想定しています。 (X)HTML（赤色が対象部分） <?xml version="1.0" encoding="euc-jp"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Wordpress】Contact Form 7を使ってメールフォームを設置する | bibouroku
Login Forms Design Gallery | Smiley Cat