JavaScript

WordPressの古いリビジョンをまとめるカスタムプラグインを作った とりあえずのメモ

WordPressの古いリビジョンをまとめるカスタムプラグインを作った

WordPressの古いリビジョンを整理するカスタムプラグインを作成しました。このプラグインは一週間以上前のリビジョンから日ごとに最新の一つだけを残し、データベースの肥大化を防ぎます。管理画面からリアルタイムで進行状況を確認でき、毎日自動実行されるため効率的なサイト管理ができます。WordPressの記事保存の処理は、体感ではそこまで速くはなりませんでした。編集履歴を管理するプラグインを作ったWordPressで記事を保存する処理が遅くなってきた気がします。リビジョン(編集履...
WordPressの編集画面での差し替えた画像が古い状態で表示される?(画像キャッシュ) とりあえずのメモ

WordPressの編集画面での差し替えた画像が古い状態で表示される?(画像キャッシュ)

WordPressの画像キャッシュ問題により、差し替えた画像が古い状態で表示されることがあります。これは、ブラウザのキャッシュと画像URLの仕様が主な原因でした。キャッシュが読み込まれないように、functions.phpに管理者用に JavaScriptのコードを追加して、動的に画像URLにタイムスタンプを付与するようにしました。WordPressの画像キャッシュ問題WordPressでサイトを運営しているのですが、差し替えた画像ファイルをプラグイン(Media Clean...
AIプログラミングでタイピング練習ゲームを作った AIの話題

AIプログラミングでタイピング練習ゲームを作った

HTMLとCSS、JavaScriptでシンプルなタイピング練習ゲームを作りました。インストール不要でブラウザから動作し、シンプルで読み込みが早いことを目指しました。(公開サイト)AIプログラミングで工夫した点(仕様書とファイル構成)Claude 3.5 Sonnetで作成していったのですが、すぐにチャットの文字数上限になってしまいます。続きをプログラムしようにも、一からやり直しになってしまいます。そこで、チャット上限に近づいたら、「プログラム仕様書とファイル構成」を.md(...
アカウント登録の練習用ダミーページを作った(PHP) とりあえずのメモ

アカウント登録の練習用ダミーページを作った(PHP)

アカウント登録の練習用ダミーページをPHPで作成しました。このページでは、データを実際に送信せずにローカルで処理し、パスワード入力やフォーム検証の練習ができます。アカウント登録の練習用ダミーページを作ったブラウザで開いてパスワード入力を練習するためのページを作りました。練習用ページでは、実際のデータは送信されず、ローカルで処理されます。データの非保存:フォームのsubmitイベントをJavaScriptで制御し、実際にはデータを送信せず、ローカルで処理しています。フォーム検証...
WordPressにSVG画像をアップロードできるようにした(functions.php) とりあえずのメモ

WordPressにSVG画像をアップロードできるようにした(functions.php)

WordPressではセキュリティ上の理由からSVGファイルのアップロードが制限されています。functions.phpにカスタム関数を追加すれば、ブログエディタでのSVGアップロードを許可できます。ただし、アップロードを許可する場合、リスクも認識しておくことが大事です。「このファイルタイプ(SVG)をアップロードする権限がありません」WordPressにSVGファイルをアップロードしようとしたらエラーになりました。このファイルタイプをアップロードする権限がありません。fun...
[JavaScript]目次の開閉状態をCookieで記憶させた とりあえずのメモ

[JavaScript]目次の開閉状態をCookieで記憶させた

JavaScriptを使用して目次のチェックボックス状態をCookieに保存するようにしてみました。ページ再読み込み後も状態を維持するためにイベントリスナーで設定しています。ちらつき防止のためのCSSも設定しました。JavaScriptコード前回は、サイドバーに目次を追加しました。チェックボックスの状態をJavaScriptを使ってCookieに保存し、ページを再読み込みした後もその状態を維持するようにしてみました。/** 2024-08-30 チェックボックスの状態を保存す...
[Electron]連続コピーアプリを作ってみた(monclip) Mac

[Electron]連続コピーアプリを作ってみた(monclip)

Electronを使用してMac用のクリップボード記録アプリを作成しました。このアプリは、コピーした内容を自動的に記録していき、まとめて編集・利用できるようにします。ネットショッピングやレポート作成時の情報収集に便利で、簡単な操作で使用できます。クリップボード記録アプリを作った自分のMac用に「クリップボード記録ツール(monclip:Monitor Clipboard)」を作りました。パソコンで文字をコピーするたびに、その内容を自動的に記録してくれます。(ダウンロード:動作...
[WordPress]ブロックエディタに「書式のクリア」のショートカットキーを追加した(functions.php) とりあえずのメモ

[WordPress]ブロックエディタに「書式のクリア」のショートカットキーを追加した(functions.php)

WordPressのブロックエディタに「書式のクリア」のショートカットキーを追加しました。functions.phpとcustom-editor.jsを使用して、Command+Jで「書式のクリア」をできるようにしました。「書式のクリア」のショートカットキーを追加したいWordPressのブロックエディターにControl+Spaceでテキストの書式をクリアするショートカットキーとして「Command+J」を追加しようと思います。ブロックエディタの「書式のクリア」は、そのほか...
[偽roundcube]「Password key expired(パスワードキーの有効期限が切れました)」という詐欺メールが届いた とりあえずのメモ

[偽roundcube]「Password key expired(パスワードキーの有効期限が切れました)」という詐欺メールが届いた

roundcubeのアイコンで「パスワードキーの有効期限が切れました」というメールが届きましたが、これはフィッシング詐欺の可能性が高いです。送信者のメールアドレスやリンクのURLに不自然な点がありました。けっこう、cPanelを狙い撃ちにした迷惑メールか届くから、メールアドレスがそういう名簿に乗ってしまったんだろうね……。「パスワードキーの有効期限が切れました」とは?このメールは、一見すると重要なお知らせのように見えます。しかし、セキュリティ上の緊急性を煽っているメールには、...
ネット広告と広告ブロッカーの難しさ(権限の強さとビジネスの脆弱性) インターネット小話

ネット広告と広告ブロッカーの難しさ(権限の強さとビジネスの脆弱性)

インターネットを閲覧していると「詐欺まがいの悪質な広告」が増えています。対策の1つとして「広告ブロッカー」がありますが、どの広告ブロッカーを選ぶかは難問です。広告ブロッカーの要求するアプリ権限は大きいため、開発元が不審な動作を加えないかチェックする必要があるからです。広告ブロッカーの技術的なアプローチ広告ブロッカーには、大きく2通りのやり方があります。広告ブロッカーの種類コンテンツフィルタリングブラウザ内で動作するページ内の特定の要素を消すDNSフィルタリングネットワークレベ...
[WordPress]管理者ログインしていないときだけ実行するJavaScriptを追加した(分離) ホームページ運用

[WordPress]管理者ログインしていないときだけ実行するJavaScriptを追加した(分離)

以前に、下にスクロールするとヘッダーメニューを半透明にするスクリプトを入れました。しかし、自分がログインしているときは不要なのでオフにすることにしました(画面録画するときに撮影範囲がわかりにくい)。環境:WordPress, Cocoon, Cocoon子テーマいったん javascript.jsの以下のコードを削除して、管理者ログインしていないときに限定します。/** * 2024-07-04 管理者ログインしていないときのスクリプトを分けた * 下にスクロールするとヘッダ...
子どもにとってのViscuitの魅力(プログラミング学習) とりあえずのメモ

子どもにとってのViscuitの魅力(プログラミング学習)

小学3年生の子どもがプログラミングに興味を示したので、3つの候補(Scratch、Processing、Viscuit)を見せてみました。子どもが最も興味を示したのは Viscuit。ルールの小さな変更が大きな変化をもたらすダイナミックさが子どもにとって面白いようで、夢中で遊んでいます。「自分で作ったルールによって動く世界」。思い通りにならないことも学びにつながるのかも。YouTube動画でも話しています。プログラミング言語を選ぶ最近、小学3年生の子どもが「パソコンでプログラ...
【解説】入力しやすいパスワードを考えてくれるツールを作った(パスワードエントロピーと入力) #非営利

【解説】入力しやすいパスワードを考えてくれるツールを作った(パスワードエントロピーと入力)

ツール本体へ(広告なし・軽量版)パスワードは毎回 ランダムに生成されます。気に入ったパスワードをタップするとコピーできます。ほかのパスワード候補に変える function generatePasswords() { const symbols = "!@#$%^&*()_+"; const letters = "abcdefghijkmnopqrstuvwxyz"; const numbers = "23456789"; let passwordsList = ""; for...
[JavaScript]全選択で記事部分だけになるようにした とりあえずのメモ

[JavaScript]全選択で記事部分だけになるようにした

自分のサイト内の記事全体を選択しやすいように、スクリプトを作りました。window.getSelection()テーマのjavascript.jsに以下のコードを追加しました。document.addEventListener('keydown', function(event) { if ((event.ctrlKey || event.metaKey) && event.key === 'a') { event.preventDefault(); const articl...
[Electron]今日の日付カレンダーアプリを作った(Calectron) とりあえずのメモ

[Electron]今日の日付カレンダーアプリを作った(Calectron)

Electronを使用して、Windows 7のガジェットにあったカレンダーのようなアプリケーションを作成しました。このアプリケーションは、今日の日付と曜日を表示するだけのシンプルなものです。macOS風にデザインを変更し、タイトルバーを削除して、ウィンドウ全体をドラッグできるようにしました。Windows 7のカレンダーのようなアプリを作ったElectronで Windows 7の「ガジェット」にあったカレンダーのようなものを作りました。ただ、今日の日付・曜日を表示するだけ...
[JavaScript]下にスクロールするとヘッダーメニューを半透明にするようにした プログラミング

[JavaScript]下にスクロールするとヘッダーメニューを半透明にするようにした

Xのタイムラインを見ていたら、画面のメニューバーの透過度が上下のスクロールに応じて変化していることに気づきました。少し下にスクロールすると半透明になり、少し上にスクロールすると元に戻っています。自分のサイトのヘッダーメニュー(mobile-header-menu-buttons)でも、このような処理をするように、JavaScriptを作りたいと思います。画面内の情報の表示範囲が増えるからです。javascript.jsとstyle.css機能ユーザーがページを下にスクロールす...
なぜオンライン版ExcelでエクスポートしたPDFが「JavaScriptの機能を使用している」の?(自動印刷処理) とりあえずのメモ

なぜオンライン版ExcelでエクスポートしたPDFが「JavaScriptの機能を使用している」の?(自動印刷処理)

オンライン版Excelからエクスポートした PDFで、JavaScriptの機能が使用されているという警告が表示されました。これは、PDFを開いたらすぐに印刷できるスクリプトが埋め込まれているためです。しかし、PDF内のJavaScriptにはセキュリティ上の懸念もあり、なるべくならオフにしておきたいです。追記:2024-08-01「印刷」から「PDFとしてエクスポート」したときには JavaScriptが埋め込まれているものの、「エクスポート」からPDFをダウンロードした場...
詐欺サイトはスマホを狙う(ユーザーエージェント) とりあえずのメモ

詐欺サイトはスマホを狙う(ユーザーエージェント)

クレジットカードなどの利用照会を装うメールから偽サイトに誘導する詐欺が横行しています。ところが、パソコンからアクセスすると適当な大手サイトにリダイレクトされました。スマートフォンからアクセスしたときだけ偽のログインページを表示するように、「ユーザーエージェント」という情報を使っていました。詐欺メールがスマートフォンを狙うのは、コンピュータ関係に詳しくない利用者が多い、と考えられているからでしょう。スマートフォンは手軽に使い始めることができますが、情報セキュリティについて自分で...
いかがわしいサイトを見てしまったけれど「大丈夫」?【アプリ サンドボックス】 Android

いかがわしいサイトを見てしまったけれど「大丈夫」?【アプリ サンドボックス】

一般的には「もし、いかがわしいサイトを見たとしても、特に個人情報を入力したり、何かを『許可』していない」なら、「あまり心配はない」と言えます。これは、スマートフォンの基本システムやブラウザは、プログラムが他の領域にアクセスできない設計(アプリ サンドボックス)になっているからです。むしろ気をつけたいのは、焦っていろいろ操作することです。慌ててセキュリティアプリを入れようとして、間違って「ウイルス(マルウェア)」を入れてしまうことが多いからです。YouTube動画でも話していま...
フォームの要素にラベルが関連付けられていません(input#focus_retriever, iframeTracker)[PSI] とりあえずのメモ

フォームの要素にラベルが関連付けられていません(input#focus_retriever, iframeTracker)[PSI]

PageSpeed Insightsで「フォームの要素にラベルが関連付けられていません」として、「input#focus_retriever」が問題になっていました。js-iframe-trackerを無効したら解決しました。iframeTrackerは、リンククリックを計測するためのjQueryプラグインです。フォームの要素にラベルが関連付けられていませんPSIで「input#focus_retriever」にラベルがない、と表示される。フォームの要素にラベルが関連付けられ...