コーディングをしていて、iPhoneなどの実機でスクロールした際に画面下部にあるセーフエリアについてサイトが影響されていることはありませんか。iPhoneX以降から導入されたセーフエリアにより、スマートフォンサイトが影響されているケースが発生している場合があります。 特に画面下部にメニューを配置したデザインなどをされて...

wordpressで記事更新をしていると、新着情報のみNEWアイコンなどを付けたいと思いませんか。 HTMLとCSSだけでは新着情報にNEWアイコンの表示はできますが、期間を指定して表示することはできませんよね。そこでwordpressの機能を活用して、期間指定してNEWアイコンを表示する方法をお伝えしていきます。 w...

デバイスに合わせた画像の切り替えについて、どうのような方法をとられていますか？ 今回はレスポンシブサイトの構築時に、デバイス合わせて適切な画像を読み込み、画像を変える方法について紹介していきます。 PC用の画像とSP用の画像を読み込ませて、display:none;で表示・非表示している場合には、画像の切り替え方法につ...

フォームの入力保管機能は便利ですが、サイトの構築内容によっては、思わぬ妨害にもなってしまう場合があると思います。 そこで今回は、フォームの入力保管機能であるAutocompleteを無効にする方法について紹介していきます。 html側でフォームのAutocompleteを無効にする方法 ■フォーム全体にAutocomp...

JQueryの実行処理をレスポンシブのブレイクポイントによって、条件分岐したいときが稀にあります。 ユーザーエージェントで分岐する方法もありますが、もっと手軽に使いやすいようにレスポンシブのブレイクポイントに合わせた方法について調べてみました。 目次 ・JQueryの実行処理を条件分岐する ・jqueryの実行処理をレ...

Webサイト内で、情報を分かりやすくまとめるために、タブ切り替えのBoxを実装することは、一つの手法であります。今回はそんなタブ切り替えについて、タブとターゲットとなる切り替えBoxが離れていても動作するタブ機能をJQueryを使って実装していきます。 今までタブ切り替えを実装したことがない方は、是非参考にしていただけ...

メールアドレスを入力して、再度メールアドレスの入力間違えがないか再確認をするために、メールアドレスを入力するメールフォームが多くのサイトで採用されています。 今回はWordpressメールフォームプラグインのMW WP Formで、メールアドレスを再確認をするための設定を紹介していきます。 目次 ・メールアドレスの再入...

前回の記事で、WordpressメールフォームプラグインのMW WP Formの基本的な使い方を紹介しました。今回はメールフォームの入力チェックなどを行う、バリデーション設定について紹介していきたいと思います。 MW WP Formをまだ使ったことがない方は、是非参考にしていただければと思います。 目次 ・MW WP ...

Wordpressでメールフォームを実装する際に、どのようなフォームをお使いですか？ 今回はWordpressのプラグインで、実装の簡単さと高い機能性で定評の高いメールフォームプラグイン「MW WP Form」の使い方について紹介していきます。 Wordpressを使い始めて日が浅い方や、今までMW WP Formを使...

以前の記事でHTMLリンクでパラメータ渡しについて紹介しましたが、今回は同一ページ内でのページ内リンクでパラメータを渡す方法について承知していきたいと思います。 HTMLリンクのパラメータ渡しについて先に知りたい方は、下記記事をお読みください。 ↓↓↓↓ https://fractales.jp/javascript/...