プログラミング

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

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

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

とりあえずのメモスマホ基礎セキュリティプログラミングホームページ運用

ブロックエディタを狭い画面で表示するときの文字サイズを小さくした

ブロックエディタを狭い画面で表示するときの文字サイズを小さくした

ブロックエディタを狭い画面で表示する際の文字サイズを小さくしました。画面幅1080px以下の時に、文字や余白を調整するカスタムCSSを追加しました。これにより、AI画面を表示させた狭い画面でも、文章の全体像が見やすくなりました。ブラウザにサイドバーを表示すると「狭い」ブラウザのサイドバーにAI画面などを表示させると作業がスムーズになるものの、表示画面は狭くなります。特に、WordPressのブロックエディタを使っているときに、文章の全体像が見えにくく感じます。一時的にサイドバ...

とりあえずのメモプログラミングホームページ運用作業効率化

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

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

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

とりあえずのメモセキュリティプログラミングホームページ運用

[Cocoon] ブログカードのHTML構造でCSSを整理した（style.css）

[Cocoon] ブログカードのHTML構造でCSSを整理した（style.css）

Cocoonテーマのブログカードの追加CSSを整理しました。ブログカードのHTML階層構造とメディアクエリで順序立ててまとめました。スタイルを追加するときは、はじめから構造を意識しておけばよかったね。style.cssに追加コードを整理したいstyle.cssに追加コードが増えて来たので、整理したいと思います。ただし、優先順位の問題があるので、並び順やCSSクラスの重ねた修飾の仕方も重要です。ブログカードの階層構造Cocoonテーマのブログカードは、HTMLの階層構造になって...

とりあえずのメモプログラミングホームページ運用

[WordPress]ランダムな記事へのボタンを追加した（functions.php）

[WordPress]ランダムな記事へのボタンを追加した（functions.php）

過去の記事を「掘り起こして」読んでもらう仕掛けとして「ランダムな記事へのボタン」を追加しました。WordPressブログにランダムな記事へのボタンを追加するカスタムウィジェットを作成しました。きっかけは、ブログの「アーカイブ」としての機能を強化したいと思ったからです。カスタムウィジェットを作成するPHPコード前の記事、ランダムな記事、次の記事へのリンクを表示するカスタムウィジェットを作りました。WordPressテーマのfunctions.phpファイルの末尾に追加したら、ウ...

とりあえずのメモプログラミングホームページ運用

[CSS]Amazonリンクをnote風に画像を大きくした

[CSS]Amazonリンクをnote風に画像を大きくした

Amazonリンクをnoteのデザインを参考に、画像を大きくして説明文を省略しました。CSSを更新して、デスクトップとモバイル両方での表示を変更し、商品名、画像、ボタンのレイアウトを調整しました。Amazonリンクのスタイルを変更Amazonリンクのスタイルを変更しました。今回は noteを参考にして、画像を大きくし、説明文を省略するようにしました。Amazonリンクの例↓更新後のCSS/** amazon リンク * ブログカードに寄せた * * 2024-08-31 no...

とりあえずのメモプログラミングホームページ運用

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

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

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

2024.08.30 2024.08.31

とりあえずのメモプログラミングホームページ運用

[CSS]モバイル版の記事一覧ページを見やすくした（style.css）

[CSS]モバイル版の記事一覧ページを見やすくした（style.css）

記事一覧ページのモバイル表示を改善するためにCSSを調整しました。サムネイル画像を左側に配置し、正方形にすることで視認性を向上させました。記事間の余白を増やし、背景色を変更することで各記事の区切りを明確にしました。記事一覧ページのサムネイルを大きくした記事一覧ページを見やすくしたいと思いました。そこで、サムネイル画像を左にして正方形にしました。記事一つ一つのかたまりを意識できるように余白も増やしました。記事一覧ページのHTMLタグの構造記事一覧ページのHTMLタグの構造は、#...

とりあえずのメモプログラミングホームページ運用

[WordPress] H2タグの文字の前に番号を追加するカスタムスクリプト（functions.php）

[WordPress] H2タグの文字の前に番号を追加するカスタムスクリプト（functions.php）

H2タグの前に番号を付けるために、WordPressの functions.php にカスタムスクリプトを追加しました。H2タグを検出し文字列を置き換える処理を、フィルターとして 'the_content'に追加します。H3タグでも同様に階層的な番号付けができます。

とりあえずのメモプログラミングホームページ運用

[WordPress] ウィジェットエリアを転用して左サイドバーにした（CSS）

[WordPress] ウィジェットエリアを転用して左サイドバーにした（CSS）

WordPressサイトで、ワイド画面の左側の空きスペースを活用し、目次を左サイドバーとして表示するカスタマイズを行いました。このカスタマイズは、使っていないウィジェットエリアを、CSSで転用して実現しています。画面幅に応じて表示を切り替える仕組みも導入し、小さな画面では従来の記事内目次を表示するようにしました。すぐに見出しに飛びたいパソコンで記事を読んでいるときに、スムーズに見出しに移動できるように、左サイドに目次を追加しました。従来の目次は、導入文の後（１つ目の見出しの前...

2024.08.29 2024.08.30

とりあえずのメモプログラミングホームページ運用

[Excel VBA] ブックの各シートをひとまとめにするVBAコード

[Excel VBA] ブックの各シートをひとまとめにするVBAコード

1つのシートにまとめるマクロを作った大きな名簿などは、シートを分けて管理することがあります。しかし、差し込み印刷などでは1つのシートにまとめる必要があります。そこで、エクセルブックを開いて各シートの内容をまとめるマクロブックを作りました。VBAコードマクロを実行すると、指定したブックの全シートのデータがマクロブックのシート1にコピーされます。Sub CombineSheets() Dim wb As Workbook Dim ws As Worksheet Dim destW...

2024.08.18 2024.09.04

Word・Excelなどとりあえずのメモプログラミング作業効率化

[Cocoon] アイコンリストで二項対立のスライドを作るCSS

[Cocoon] アイコンリストで二項対立のスライドを作るCSS

2つの事柄を対比して説明することが多いです。毎回、Keynoteで図解を作るのは大変。テキスト入力だけでかんたんに作成できると便利です。そこで、Cocoonテーマのアイコンリストを二項対立のスライドにするCSSを作りました。追加CSSクラスにslide dichotomyを入れるアイコンリストの追加 CSS クラスに「slide dichotomy」を入力すると、二項対立（dichotomy）のスライドになります。追加されたCSSポイントは、 display: flex; j...

2024.08.18 2024.08.19

とりあえずのメモプログラミングホームページ運用

[Windows]IPv6に整数アンダーフローで不正コード実行の脆弱性があった（CVE-2024-38063）

[Windows]IPv6に整数アンダーフローで不正コード実行の脆弱性があった（CVE-2024-38063）

2024年8月13日、Windowsの通信処理に重大な「脆弱性（バグ）」が見つかりました。ユーザーが何も操作しなくても、悪意のあるデータを受信すると悪意のあるコードを実行されてしまう、「ゼロクリック攻撃」の危険性があります。すでに Windows Updateでセキュリティ更新（KB5041571など）が提供されているので、早めにアップデートしておきましょう。要は「Windowsのセキュリティ面でバグがあったことがわかった」というのを、どうして「脆弱性（vulnerabili...

Windowsとりあえずのメモセキュリティニュースから考えるプログラミング

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

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

Electronを使用してMac用のクリップボード記録アプリを作成しました。このアプリは、コピーした内容を自動的に記録していき、まとめて編集・利用できるようにします。ネットショッピングやレポート作成時の情報収集に便利で、簡単な操作で使用できます。クリップボード記録アプリを作った自分のMac用に「クリップボード記録ツール（monclip：Monitor Clipboard）」を作りました。パソコンで文字をコピーするたびに、その内容を自動的に記録してくれます。（ダウンロード：動作...

2024.08.15 2024.08.19

Macとりあえずのメモプログラミング作業効率化

「ドリフト現象」とは？（漂流するAI）

「ドリフト現象」とは？（漂流するAI）

AI（人工知能）は、学習量が多くなればどんどん賢くなると思われています。しかし、実際には学習するほど「おかしな回答」をする「ドリフト現象」があります。AIの仕組みはとても複雑です。そのため、AIの一部を良くしようとすると、別の部分の性能が下がってしまうことがあります。学習するほど賢くなる、という単純なものじゃないんだね。「ドリフト」って何？「ドリフト」とは、利用しているうちに AI の回答精度が下がってしまう現象です。例えば、こんな感じです：以前はきちんと答えられていた質問に...

AIの話題とりあえずのメモプログラミング

[Excel]個人用マクロブックがロックされないように「読み取り専用」にするマクロのメリット・デメリット（ChangeFileAccess, xlReadOnly）

[Excel]個人用マクロブックがロックされないように「読み取り専用」にするマクロのメリット・デメリット（ChangeFileAccess, xlReadOnly）

Excelの個人用マクロブックは自動読み込み時に排他制御の問題が発生し、警告メッセージが表示されることがあります。この問題を解決するために、マクロブックを読み取り専用モードで開くか、自動読み込みを無効にする方法があります。ただし、これらの解決策にはマクロの編集や利用に関して一定の制限があります。この警告ってわずらわしいよね。警告メッセージの原因（自動読み込みと排他制御）Excelを開いて個人用マクロブックが開かれているときに、エクスプローラーのプレビューで表示したり、Altキ...

2024.08.14 2024.08.15

Word・Excelなどとりあえずのメモプログラミング作業効率化

[WordPress]画像キャプションをalt属性を自動設定するカスタムスクリプト（functions.php）

[WordPress]画像キャプションをalt属性を自動設定するカスタムスクリプト（functions.php）

WordPressの画像ブロックにおいて、キャプションをalt属性に自動設定するカスタムスクリプトを作成しました。このスクリプトは、figcaptionタグ内のテキストを優先的にalt属性に設定します。functions.phpに追加することで、画像のアクセシビリティを向上させることができます。画像のキャプションをalt文字列に活用したいWordPressの画像ブロックには、キャプションを付けることができます。画像にAlt文字列が設定されていないときに、もしキャプションがあれ...

とりあえずのメモプログラミングホームページ運用

手計算でわかる、秘密鍵と公開鍵の「使い方」（RSA暗号）

手計算でわかる、秘密鍵と公開鍵の「使い方」（RSA暗号）

「RSA暗号」は、数学的な性質を利用して秘密通信を可能にする暗号システムです。公開鍵と秘密鍵の組み合わせで、メッセージの暗号化と復号ができます。

2024.08.10 2024.08.13

わかりやすさ重視セキュリティプログラミング冊子テキスト

ブログカード抜粋の先頭に「関連」を付けた

ブログカード抜粋の先頭に「関連」を付けた

Cocoonテーマの「ブログカード」のカスタムCSSクラス「simple」の先頭に「【関連】」という文字を自動的に追加するようにしました。コードを整理して、よりスッキリとしたデザインに改善しました。「関連」という文字を先頭に追加したCocoonテーマのブログカードにCSSクラス「simple」を追加すると、文字リンクにするようにしています。このまえに「【関連】」という文字を自動的に追加するようにしました。.wp-block-cocoon-blocks-blogcard.sim...

プログラミングホームページ運用

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

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

WordPressのブロックエディタに「書式のクリア」のショートカットキーを追加しました。functions.phpとcustom-editor.jsを使用して、Command+Jで「書式のクリア」をできるようにしました。「書式のクリア」のショートカットキーを追加したいWordPressのブロックエディターにControl+Spaceでテキストの書式をクリアするショートカットキーとして「Command+J」を追加しようと思います。ブロックエディタの「書式のクリア」は、そのほか...

とりあえずのメモプログラミングホームページ運用作業効率化

次のページ

1 2 3 … 8