久しぶりにWordPressを触ったら、何かがおかしいことに気がつく
違和感は、フォント。どうも指定が効いていないようだ。
なんでだろう、とあれこれやってみたもののビクともしない。検索をポチポチ掛けてみると、どうやらCSSの「@import」が非推奨になっていてブラウザによっては廃止になっているようだ。それが原因なんだろうか？
試しにGoogleFontsから、「@import」ではなく、「<link>」形式を選んで、headerに貼ってみたらバッチリ効いた。
今度からはこれでいくことにしよう。
プリズムの表記もズレていた
プリズム用に使っていたフォント「RictyDiminished」も効かなくなっていたので、ラインマーカーなどがずれて酷いことになっていた。これを機に、GoogleFontsから「Noto Sans Mono」を引っ張ってきて使うことにした。
プリズムのラインマーカーpre, pre * {} でline-heightを決めたら
pre.line-numbers {} の方でも同じ高さにし、上下のpaddingで調節する。
具体的にはこんな感じ。↓
/* Prism用CSS の一部 */
pre, pre * { line-height: 1.65;}
pre.line-numbers { padding: 14px 60px; line-height: 1.65;}
「line-height」を変更しないと、「g」の下の方が見切れたりするので備忘録として残しておきたい。
ついでに覚えた
Prismで使えるコマンドライン表現。
使うにはPrismのサイトから追加プラグインのダウンロードが必要なので注意。
date
2023年 8月 5日 土曜日 10:36:18 JST<pre class="command-line" data-user="root" data-host="" data-output="2">
<code class="language-vim">date
2023年 8月 5日 土曜日 10:36:18 JST</code></pre>
classには「command-line」。
data-userには@の左側、上の例では「root」と書いたが、何も書かないと自動で「user」になる。
data-hostには＠の右側、空欄だと「localhost」が出力される。
data-outputには名前を出したくない行を記入。これはコマンドの返答部分に使う。
上の例では「2」として2行目を消しているだけだが、「2-4」や「2-4,6」のように指定することができる。
langageはそれっぽくなるように「vim」にしておいた。
ちなみにdata-userを「root」にすると勝手に「#」になってくれるが、それ以外だと「$」になる。
つまり、data-user=”mndangler”だとこうなる。
date
2023年 8月 5日 土曜日 10:36:18 JSTその他にも、data-promptを使うと名前をごっそり変えることができるそうだ。
下記では「data-prompt=”自由入力”」としてみた。
date
2023年 8月 5日 土曜日 10:36:18 JSTコマンドラインについては「ある計算機屋さんの手帳」様の記事を参考にさせて頂きました。
アイキャッチのサイズを変更
でっかいアイキャッチにしていたが、最近は無限に画像を生み出せるAI技術が台頭してきたので思い切って変えてみることにした。768 x 512というサイズはStableDiffusionを触る者なら、なるほどと思うのでは。
この投稿のアイキャッチも、下の画像を元にimg2imgで生成して貰いました。
アングラー君は猫にされてしまいました。
WordPressテーマをCocoonへ
長年愛用してきた「NewWorld」の更新も終了し、自力で改造できるほどのスキルも無いため「Cocoon」へ移行させて頂きました。今までありがとう「NewWorld」。デザインはできるだけ残してみるよ。
「Cocoon」の機能は豊富なので、色々試した記事もいずれ書いてみたいと思います。
