CSSカスタマイズのレスポンシブ対応-メールフォームプロの解決方法

今回のシステム開発で取り扱うテーマは『メールフォームプロでテキストエリアやテキストボックスがいくらCSSで指定してもサイズ変更できない場合の対処』の解決方法である。

mailform.js内にJavaScriptでフォーム部品の大きさ制御など指定する関数があったのでコメントアウトして回避
とする。

解決方法の補足として、メールフォームプロでCSSセレクタで調整できない場合、オリジナルのカスタマイズをJavaScriptで指定している場合がありJavaScriptをカスタマイズしないとスマホ表示などで期待するビジュアルに変更できない場合があるがあり、CSSカスタマイズについて今回のテーマの補足知識となります。

問題解決カテゴリーとしては、レスポンシブ対応についてのメールフォームプロに分類される。

情報について、検索エンジンでは下記の関連情報での組み合わせでインデックスされている。
スマホ メールフォーム 無料
レスポンシブ メールフォーム フリー
レスポンシブ メールフォーム テンプレート
responsive mailform
メールフォーム html
メールフォーム デザイン
メールフォーム php
mailformpro
php工房
フォームズ

Welcart会員登録フォーム必須項目のカスタマイズ

今回は、WordPressのECカートプラグインWelcartの新規会員登録時のフォーム内の必須項目を任意項目に変更する方法です。

カスタマイズはダッシュボードではできないようなので、プラグインファイルの直接編集が必要になる様子。

会員登録フォームの必須チェックは、フックで制御されているとのことで、必須チェックはusces_filter_customer_check、必須マークはusces_action_essential_markをフックとしている。

必須チェックはusces_action_essential_checkをコメントすれば通りそうなので、作業はすべて自己責任になるが、usceshop.class.phpなどを編集してみる。

何個か該当箇所が見つかったが、すべてオンライン上でのやり取りを考慮していたため、住所関連の必須項目をすべてコメントアウトしてみる。結果、任意項目にすることが成功。

次に必須項目に表示される※マーク、アスタリスクの除去。

多分、このままだと任意項目は非表示にしてしまえば問題ないだろうが、それだと主旨がことなるので、アスタリスクの除去を試みる。

usces_action_essential_markはusc-e-shop\functions\function.php内に記述があるのでそちらを手掛かりに、こちらも自己責任のもと編集してみる。

$usces_essential_markをカスタマイズして、修正ファイルをアップ。

あ、できた。

backgroundのサイズ変更-CSS背景画像のサイズを変更するの解決方法

backgroundで指定した背景画像のサイズ変更の指定方法と記述の解決方法である。

背景画像サイズを変更したいCSSセレクタのbackground-sizeプロパティで値を指定しますとする。background-size:50px 100px;background-size:50% 100%;

解決方法の補足として、値は通常の指定方法、widthやheightautoやパーセンテージ、pxなどが指定可能
があり、backgroundについての特性です。

問題解決カテゴリーとしては、サイズ変更についてのCSS背景画像のサイズを変更するに分類される。

情報について、検索エンジンでは下記の関連情報での組み合わせでインデックスされている。
css background-size
webkit-background-size
background-size cover
background-size:contain
background-size ie
background-size ie8
background-size android
background-size ie9
background-position 右から
background-size 効かない