JavaScript JS | 外部リンクに rel=”noopener nofollow” と target=”_blank” を自動で付与する方法（jQuery & Vanilla JS両対応）
Webサイト運営において、外部リンクの取り扱いはSEOやセキュリティの観点から非常に重要です。特に以下のような対応が推奨されます：外部リンクには rel="noopener nofollow" を付加（セキュリティ & SEO対策）信頼でき...
jQuery
JavaScript jQuery jQueryフォームにCSV保存機能を追加する方法
はじめに本記事では、jQuery を使ったお問い合わせフォームに、サーバーサイドでCSV保存機能を実装する方法を解説します。修正後のファイル構成今回の実装で使用するファイル構成は以下の通りです：project/│├── index.html...
jQuery jQueryフォームにCSRF対策を追加する方法
はじめにWebアプリケーションを開発する際、CSRF (Cross-Site Request Forgery) 対策は欠かせません。本記事では、jQuery を使用したシンプルなフォームに、CSRF対策を実装する方法を解説します。この記事で...
jQuery jQueryフォームにGoogle reCAPTCHAを導入する方法
はじめにGoogle reCAPTCHAを利用してスパム対策を行うことは、フォームのセキュリティを向上させるための効果的な方法です。本記事では、以前作成した「jQueryで簡易ルーティングを使った問い合わせフォームの作成方法」にreCAPT...
jQuery jQueryで簡易ルーティングを使った問い合わせフォームの作成方法
本記事では、jQuery と history.pushState を活用し、URLがページごとに変わる3ステップ構成（入力・確認・完了）の問い合わせフォームを作成する方法をご紹介します。この方法では、シングルページアプリケーション (SPA...
jQuery jQueryとPHPで作るお問い合わせフォーム
本記事では、jQueryを使用してお問い合わせフォームを作成する方法を紹介します。このフォームは、Vue.jsとPHPで作るお問い合わせフォームを基にしたものです。使用技術とバージョン情報jQuery: 3.6.4Tailwind CSS:...
WordPress WordPress | カスタム投稿タイプ「News」のプレビューボタンを多言語対応する方法
この記事では、英語と日本語を扱う多言語対応のWordPressサイトで、デフォルト言語を英語としている場合に、カスタム投稿タイプ「News」のプレビュー機能で日本語プレビュー専用ボタンを追加する方法を解説します。この設定により、英語と日本語...
WordPress WordPress | 投稿画面のメタボックスのドラッグ＆ドロップを無効にする方法
`Advanced Custom Fields PRO` や `Smart Custom Fields` で投稿画面に追加したメタボックスはドラッグ＆ドロップや矢印アイコンで上下移動出来ますが、下記サンプルでメタボックスを上下移動出来ないよ...
WordPress WordPress | 管理画面のユーザー編集ページやプロフィールページの不要な項目を非表示にする方法
ユーザー情報の編集ページの各項目のクラス名を指定して非表示にするJSのファイルを用意してアクションフックの admin_enqueue_scripts 内で wp_enqueue_script() を使ってファイルを登録します。非表示設定す...
fancybox3 fancybox3でYouTube動画をサクッと開く方法
画像や動画をページ内に簡単にオーバーレイ表示させることが出来るjQueryのプラグインfancyboxを利用してYouTube動画をサクッと表示させる方法をご紹介します。サクッと対応するためjQueryとfancyboxはCDNを利用したい...
Welcart Welcart会員登録フォームに住所自動入力機能を追加する方法
Welcartの会員登録フォームに郵便番号から住所を自動入力してくれるライブラリ「AjaxZip3」を用いて住所自動入力機能を追加する方法を書いていきます。郵便番号から住所入力用ボタン追加以下のコードを会員登録フォーム用のテンプレートに追加...
WordPress MW WP Form | 確認画面と完了ページで特定要素を非表示にする方法
MW WP Form の確認ページや完了ページで特定要素を非表示にしたい場合は、それぞれの画面で出力されるユニークなクラスを指定して jQuery & CSS で非表示にします。サンプル対象要素今回は個人情報の同意を促すメッセージの要素を非...
Welcart Welcart 複数のSKUをセレクトボックスにまとめてカートに入れる方法
商品詳細ページで複数のSKUをセレクトボックスにまとめて表示させる必要があったため有料プラグインの「WCEX SKU Select」で対応を試みたのですがレイアウト調整がうまくいかなかったので自力で対応する方法に変更して対応しました。SKU...