JavaScriptのsetInterval()でページ上部にプログレスバーを表示
プログレスバーは、ユーザーが長い時間を要するタスクの進行状況を視覚的に把握でき、邪魔にもならずユーザーの体験を向上することができます。また、待ち時間のストレスも軽減できます。 今回は、そんなプログレスバーをsetInte …
JavaScriptのscreenでモニターのサイズを取得してアラート表示
今回は、Javascriptの screen プロパティで、使用しているモニターのサイズを取得して、ブラウザの上部にアラートで上部に表示させます。 目次screenモニターのサイズを取得してアラート表示するサンプル実装の …
JavaScriptの.sessionStorageで初回アクセス時にローディングアニメーション
今回は、初回アクセス時にローディングアニメーションを表示させます。 この記事は、以前jQueryで書いたコードをネイティブなJavaScriptに書き直しているものなので、上記の記事のjQueryのコードも一緒に参考にし …
Google ポリシーオフィスアワー 2023.1.26
2023年1月26日に、Googleポリシーオフィスアワーが開催されました。 今回のポリシーオフィスアワーは、ログインが必要なページのコンテンツの話や、URLを変更した際の対処法についてなど、盛り沢山の内容です。 目次ド …
JavaScriptの.setTimeout()でページ上部にtoastを表示
モーダルのように、ユーザーに「開く・閉じる」行動を矯正させることなく、もっとライトにメッセージを表示させたい時は toast（トースト）があります。 この記事ではそんな toast UIをJavaScriptの .set …
メインクエリ
WordPressで簡単に記事一覧を表示できる query_posts() のメインクエリ。 query_posts()のメインクエリは現在非推奨となっていますが、メインクエリのカスタマイズについて解説します。 メインク …
JavaScriptの.addEventListener()のchangeでラジオボタンをクリックで要素のソート
table タグで書かれた一覧表に、ソートをかけるライブラリをよく見かけます。 が、汎用的にソート機能を追加したいときに使えるスニペットを作ってみました。 是非、参考にしてみてください。 目次.addEventListe …
JavaScriptの.closest()で要素外をクリックしたら閉じるフローティングメニュー
今回の記事は、以前作成した以下UIをベースに「よりユーザーフレンドリーな動き」をJavaScriptで付けます。 と言っても、メニュー要素外をクリックした時にメニューが閉じるだけなのですが、これだけでユーザーの体験が変わ …
関係（関連記事）の出力
プラグインのAdvanced Custom Fields (略してAFC)を使用して、投稿ページから任意の記事を指定して出力します。 目次フィールドで指定した記事一覧の出力chart.jsで指定した記事を棒グラフで出力 …
デザイナーのためのGit用語集
かつての自分もそうでしたが、用語がわかれば解説書を読み進めていても理解が進み、何より楽しくなります。 この記事では、そんなGitの用語について解説していきます。 目次Gitって何？Gitの各用語解説リポジトリコミットチェ …
