プログラミング

[CSS] ブログの文字詰めを微調整した【letter-spacing と font-feature-settings】 とりあえずのメモ

[CSS] ブログの文字詰めを微調整した【letter-spacing と font-feature-settings】

ちいラボでは、なるべく「文字が見やすい大きさ」に設定しています。しかし、自分のスマートフォンで閲覧すると、一行の文字数が少ないために、改行が多すぎる気もしています。そこで、文字の大きさをそのままに、「文字詰め」を狭めてみることにしました。letter-spacing全体的な字間をそのまま減らすには、letter-spacing に負の値を設定します（規定は0）。letter-spacing: -0.05em;font-feature-settings に "palt" を設定...
2023.04.29 2024.08.11
とりあえずのメモプログラミングホームページ運用
[AMP] 投稿タイトルにバックスラッシュが含まれていたら【無効なエスケープシーケンス】 プログラミング

[AMP] 投稿タイトルにバックスラッシュが含まれていたら【無効なエスケープシーケンス】

Google Search Console で「解析不能な構造化データの問題」というエラーが表示されました。これは 記事タイトルの中に、エスケープ文字であるバックスラッシュ（0x5C「\」）が入っていたからです。別の文字コードのバックスラッシュ（U+FE68：﹨）に変更したらエラーは消えました。Google Search Console での２つのエラーGoogle Search Consoleの通知で、エラーが表示されました。「解析不能な構造化データの問題」と「AMPの問題...
2023.04.26 2023.04.27
プログラミングホームページ運用
久しぶりにErgoDoxの設定をした（macOS, JIS日本語配列） #PR含む

久しぶりにErgoDoxの設定をした（macOS, JIS日本語配列）

休眠状態だった ErgoDox（分割型キーボード）を、改めて使ってみようと思います。キーキャップやスタンドを揃え、ファームウェアも作り直しました。特に、ファームウェアの作成やインストールは、とても手軽に進化していました。ErgoDoxは必要なの？しばらく（ここ4年ほど）、使っていなかった理由は、ふだん MacBook Air を使うようになったからです。USBポートが合わなくなったことで、そのままになっていました。さらに、MacBookのキーボードが「かな・英数」キー、コント...
2023.04.25 2023.05.18
#PR含むMacいろんな周辺機器とりあえずのメモプログラミング
[CSS] 幅とパディングの関係【box-sizing】 とりあえずのメモ

[CSS] 幅とパディングの関係【box-sizing】

HTML要素の幅を固定して、パディングを内側に取りたいときには、「box-sizing」プロパティでborder-boxに指定します。固定ヘッダーとサイドバーが重なって幅が取れないウェブページに固定ヘッダーを作ろうと思いました。位置を position: fixで固定します。ところが、画面サイズによって幅の変わる左サイドバーがあったので、幅がうまくいきません。サイドバーの幅の分だけ右にずらす（leftやpadding-left）と、ヘッダーバー全体が画面から右にはみ出てしまい...
2023.04.24
とりあえずのメモプログラミングホームページ運用
手軽にプログラミングするならオンラインIDEが便利（ideone.com） とりあえずのメモ

手軽にプログラミングするならオンラインIDEが便利（ideone.com）

たまに、連番の文字列を入力したいなど、ちょっとした単純作業をプログラムで処理したい場合があります。しかし、その時のパソコンによってプログラミング環境があったり、なかったり。久しぶりに使うと、そのタイミングでアップデートから用意しないといけません。そんなときにすぐに使えるのが、オンラインIDE（統合開発環境）。インターネット上にコードを入力するだけで、かんたんな出力結果を得ることができます。（サイト）for i in range(312, 324): print('<img u...
2023.04.23 2024.01.25
とりあえずのメモインターネット小話パソコン基礎知識プログラミング
[Cocoon] ソースコードハイライトが反映されない？【CSSセレクタ】 とりあえずのメモ

[Cocoon] ソースコードハイライトが反映されない？【CSSセレクタ】

なぜか、Cocoonのテーマ設定のソースコードが反映されませんでした。CSSセレクタを設定し直したら、うまく動きました。highlight.jsが動作しないCocoonテーマには、ソースコード ハイライト機能があります。これは、highlight.jsを利用しています。しかし、Cocoon設定では、ちゃんとハイライト表示にチェックがつけたのですが、記事内のソースコードがそのままでした。これまで うまくコードハイライトが表示されない原因は、「スクリプトの遅延処理などのほかのプラ...
2023.04.23
とりあえずのメモニッチな話題プログラミングホームページ運用
[WordPress]記事ごとの平均PVを集計するサブメニューを自作プラグインに追加した とりあえずのメモ

[WordPress]記事ごとの平均PVを集計するサブメニューを自作プラグインに追加した

どんな記事が安定して読まれているのか把握するために、平均PVを調べたいと思いました。前回作った月別ページビュー集計の自作プラグインに追加します。前回はこちら。管理ページにサブメニューを追加する（add_submenu_page）最終的に出来上がったのがこちら。ブログの勢いを将棋の駒でランク付けしています。書いた記事が、駒得で変換されるのでモチベーションが上がります。野球が好きなら、ヒットやホームランでもいいんだろうね。まずは、メニューに項目を追加します。WordPressプラ...
2023.04.23
とりあえずのメモニッチな話題プログラミングホームページ運用
[Word] 過去の均等割付のフィールドコード「eq ﹨o﹨ad」を解除する（重ね文字） Word・Excelなど

[Word] 過去の均等割付のフィールドコード「eq ﹨o﹨ad」を解除する（重ね文字）

Word 98 など Word 2000 以前から使い回された文書を見ていると、不思議な均等割付が紛れ込んでいることがあります。文字列をクリックすると、グレーのまとまりで選択されるのです。これは、重ね文字の「フィールドコード」を利用した擬似的な「均等割付」です。eqは数式のフィールドコード文字列を右クリックすると、「コードの編集」があります。見てみると、フィールドコードになっていました。{eq \o\ad(●●●,□□□□□)}Wordのフィールドコードは、差込印刷などで見か...
2023.04.22 2023.04.26
Word・Excelなどとりあえずのメモプログラミング
【未解決】埋め込んだTwitterのフォントサイズを小さくしたい（けど、いったん断念）[WordPress] SNS

【未解決】埋め込んだTwitterのフォントサイズを小さくしたい（けど、いったん断念）[WordPress]

ただ、ツイートの埋め込みの文字サイズを本文に揃えたいだけなのに、めちゃくちゃ大変……。Twitterのツイートは、「ツイートを埋め込む」からコードを表示して、HTMLに埋め込むことができます。ところが、枠の幅や文字サイズなどは、ウェブサイトと異なるスタイルが適用されます。結論としては、あれこれ調べましたが、諦めました。「埋め込みツイート」が Twitterの仕様変更に依存しているので、サイト側で変更してもすぐに元に戻ってしまうからです。「twitter-tweet」のクラスを...
2023.04.09 2023.07.03
SNSとりあえずのメモプログラミング
[WordPress] 脚注のプラグインを入れてCSSを変更した【Easy Footnotes】 とりあえずのメモ

[WordPress] 脚注のプラグインを入れてCSSを変更した【Easy Footnotes】

脚注のプラグインを入れました。定番の「Easy Footnotes」です。脚注のメリットは、根拠を添えておけることだよね。Easy Footnotesのショートコード（efn_note）「Easy Footnotes」は、プラグインの追加で検索するとインストールできます。段落ブロック内にショートコードを挿入すると、脚注になります。[efn_note]ここに文章を入れる[/efn_note]マウスポイントでツールチップが表示されるのと、記事末尾に注記が並びます。スマホだと、脚注...
2023.04.08 2024.01.14
とりあえずのメモプログラミングホームページ運用
「オープンソース」とは？ プログラミング

「オープンソース」とは？

「オープンソース」とは、プログラムを開発するときに、そのソフトウェアのコード（設計図）を公開することです。つまり、オープンソースになっているプログラムは、誰でも自由に使えるし、自分で改良して使うこともできます。
2023.03.25 2023.04.07
プログラミングミニ用語辞典
[Cocoon] ブログカードをラベルボックスのように表示するCSS プログラミング

[Cocoon] ブログカードをラベルボックスのように表示するCSS

カタカナ用語は、はじめて目にする人には意味がわかりにくいものです。記事の中で共通して使われる用語説明を、挿入しやすいように、「ブログカード」を活用することにしました。ブログカードでは、スニペットという概要を表示できます。用語と説明を小さな記事にしておけば、ブログ内に挿入できます。「word-description」というHTMLクラスへのスタイルシートで「ラベルボックス」のように表示させてみます。こちらがスタイルシートです。不要な項目を非表示（display: none;）に...
2023.03.25 2023.03.26
プログラミングホームページ運用
ChatGPTで擬似コードを計算させたら「空気を読む」だけだった【言語モデルはプログラム処理系ではない】（GPT-3） AIの話題

ChatGPTで擬似コードを計算させたら「空気を読む」だけだった【言語モデルはプログラム処理系ではない】（GPT-3）

ChatGPTに擬似コードを与えると、解釈して実行結果を表示できるようです。しかし、ちょっと試してみると その「ハリボテ感」にも気づかされます。一見、本当っぽい出力なのですが、全く正しくないのです。これは「言語モデル」のもつ、必然の性質です。擬似コードの演算結果に見えるものは、「演算」しているわけではありません。これまでの文書データからの「推測」を言っているだけなのです。けして万能ではないんですよね。用途に応じて使い分けることが大事。環境ChatGPT 3 （2023年3月2...
2023.03.22 2024.04.19
AIの話題とりあえずのメモプログラミング
「プログラミング教育より国語力」説は生成AIの台頭で正しくなった【プロンプト エンジニアリング】 AIの話題

「プログラミング教育より国語力」説は生成AIの台頭で正しくなった【プロンプト エンジニアリング】

対話型AI がプログラムを生成できるようになった現在、「プログラミング教育」をどう考えたらいいのでしょう？１つは、プログラミング知識自体は、自分の思い通りのプログラムを作るためには必要ということです。ただし、「読み書き計算」のような誰でも必要な「基礎的なスキル」にはならず、これまで通り「専門的なスキル」のままになるかもしれません（大工職人のような）。もう１つは、プログラミングの技術よりも、「問いを立てる力」の方が重視されていくように思います。そもそも「問い」に気づかなければ、...
2023.03.20 2023.03.23
AIの話題ちいラボエッセイとりあえずのメモニュースから考えるパソコン基礎知識プログラミング
[WordPress] 投稿月でグループ分けした月別PV集計表を見るためのカスタムプラグインを作った【ChatGPTと】 とりあえずのメモ

[WordPress] 投稿月でグループ分けした月別PV集計表を見るためのカスタムプラグインを作った【ChatGPTと】

一ヶ月分のブログ公開がどれぐらいのページビューにつながっているのか、集計する自分用のWordPressプラグインを作成しました。自分にとっては未経験の分野でしたが、対話型AI「ChatGPT」に相談してみると、使える叩き台を用意してくれました。WordPressプラグインづくりははじめてでしたが、かなりの時間短縮。無事に完成しました。アクセス集計プラグイン一ヶ月分のブログ公開が、どれぐらいの成果になっているのか知りたいことがあります。これまでは、Google Analytic...
2023.03.18 2024.05.10
とりあえずのメモプログラミングホームページ運用
[Excel] 「=25%%」は計算できる？【パーセント表示と演算子】 Word・Excelなど

[Excel] 「=25%%」は計算できる？【パーセント表示と演算子】

「=25%%」の計算結果は、「0.0025」になります。Excelの数式内の「%」は、左の被演算子を100で割る 単項演算子だからです。ただし、数式でない場合は、「25%%」は文字列になってしまいます。数式「=25%%」Excelの数式「=25%%」の計算結果は、「0.0025」になります。数式内の「25%」は、単位付きの定数ではなく、「25/100」という式を表しています。従って、「25%%」は、まず「25 / 100 = 0.25」を計算し、さらに「0.25 / 100」...
2023.03.14
Word・Excelなどとりあえずのメモプログラミング
[CSS] ブログの記事一覧をInstagramっぽくしたい（いったん断念） とりあえずのメモ

[CSS] ブログの記事一覧をInstagramっぽくしたい（いったん断念）

ひとこと日記のアイキャッチ画像を、Instagramのように大きく表示できるようにしたいと思いました。カスタムHTMLウィジェットでスタイル設定カスタムHTMLのウィジェットで、styleを追加すると、特定のページにスタイルを追加できました。<style>.entry-card-snippet { display: none;}figure.entry-card-thumb { padding-bottom: 0em;} .entry-card-thumb { width: ...
2023.03.05 2023.03.25
とりあえずのメモプログラミングホームページ運用
[Cocoon] 表のスタイルで縦線をなしにした【横線のみのtable】 とりあえずのメモ

[Cocoon] 表のスタイルで縦線をなしにした【横線のみのtable】

最近は、表のデザインで、縦の枠線を付けないことが多いようです。Spotifyの「支払いに問題がある」？【クレジットカード情報の更新】より確かに、スッキリした印象になります。ブログ内の表を CSS を変更してみました。「border-width: 2px 0px;」という箇所が肝。横線（border-top, border-bottom）は 2px縦線（border-left, border-right）は 0px に指定されます。/** 表の枠の色（縦線なし） 2023-03...
2023.03.02
とりあえずのメモプログラミングホームページ運用
[Cocoon] 表のデフォルトの枠線が黒になっている（style.min.css） とりあえずのメモ

[Cocoon] 表のデフォルトの枠線が黒になっている（style.min.css）

公開したブログ内の表の枠の色が、なぜか黒に変わっていました。原因は、「style.min.css」。この中に表（table）の枠線の色のスタイルがあるのですが、これが Cocoonのスタイルと競合しているのです。サイトの表の枠の色がおかしい？表の枠の色が、WordPressの編集画面ではオレンジなのに、公開すると黒になっていました。どうも、デフォルトの色に戻ってしまっているようです。Cocoonの表の枠の色Cocoonでは、テーマで選んだ色（サイトキーカラー）がスタイルでまと...
2023.02.19 2023.03.25
とりあえずのメモプログラミングホームページ運用
ウェブサイトの左下に動画広告が出てきたけどクリックして大丈夫？【オーバーレイ広告】 とりあえずのメモ

ウェブサイトの左下に動画広告が出てきたけどクリックして大丈夫？【オーバーレイ広告】

iPhone で情報サイトをみていたら、左下に広告動画（？）が表示されました。動画の停止ボタンをクリックしたのですが、この操作は大丈夫だったでしょうか？クリックしないで広告自体をスルーした方がよかったかと、ちょっと心配になりました。画面上に勝手に広告動画が出てくるので、「サイト乗っ取り」かと心配になりますが、これはただのネット広告。情報サイトと提携しているネット広告代理店による「オーバーレイ広告」が表示されているだけなのです。煩わしい広告ではありますが、通常 クリックしたから...
2023.02.11 2024.02.15
とりあえずのメモインターネット小話プログラミングホームページ運用冊子テキスト相談と回答
次のページ