サイドバー

[WordPress] ウィジェット構造をMarkdown形式で出力するプラグインを作ってみた

[WordPress] ウィジェット構造をMarkdown形式で出力するプラグインを作ってみた

WordPressのウィジェットは便利ですが、いじっているうちに「前はどうなっていたっけ？」という状況になることがあります。そんな時に役立つ、ウィジェットの構造をわかりやすく記録できるプラグインを作りました。このプラグインを使うと、現在のウィジェット配置とその設定内容をMarkdown形式で出力できます。WordPressのウィジェット構造をメモしたいWordPressでウェブサイトを作っているとき、サイドバーやフッターにあるウィジェットの調整は頻繁に行います。しかし、調整し...

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

[WordPress]ウィジェットタイトルを非表示にするCSS

[WordPress]ウィジェットタイトルを非表示にするCSS

WordPressの管理画面で多数のウィジェットを区別しやすくするため、タイトルをつけると便利です。しかし、管理用のタイトルがサイト上で表示されてしまうのは困ります。これは簡単なCSS設定で解決でき、サイト運営の効率が向上しました。ウィジェットタイトルの表示設定についてWordPressサイトでは、多数のウィジェットを配置していると、管理画面での区別が難しくなることがあります。各ウィジェットに管理用のタイトルをつければ楽です。しかし、サイト上でも表示されてしまうため、これまで...

2025.01.16 2025.01.17

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

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

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

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

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

Chromeにサイドパネルとマウスジェスチャーを拡張した（Page Sidebar, simpleGestures）

Chromeにサイドパネルとマウスジェスチャーを拡張した（Page Sidebar, simpleGestures）

Chromeで面倒な画面切替えをスムーズにするために、「サイドバー」と「マウスジェスチャー」のChrome拡張機能を追加しました。Page Sidebarを使うと、サイドバーで別のウェブサイトを開きながら作業ができ、タブの切り替えが減ります。simpleGesturesは、マウスの動きだけで様々な操作ができるため、ブラウジングがよりスムーズになります。（参考）（chromeウェブストア）Page Sidebar | Open any page in side panel（Ch...

2024.09.03 2024.09.05

とりあえずのメモインターネット小話パソコン基礎知識作業効率化

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

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

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

2024.08.30 2024.08.31

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

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

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

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

2024.08.29 2024.08.30

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

[Cocoon] 記事のタグをサイドバーに表示した（タグクラウドではない）

[Cocoon] 記事のタグをサイドバーに表示した（タグクラウドではない）

ブログのサイドバーの項目を見直してみました。WordPressのサイドバーに記事のタグを追加したカスタム検索とナビゲーションメニューの間に、・リンク・目次・タグ・関連記事を追加しました。とくに、記事のタグを追加するのが、大変だったのでメモします。「タグ」を表示する今回、サイドバーにタグを設置しようと思ったのは、検索が面倒な人に関連記事を探しやすくしたいからです。Cocoonテーマでは、記事のタイトル上下や本文下には、「タグ」を表示することができます。Cocoonの投稿にタグを...

2021.04.04 2024.04.21

インターネット小話ニッチな話題ホームページ運用