WordPressのセキュリティ問題と脆弱性。 WordPressのセキュリティ強化とシェア率。 WordPressのセキュリティ対策とシェア率の高さ。 現在は世界中のWebサイトの約40%が、WordPressでできて言われている。WordPressのシェア率の高さはかなり以前から言われており、徐々にシェア率を伸ばしてきた。 そのため、ターゲットとして狙われやすい...

VS Codeが折り返していない！？ VS Codeのコードが折り返さずにはみ出てしまう。 コードが右端で折り返していない。 VS Codeでコーディングをしているときに、コードがはみ出ていることに気がつくことがある。 直したはずなのに、また折り返しにならないことも。 VS Codeの折り返しの設定箇所は複数ある。 右端での折り返...

FigmaでデザインされたWebサイト。 Figmaでデザインされたサイトの判断。 このサイトはFigmaでデザインしている？ 現代ではさまざまなデザインツールが普及している。 そのため、Webサイトの見た目だけで、使用しているデザインツールを特定するのは難しい。 またFigmaには、WordPressやWix、STUDIO、Canvaなどのような、Webサイ...

CSS擬似要素のfirst-letter。 first-letterは、最初の一文字という意味。 ::first-letter 「first-letter」を日本語にすると、そのまま「最初の一文字」となる。 Webデザインをしているとき、その「最初の一文字」だけのデザインを変えたいときがある。 最初の一文字だけデザインを変えたい。 例えば見出しの最初の一...

VS Codeの日本語設定。 VS Codeの「Extensions（拡張機能）」から。 Extensions - 拡張機能 VS Codeの拡張機能である、「Japanese Language Pack for Visual Studio Code」を使うと、数ステップで簡単に日本語化ができる。 Extensionsから、「Japanese Languag...

ブロックレベル要素とインライン要素の再認識。 ブロックレベル要素とインライン要素はどこに？ ブロックレベル要素とインライン要素は無くなるはずだった。 かつてHTML5からは、各要素からブロックレベルとインラインの区分けが無くなると言われていた時期があった。 実際、MDNのサイトでは無くなっている。 参照：Block-level content (ブロックレベル...

カラーパレットと色相環。 色相環ベースのカラーパレット。 Color Wheel デザイナーは色彩を適切に選択し、調和のあるカラーパレットを作成することが求められる。 そんなときに便利なのが、Web上で色相環を基にカラーパレットを作れるジェネレーター。 参照：https://www.figma.com/ja-jp/color-wheel Color ...

WordPressの条件分岐でGAのコードを設置。 WordPressの条件分岐で、自分のアクセスを除外。 WordPressの場合。 WordPressに慣れている場合は、IPアドレスを使った除外や、オプトアウトのアドオンよりも設置が簡単。 IPアドレスの場合。 意外と知られていないのかもしれないが、固定IPアドレスを使用していない場合は、日にちの経過やルー...

AppleのCM。 AppleのiPad Pro。 Crush Apple製品のユーザーとしてたびたび感じるが、AppleのCMは、一体なんなんだろう。 楽器が欲しくても買えない人、また、演奏家や楽器製作者、アニメ制作者や彫刻家、作家が見たらどう思うだろう。 ※2024.05.10 追記） Appleが謝罪したとの報道がありました。 A...

メディアライブラリの「未添付」検索では追いつかない。 増えていく不要なメディアファイル。 メディアファイルを減らしたい。 WordPressでサイト運営をしていると、ついついと使っていない画像が溜まってしまうことがある。 特に更新頻度が高いサイトや、ブログを運用している場合などは、結構な数のファイルがメディアライブラリ内に含まれていく。 〜中略〜 未...

WordPressで自動挿入されるショートコード、[caption]。 [caption]が自動挿入されるとき。 WordPressの投稿時に、「メディアを追加」ボタンから画像を挿入しようとすると、自動的にキャプション用の[caption]のショートコードが入ることがある。 &lbrack...

WordPress管理画面へログインして設定・変更。 WordPressの乗っ取り被害に遭わないように。 WordPressのセキュリティ。 WordPressは人気があり、普及率が高いため、セキュリティには注意が必要。 他のオンラインサービスと同様、パスワードを複雑にしたり、定期的に変更するのは有効な手段のひとつ。 ユーザー名は変更できないが、パスワードは簡...

rgb()で透明度も指定可能に。 rgb()関数での色指定。 rgb()の新しい書き方。 rgb(r g b) rgb(r g b / a) Red（赤） Green（緑） Blue（青） Red（赤） Green（緑） Blue（青） / Alpha（アルファ） カンマからスペースでの区切りへ。 rgbの値はこれまで通り0〜255。区切りが...

WordPressのトップページのテンプレート。 トップページ用の３つのテンプレートファイル。 トップページにindex.phpを使うのは間違いなの？ 会社やチーム、大規模なプロジェクトなどで「共通したルール」がある場合は別として、個人や少人数で制作する場合はindex.phpでも全然構わない。 トップページにfront-page.phpやhome.phpを使用。 ...

prefers-color-schemeとは？ メディアクエリでライトとダークを切り替え。 CSSのメディアクエリで「prefers-color-scheme」を使うと、ライトモードとダークモードを切り替えられる。 ダークモード・ライトモードの切り替えは、スマホの普及によりユーザーの視聴時間が増えたこともあり、OSレベルでは必須的な機能となってきている。 ...

reCAPTCHAとは？ Googleによる認証システム。 「reCAPTCHA」は、Googleが提供している認証システム。 1か月あたり100万件まで無料で利用でき、人間とbotを区別し、スパムなどからサイトを保護してくれる。 設定方法は少し手間がかかるかもだが、慣れれば数分〜10分ほどで導入できる。 reCAPTCHAのバージョン。 ...

CSSで縦書き。writing-modeの使い方。 CSSの縦書き方法。 writing-modeの実装。 CSSによる縦書きは簡単で、最低限、以下の指定で実装できる。 サイト全体を縦書きにするのはもちろん、見出しやアクセントとして一部分への指定する際も、下記の記述が基本となる。 CSS .selector { writing-mode: ver...

「モデレートしてください」が止まらないとき。 WordPressの投稿画面で、自分の記事にリンクを張った場合、「モデレートしてください」という通知が届くことがある。 本来は他のブログからリンクが張られたときに届く通知 (ピンバック・トラックバック)の設定だと思うが、なぜか自分自身から通知が届いてしまう、「セルフピンバック」という現象らしい。 セルフピンバックへの対...

ChatGPTに、個人情報や著作権を学習されたくないとき。 ChatGPTから個人情報や肖像権を制限。 ChatGPTは便利な反面、勝手にAIに学習されると困るという場合がある。 例えば... 個人情報が含まれるサイト。 著作権があるコンテンツ。 ログインが必要なサイト。 有料コンテンツがあるページ。 など。 そのような場合は、「robots....

scroll-snap-typeの使い方例。CSSでシンプルなカルーセル。 CSSカルーセル。 ちょっと前まではJavaScriptが必須だった、カルーセルやスナップするスクロール。 いまではもう、CSSだけでも結構いける。 スマホのスワイプにも対応している。 scroll-snap-typeの特徴。 CSSのみ。JavaScriptが不要。 sc...