デザイナー、コーチ、ディレクター / いがわ

いがわ.

Memos

WordPressのログインパスワードを変更する方法。セキュリティ対策にも。

WordPressログインパスワード変更。セキュリティ対策。

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

WordPressのトップページがindex.phpでもfront-page.phpでもhome.phpでも問題はない。

front-page.phpやhome.phpが表示されないとき。

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

CSSでダークモード。prefers-color-schemeの使い方と効かないとき。

メディアクエリでダークモード。prefers-color-schemeの使い方と効かないとき。

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

reCAPTCHAの導入例と、バッジ（マーク）をCSSで非表示に。

reCAPTCHAの認証、導入方法。

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

WordPressから届く「モデレートしてください」を止めたい。

セルフピンバックを止めたい。WordPressのコメントモデレート。

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

ChatGPTのアクセスを制限。GPTBotにクロールさせない方法。

ChatGPTから個人情報や著作権の学習を制限するコード。

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

.htaccessや.ssh、.ftpconfigなどの隠しファイルを表示させる方法。

Macで.htaccessや.sshなどの隠しファイルを表示させる方法を知っている猫ちゃん。

隠しファイルとは？ 謝って変更や削除をしてしまわないように、デフォルトでは見えなくされているファイル。 ところがWeb制作の際に必要となる、.htaccessや.ssh、.ftpconfigなども見えない、不可視状態となってしまう。 そのようなときは、、、 ショートカットで表示させる方法。 ショートカットは以下の方法が楽。コマンドや少しの手順で表示・非...

CSSのブレイクポイントの書き方。メディアクエリはいくつがおすすめ？

レスポンシブ対応。メディアクエリの書き方の例。

ブレイクポイント、メディアクエリの最小値は？ 基本は375pxからだが。 320pxも現存している。 Webデザイナーを悩ますブレイクポイント。 Googleアナリティクスを調べていると、320pxからのアクセスは意外と多く、ユーザビリティ的に無視できない。 スマホの元祖である、初代iPhoneの横幅は320pxだった。それが基準となっているのか、2023年7...

iPhoneのブラウザでのみ表示不具合の現象に。SafariもChromeもEdgeでも。

iPhoneのブラウザでのみ表示不具合の現象に。SafariもChromeもBingでも。

iPhoneだけ表示がおかしい。 WindowsもMacもAndroidも問題なく、iPhoneだけ。 iPhoneのブラウザでだけ表示がおかしい。 このような現象は見たことも聞いたこともなく、ネット上を調べてみてもどこにも情報が見つからない。 だけども今現在、実際に起こっている。 文字コード？ Mac用のVSCodeで作成したファイルは、デフォ...

サイトが高速化？.htaccessをチェック。キャッシュ指定は要注意。

サイトが高速化？.htaccessをチェック。キャッシュ指定は要注意。

サイトの.htaccessファイルが間違っているかも。 サイトが重たいときやSEO対策をしたいとき、.htaccessで対策することが度々ある。 そのような場合、あちこちとサイトを検索して、コードを拝借して利用していることもあるだろう。 ありがたいことに、ネット上には色々とコピペOKなコードが提供されている。 ただし肝心のコピー元や自分自身のアレンジが間違っていた場...

CSS gapの使い方？Flexboxでレスポンシブ？効かないときは？

gapの使い方。対応ブラウザとflexboxでレスポンシブ。

gapとは？ CSS gapプロパティ。 gapという選択肢。 divなどで作ったボックスを並べるとき、要素間に均一な余白を開けると綺麗に見える。 これまでは「margin」、もしくは「padding」を使うのが一般的だったが、「gap」を使うという選択肢が増えた。 対応ブラウザ。 すでにモダンブラウザはgapに対応している。 参考： gap" |...

O-DANの使い方や著作権など。商用利用可なフリー素材をODAN(オーダン)。

オーダンの使い方。商用利用と利用規約。

O-DAN（オーダン） 商用利用可能なフリー写真や画像を世界から横断。 ここ数年すっかりお世話になっている、商用利用可かつ著作権フリーな写真・画像の検索サイトO-DAN。 とにかく使い勝手が手軽で、アカウント登録の必要さえもない。 基本的にクレジット表記も不要で、加工もOK。ブログの記事やアイキャッチ画像（サムネイル）にも使える。 ライセンスの例。 例外もある...

WordPress投稿の目次が消えたら！Table of Contents Plusの表示方法。

Table of Contents Plusの目次が急に消えたときの対処法。

WordPeessのブログ記事の目次が急に消えた!? ふと気づいたら、WordPressのブログ記事の目次が消えていた。 あれ？と思ったら、Table of Contents Plusのアップデートの影響らしい。 ひとまず下記の手順で解決しました。 （※特にTable of Contents Plusをダウングレードする必要はない。） 今回表示がされなくな...

“Atom.app”を開くとコンピュータが破損します。の対処法。

"Atom.app"を開くとコンピュータが破損します。ついにAtomの日の入り。

Atomがいよいよ。 開発終了が発表されていたAtomが、いよいよ使用不可となってきた。 起動しようとすると「"Atom.app"を開くとコンピュータが破損します。ゴミ箱に入れる必要があります。」という結構な強めのメッセージが表示され、起動自体ができない。 （※Macの場合。おそらくWindowsも似たようなメッセージかと思われる。） ...

CSSの変数と関数。覚えておくと便利なCSSプログラミング。

変数と関数によるCSSプログラミング。

CSSでも変数や関数が使えるように。 CSS変数やCSS関数によるプログラミング。 CSSでプログラミング。 CSSの生みの親であるHåkon Wium Lie（ホーコン・ウィウム・リー）氏はTwitterで、もともとCSSはプログラミング言語にしないようにしていた、と発言している。 そのような経緯もあったためか、長らくCSSは、変数や関数、演算などのプログラミング...