JavaScriptの.checkValidity()で必須項目を入力したら送信可能になるフォーム
BtoBのWebマーケティングで「資料請求」や「ユーザー登録」をコンバージョンとしている企業は多いと思います。 そんなコンバージョンに欠かせないフォームで、必須項目を入力したら送信可能にするスニペットをJavaScrip …
JavaScriptの.checkedでチェックボックスへ事前にチェックを入れて表示
チェックボックスの生成時点で、JavaScriptを使い「チェックを入れた状態」で生成させます。 目次HTMLでcheckedをつける場合のサンプルHTMLJavaScriptでcheckedをつける場合のサンプル実装の …
JavaScriptの.lengthで読了までの時間と文字数をカウントして表示
ブログでよく見かける「読了までの時間」を、JavaScriptで文字数を取得して出力させてみます。 文字数をカウントする要素は任意のものに変更できるので、ブログ以外でも使えます。ので、参考にしてみてください。 目次.le …
JavaScriptの.getElementsByTagNameで取得したタグの中にある文字列を取得して表示
JavaScriptの.getElementsByTagName で指定したタグの文字列を取得して、一覧を表示します。 目次.getElementsByTagName文字列を取得して表示するサンプルサンプルのコードHTM …
JavaScriptのdocument.cookieで記事一覧レイアウトの設定をページリロードしても生かして表示
JavaScriptではcookieの取得・保存・削除を行うことができます。 そんなcookieを使って、ユーザーが選択した「記事一覧レイアウト」の設定を、ページ離脱後も生かすJavaScriptのスニペットについて解説 …
プラグインなしで会員のみが閲覧可能なWordPressを構築するスニペット
WordPressで会員限定のサイトを作る場合、プラグインを入れるだけで構築できてしまいますが、今回は、会員限定のサイトをプラグインなしで作ってみます。 当サイトでも使っているWordPressテーマ「SANGO」をベー …
楽天市場商品検索APIで任意のキーワードの商品一覧を表示
楽天市場もAPIを提供しています。そんな楽天市場のAPIを「KOKONIARUKOTO.」さんのブログを参考にして色々いじってみました。 サンプルもあるので参考にしてみてください。 目次楽天市場商品検索APIとは？「ウル …
Google Books APIsでGoogleブックスから本を検索
Google Books APIsを、JavaScriptを使ってGoogleブックスから本を検索できるスニペットを作ってみました。 目次Google Books APIsとは？Google Books APIsを使った …
JavaScriptの.addEventListenerクリックで左に小さいドロワメニュー
比較的スマホ向けのUIですが、JavaScriptもコードも簡単な記述でできる左から小さめのドロワメニューです。 目次.addEventListenerのクリックドロワメニューのサンプルサンプルのコードHTMLJavaS …
期間限定で条件分岐
期間限定で何か出したい時、条件分岐を使って表示を出し分けします。 目次終了の年・月・日・時刻を指定して表示する終了の年・月・日・時刻を指定して表示の出し分け開始と終了の日時を指定して表示の出し分け 終了の年・月・日・時刻 …
