WordPress

【WordPress】カテゴリ一覧に記事数を表示する方法|wp_list_categories・任意カテゴリ・functions.php不要

WordPressのカテゴリ一覧に記事数を表示する方法を、functions.php不要のwp_list_categories(show_count)・任意のカテゴリだけ表示するinclude・自作関数(get_categories+エスケープ)の3通りで解説します。
WordPress

【WordPress】記事一覧に連番を振る方法|カウンター変数・ページネーション対応・CSSカウンター

WordPressの一覧ページやカテゴリーページで記事に連番を振る方法を、ループ内のカウンター変数・ページをまたいで通し番号を続ける方法・PHP不要のCSSカウンター・ランキング風の番号バッジまで解説します。
WordPress

【WordPress】投稿記事をスライドで表示する方法

WordPressで投稿記事をスライド(スライドショー)で表示する方法を、プラグイン(Meta Slider)での簡単実装と、slick/WP_Queryを使った自作の2通りで解説。アイキャッチ付きスライドのコード例や、新規ならjQuery不要のSwiper.jsがおすすめという点まで紹介します。
WordPress

【WordPress】一覧ページで記事をランダムに表示する

WordPressの一覧ページで記事をランダムに表示する方法を、メインループ(pre_get_posts)・WP_Query・カテゴリ絞り込みで解説。ORDER BY RANDのパフォーマンス注意と、2ページ目以降が重複する問題をトランジェントキャッシュで安定させる実用的な対処まで紹介します。
HTML/CSS

CSSで片側だけ画面幅いっぱいに広げる方法

CSSで片側だけ画面幅いっぱいに広げる方法を紹介します。 片側だけ画面いっぱいに広げることでアクセントを付けるデザインはよく見る
jQuery

【jQuery】スクロールで追従するヘッダーの実装完全ガイド|固定・縮小・上下スライドまで

指定した位置までスクロールすると追従になるヘッダーの作り方を紹介します。 比較的よく使うテクニックなので、覚えておいて損はな
HTML/CSS

CSSで作るスライドアニメーションで右横から出てくる追従お問い合わせボタン

CSSで作るスライドアニメーションで右横から出てくる追従お問い合わせボタンの作り方を紹介します。 CSSのみでjsは未使用なので簡単・軽量です
WordPress

【Contact Form 7】formタグにclass・idを設定する方法|CSSセレクタ・デザインカスタマイズ・複数フォーム対応まで

Contact Form 7のformタグにclass・idを設定する方法を解説。html_class/html_id属性の使い方、CF7が出力するHTML構造、主要CSSセレクタ一覧、入力フィールドへのclass追加、CSSデザインカスタマイズ実例(レスポンシブ対応)、複数フォームのデザイン分け、PHPフィルターによる高度なカスタマイズまで網羅。
HTML/CSS

【CSS】背景色だけ透過させる方法|rgba・color-mix・実務パターンまで完全解説

画像やテキストなどは通常表示で背景色だけを透過させる方法を紹介します。
Webサイト全般

サーチコンソールで所有権の確認を行ったらサブドメインだけアクセスができなくなった話

先日サブドメインを使用しているサイトだけアクセスができないという現象が発生しました。同じようなことで困っている方もいると
jQuery

jQueryでスムーススクロール機能付きのトップに戻るボタンを作る完全ガイド

jQueryでスムーススクロール機能付きのトップに戻るボタンを作る方法を紹介します。 コピペで簡単に実装できるサンプルを用意したので
Webサイト全般

エックスサーバーの管理画面から.htaccessを編集する方法|FTP不要・手順とバックアップの注意点

エックスサーバーのサーバーパネルから.htaccessを編集する手順を、画像付きでわかりやすく解説します。FTPソフトやSSHを使わずブラウザだけで編集でき、リダイレクトやアクセス制限の設定にも便利です。編集前のバックアップや、構文ミスで500エラーになったときの対処法もまとめています。
Webサイト全般

.htaccessでHTTP→HTTPSリダイレクト設定|基本コード・WordPress・サーバー別対応

.htaccessを使ったHTTPからHTTPSへのリダイレクト設定方法を解説。基本の3行コード、WordPress・エックスサーバー等のサーバー別設定、www統一、301/302の違い、リダイレクトループの対処法、HSTS設定まで網羅。
WordPress

WordPressのfaviconを管理画面から簡単に設定する方法

WordPressのfavicon(サイトアイコン)を管理画面の「外観→カスタマイズ→サイト基本情報」から設定する手順と、推奨サイズ・形式、設定したのに反映されない時の対処(キャッシュ・バージョンパラメータ)、wp_headでの自動出力やapple-touch-iconまで解説します。
Cocoon

Cocoonでカテゴリーのアイキャッチ画像を設定する方法と表示されない際の対処法

Cocoonでカテゴリーごとにアイキャッチ画像を設定する手順と、設定したのに表示されない(NO IMAGEになる)原因と対処法(http/https・サイトURL・混在コンテンツ・キャッシュ)を解説。テンプレートでカテゴリーアイキャッチを表示するコード例も紹介します。
オフコン

富士通オフコンPRIMERGY 6000 ASP 調査記録まとめ

仕事で富士通製のオフコンについて調べる機会があったのですが、ググってもほとんど情報が出てこず困ったため、個人的に調査した結
HTML/CSS

【CSS】追従ヘッダーの作り方|fixed・sticky・スクロール連動の実装パターン

CSSで追従ヘッダー(固定ヘッダー)を作る方法を解説。position: fixedとstickyの違い、コンテンツのずれ防止、スクロール時の影やすりガラス効果、上スクロールで表示・下スクロールで非表示、ヘッダー縮小、z-index管理、アンカーリンク修正まで網羅。
HTML/CSS

【CSS】ボタンを作る

CSSで作るボタンを紹介します。 リンクを目立たせたい場合などに使用すると便利です。
HTML/CSS

【CSS】吹き出しを作る

CSSで吹き出しを作る方法を紹介します。 キャラクター等の画像と組み合わせることによって会話風にしたり、目立たせたい箇所に使用すると
HTML/CSS

【CSS】文字にマーカー風のラインを引く方法|グラデーション・アニメーション・複数行対応

CSSで文字にマーカー風の蛍光ペンラインを引く方法を解説。linear-gradientの基本から、太さ・色の調整、text-decorationによる方法、box-decoration-breakでの複数行対応、ホバーアニメーション、手書き風マーカー、mark要素の活用まで実践パターンを網羅。