JavaScript

Splideで同じスライダーを複数設置する方法

jQueryが不要で高機能ということで最近人気のスライダーライブラリ「Splide」。便利ではあるものの、同じスライダーを複数設置するのに弱いというデメリットも存在しています。ただ、スライダーは何かと複数設置をしたい場面が多いのではないでし...
CSS

CSSだけでノイズかかった背景を作る方法

サイトをより印象的にするために背景に一工夫を入れたいことがあると思います。今回はその中でもノイズのかかった背景を作る方法を紹介いたします!完成系のイメージノイズがかかった背景を付けるだけであれば、ノイズパターンを敷き詰めるだけで完成してしま...
WordPress

Contact Form 7で年数選択を動的に作成する方法

フォームで生年月日などの項目を作るとき「年数」をセレクトで作成するとき、毎年新しい年を足して…というのは運用上少し不便。そして、項目数が多くなりすぎてしまうとユーザーにとっても使い勝手があまり良くありません。今回はそんな悩みを解決できる、運...
JavaScript

スクロールに合わせて背景色を計算して変える方法

Webサイトを作成していると背景にちょっとした工夫を入れたくなることありますよね。今回はgsapなどを使用せず、スクロールに合わせて背景色を変える方法をいくつか作成してみました!基本形まずは基本形です。スクロールに合わせてbodyに指定され...
WordPress

ACFでショートコードを埋め込む方法

WordPressのカスタマイズをしているとフォームやSNSの埋め込みなど、カスタムフィールドに入力した内容を表示させたいと思うこともあると思います。専用のテキストエリアを作成し、その内容を通常の記述で呼び出し…とすると、ショートコードのテ...
その他

get_query_varとget_post_typeの取得できる情報の差とは?

WordPressのテーマやプラグイン開発において、投稿タイプを取得する際に使用される関数として、get_query_var()とget_post_type()があります。​これらの関数は似ているようで、取得する情報や使用する場面が異なりま...
CSS

【Sassの@use完全ガイド】math, string, meta 標準モジュールを使いこなす

Sass (SCSS) を使っていて@use 'sass:math';や@use 'sass:string';といった記述を見たことはありませんか?これらはSassに組み込まれている標準モジュール (built-in modules)を読み...
WordPress

All In One SEOを使うときカテゴリーにOGP画像を設定する方法

WordPressでサイトを作るとき、SEOまわりの設定でAll In One SEO(AIO SEO)をよく使用しています。AIO SEOの無料版ではカテゴリーやタグ、タクソノミーの一覧ページにタイトルとディスクリプションの設定はできても...
HTML

pictureタグとfigureタグの使い分け方とは?

HTMLで画像を使用する際に役立つタグに、<picture>と<figure>があります。どちらも画像に関連したタグですが、用途や意味合いが異なるため、適切に使い分けることが大切です。今回はそれぞれのタグの特徴と、正しい使い分け方について解...
その他

SSLとは—Webサイトのセキュリティを高めるための基本知識

インターネット上でデータの安全を確保するため、WebサイトのSSL化は今や不可欠なものとなっています。SSL化することで、ユーザーとの通信が暗号化され、セキュリティが向上します。今回はSSLとは何か、導入のメリット、導入手順について詳しく解...