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の各用語解説リポジトリコミットチェ …
プラグイン無しでWordPressの固定ページを指定してBasic認証
Basic認証は、ページやファイルにアクセス制限をかけることができる認証方法の1つで、簡易的なセキュリティ対策に用いられる方法です。 例えば、WordPressの管理画面にBasic認証をかける場合、以下の記事の手順で「 …
デザインシステムの構築・考え方「Atomic Design」とは？
デザインシステムの構築・運用で、最もポピュラーな設計手法「Atomic Designアトミックデザイン 」について、改めて調べてみました。 サイトを構成する要素を分解してグループ化し、それらをモジュールとして定義すること …
