5丁目通信(仮称)

とある5丁目で活動する還暦を過ぎたWebプログラマーの覚え書きです。それとかかってくる迷惑電話や、家業のアパート経営について。

カテゴリー: オープンソース

  • さくらインターネットのレンタルサーバーではGitを使わないほうがいいよとサポートから言われた話し

    Gitのリモートリポジトリは社内のQNAPのContainer Stationを使ってGitLabを立て使っています。そろそろこちらのGitLabが怪しいので、別のサーバーに移行しようと思っています。その前に簡単にバックアップできるようにリモートリポジトリを立てようかと思って、

    そう言えば今使っているさくらインターネットのレンタルサーバーでも使えるような話しがあったのを思い出して使ってみます。情報としては、

    とか

    とか

    とかでしょうか。どれもディレクトリを作って、git init –bareでいけるよと書いてあります。

    それでは簡単だからやってみようと言うことになり、やってみましたがpushでエラーになります。どうもさくらインターネットのgitにはlfsがサポートしていないようです。git lfs installとコマンドを叩くと、

    git: 'lfs' is not a git command. 

    となってしまいます

    何か解決策があるかもしれないと調べましたが、わからなかったのでさくらインターネットの聞いたところ回答としては次の通りでした。

    さくらインターネットのレンタルサーバーにはgitをインストールしているけど、ユーザーが使うのではなくて運用で使うためだけだから、本格的に使いたいのならVPSに移行して使ってね。

    さくらインターネットのレンタルサーバーでは、簡単なGitしか使えないようです。ちょっとガッカリです。

    さくらインターネットのVPSは以前使っていましたが、自分でOSをアップデートしなければならないし、いろいろと気をつかわなければいけないしで、運用が面倒になってやめてしまっています。GitのためだけにVPSを再契約するのも何だし、どうするか考え中です。

    さくらインターネットのレンタルサーバーでGitを使えるようになると、Webサーバー以外での使い道としてセールスポイントとなると思うけどな。甘いか・・・。

    著:湊川あい, 著:DQNEO
    ¥2,208 (2025/03/25 16:19時点 | Amazon調べ)
    著:リック・ウマリ, 翻訳:吉川邦夫
    ¥3,247 (2025/03/25 16:19時点 | Amazon調べ)
  • WordPressの再利用ブロックがパターンに統合されていた話し

    ここのブログでもWordpressの再利用ブロックが挿入できなくなったとか、再利用可能ブロックの管理はどこでやるのかと書きました。

    BardとかEdgeのAIチャットに聞いてみると(ChatGPTでは解決できませんでした)、再利用可能ブロックはWordpress6.3からパターンに統合されていたみたいです。どこかでニュースリリースでも書かれていたもしれませんが、私は見逃していたようです。

    気を取り直して、Wordpressのグーテンベルクの編集画面を見てみると、右上のオプションメニューから「パターンを管理」でパターンの管理画面に入ると、以前定義した再利用可能ブロックも一緒にパターン一覧に表示されていました。ここから再利用可能ブロックの編集と削除ができました。

    しかしながら、従来の再利用可能ブロックがパターンの未分類に入っていて、未分類が名前を付けて分類できないとか、並び順が設定できないなど、まだ解決できない部分がありますけど、これでよしといたしましょう。

    以上のことから、Wordpressのパターンとか再利用可能ブロックの話題があまり出てこないと言うことは、あまり使われていないということなのかな?

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

  • またWordPressの再利用可能ブロックが挿入できなくなった話し。納得いかないけど解決した話し

    WordPressの記事の作成で何回も同じことを書くことがあるので、再利用可能ブロックにまとめてしまいます。再利用可能ブロックは、一つの記事で変更すると、同じブロックは同じように変更してくれますので、とても便利に使っています。

    以前、再利用可能ブロックがグーテンベルクの記事の編集画面から選択できなくなって改善されたと書きましたが、また選択できなくなってしまいました。再利用可能ブロックの代わりにメディアというタグが追加されています。

    同じさくらインターネットのレンタルサーバーの上で動いているWordpressのサイトがありますが、こちらも同じような現象が起こっています。

    また、さくらインターネットのサーバーが原因なのでしょうか? それとも、Wordpressに何か不具合があるのでしょうか? まさか、グーテンベルクの編集画面から再利用可能ブロックの挿入ができなくなっているのでしょうか? これは無いかと思うけど・・・。

    この障害も時間が経てばさくらインターネットが対応してくれて改善されるのでしょうか。どうせ、さくらインターネットに聞いても、レンタルサーバー上の中の障害については答えてくれないでしょうから。

    今は、別の記事から再利用可能ブロックをコピペしてしのいでいます。よく使っている再利用可能ブロックは、ブロックの先頭で/を入力するとリストに表示されるので、こちらでもとりあえずは挿入できています。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

    追記(2023年10月6日)

    再利用可能ブロックの挿入方法を見つけました。

    パターンの未分類にまとめてありました。これが仕様なのでしょうか? なぜここにあるがわかりません。再利用可能ブロックはパターンに統合されたのでしょうか?

    しかしながら、グーテンベルクの編集画面の右上のオプションメニューに再利用可能ブロックの管理へのリンクがなくなっています。再利用可能ブロックの管理画面へはどうやって行ったらいいのでしょうか? 

    とりあえずは、再利用可能ブロックの挿入、編集ができるからいいかな・・・。

    続きの話しはこちら

    とりあえず解決した話し。

  • WordPressのサイトがTexoPressプラグインのせいでページが文字化けした話し

    一応は一日一回このサイトにアクセスしているのですが、本日アクセスしたらページが文字化けしていました。

    まず疑ったのは、Wordpressのバージョンアップです。再度6.3.1に再バージョンアップします。それでも文字化けはなおりません。

    次に疑ったのはプラグインです。一つづつプラグインを無効にしていきます。無効にして正しく表示できたのは、TexoPressです。タグの管理プラグインです。とりあえずは、TexoPressを無効にしておきます。

    TexoPressプラグインの代わりはあるのでしょうか? それともTexoPressプラグインが文字化けしないまでバージョンアップを待ちましょうか?

    それにしてもTexoPressプラグインを無効にしてしまうとタグの選択が面倒です。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

    追記(2023年9月29日)

    それにしてもWordpressのこちらのサイトが微妙におかしい。たとえば、Wordpressのグーテンベルクの編集画面で再利用可能ブロックの一覧が表示できない障害がまた出ている。そして、やけにページの保存に時間がかかるようになった。

    再利用可能ブロックの件は、以前にも障害があったが、こちらはサイトのホスティング元のさくらインターネットのサーバーの改修で改善されたので、おそらくさくらインターネットのサーバーの問題なのだろう。

    時間が解決するのか、放っておけば解決するのかはわからない。

    追記(2023年9月29日)

    3日前にTexoPressプラグインがアップデートされたようで、文字化けが直っていた。これでタグの管理が楽になる。

    再利用可能ブロックが出てこないのはまだ直っていない。再利用可能ブロックの代わりにメディアというタブが出てきているけど、この影響なのかな? とにかく再利用可能ブロックが挿入できないを辛い。しかたないから、他のページからコピペした対応する。でも面倒。

  • 相談だけでは儲けが出ないという話し

    知らない電話番号から着信があった。出てみると、以前からお付き合いのある会社の社長だった。その会社とは担当者は知っているけど、社長は初めて話す。

    話しを聞いてみると、その会社が請け負ったサイトのメンテナンスの話しだった。

    何でも請け負ったサイトがWodpreddで作られていて、大昔のサイトだったからPHPが5.3(!)でMySQLも相当古いバージョンで、サイトを動かしているさくらインターネットから警告が来ているそうな。

    そこでサイトを作成して会社にWordpressのサイト環境にバージョンアップの見積もりを依頼したらべらぼうな値段でふっかけられてそうな。そこで、その値段より安く作業できないかという相談だった。

    具体的な作業の値段を教えてくれないので、安いとか高いとかは言えないので、常識的というか当たり障りのない範囲で答えておく。

    早いところWordpressはバージョンアップしたほうがいいと言っておいた。さくらインターネットならレンタルサーバーでWordpressのインストールが簡単に出てきてしまうので、新しくサーバーを契約してサイトを移行してしまえば、PHPやMySQLも新しいバージョンで利用できることを伝えた。

    ただし、そのサイト固有のWordpressのプラグインとか何か改造しているのであれば、それ相当の手間と費用がかかることも言っておいた。

    どのようなさくらインターネットのサーバーを契約しているか、ましてどのようなサイトであるかも把握していないようなので、これで話しは終了した。

    デザイン志向の会社なのであまり技術的なことはわかっていないようだ。

    以上、15分位ほど話しをして適格な回答をしたけど、全く儲けにはならないのでした。これ以上、この案件は進まないのだろうな。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

  • ひかり電話のソフトフォンをAGEphoneからLinphoneに替えてみた話し

    スマートフォンからNTT東日本推奨のAGEphoneでひかり電話経由で通話をすると、こちらの声が途切れて相手が聞き取れないようです。

    ここでひかり電話をスマートフォンで使うのは諦めてもいいのですが、諦めきれないので、別のSIPクライアントアプリを探します。

    今度見つけたのは、オープンソースのVOIPクライアントアプリケーションのLinphoneです。

    Google PlayからLinphoneのダウンロードはこちらから。

    LinphoneのAssistantメニューから「USE SIP ACCOUNT」を選択して、後は適当にひかり電話のログイン設定をしてあげて、NTT東日本からレンタルされているPR-500KIに接続できるようにします。Username, Passwordは、PR-500KIの内線設定で設定した値を設定します。Domainは、PR-500KIのIPアドレスを設定します。おそらくこれでわかなければ、ひかり電話をスマートフォンからLinphoneで利用するのはやめた方がいいかもしれません。

    あと特に設定したことは、AudioのCODECSをPCMUだけにして、それ以外を無効にしたくらいです。これで発信も着信もできて、音声も途切れることなく電話ができました。

    スマートフォンのAndroidがアップデートしたり、Linphoneアプリ自体のアップデートがかかると電話ができないなどのトラブルが、これから発生するかもしれないので様子見です。

    先ほど、お客さんから電話がかかってきて、Bluetoothのヘッドセットで会話をしましたが、相手もソフトフォンアプリで応答していることも気がつかないかったので、うまくLinphoneが動作しているのでしょう。

    Linphoneはひかり電話推奨のAGEPhoneよりも素晴らしいくらい使えます。ただし、アプリは英語ですし(どこかで日本語化できるかも)、電話帳の並びが名前ですので、漢字、ひらがな、アルファベットの名前で入り乱れていい加減で使いにくいところがあります。AGEPhoneと違って、会話の録音などの機能が最初から付いていますので、その点はよいかもしれません。内線転送ができるかはわかりません。

    ちなみにLinphoneのアイコンは、魚のエイとサメではなくて、じっと見てみると吹き出しと受話器だったのね。ちょっとわかりにくいので、開発チームは変えたほうがいいぞ。余計なお世話かもしれないけどさ。

    パナソニック(Panasonic)
    ¥10,200 (2025/03/28 23:41時点 | Amazon調べ)

    私の電話機を選ぶ基準は、まずはカールコードがないこと。受話器がワイアレスだとコードのねじれを気にせずに楽です。後は、着信拒否の登録件数の多さでしょうか。50件程度でしたら、すぐに登録が一杯になります。100件以上着信拒否ができる電話機を選びます。

    追記(2023年8月3日)

    電話帳に登録するとNTT東日本のドメインが一緒に登録されて発信できないし、そもそも最近になって発信すると406エラーになって発信できないので、Linphoneの使用を諦めました。

    時間があれば、別のSIPソフトフォンを探します。

  • テンキーボードShotgunチェリーパイを作った話し。途中失敗したけど。

    テンキーボードShotgunチェリーパイを作った話し。途中失敗したけど。

    年末年始のお楽しみで暇なときに作ると言っていた、テンキーボードShotgunチェリーパイを暇ではないけど作ってしまいました。

    大昔にやって忘れていた半田付けを何とか思い出して、実質2時間ばかりで完成です。単純作業に強い私。

    さて、キースイッチとキーキャップまでくみ上げたら、大きな問題が発生です。キーソケットの半田付けが外れてしまいました。おかげでキーが反応しません。しかも、Raspberry Pi Picoの裏側のソケットです。

    泣く泣くRaspberry Pi Picoを外します。こちらが、半田を吸い取った格闘の後です。

    Raspberry Pi Picoを外すだけでShotgunチェリーパイの組み立て2倍以上の時間がかかりました。

    今回の教訓は以下の通りです。

    Raspberry Pi Picoの裏側の部品の半田は盛っておけ

    意外とRaspberry Pi Picoは熱に強いことがわかりました。ハンダごてでハンダを吸い取るときに、時間をかけて多少の熱を与えても大丈夫でした。コンスルーが熱で変形してしまいましたけどね。

    ロータリーエンコーダも買ってありますけど、今のところロータリーエンコーダの利用する状況がありませんので、必要になったら追加するようにします。今のところはキースイッチを入れています。

    ちなみにキーマップは次の通りに設定しました。

    問題は、今どちらのレイヤーになっているかわからないことです。とりあえずは左上(レイヤー1)と右下のキー(レイヤー0)を押せば、目的のレイヤーに移行するようにはしています。2つもレイヤー移動キーを設定するのは無駄ですが、レイヤー移動をトグルにすると現在のレイヤーがわからなくなります。すぐにレイヤーがわかるように(そのようなことができたらの話しですが)、あとでLEDを追加しましょうか。

    HHKB
    ¥33,850 (2025/03/26 20:50時点 | Amazon調べ)
    HHKB
    ¥25,800 (2025/03/26 20:50時点 | Amazon調べ)

    よいキーボードを使うと、PC作業が快適になるかもしれません。

    続きはこちらから

  • まだWordPressのクラッシックエディタを使っているのと、WordPress div divサイトの話し

    こちらの話しの続きです。

    既にクラシックエディタでWordpressの記事を書けない体になってしまいました。もちろん、今書いているWordpressの記事もブロックエディタで書いています。

    ある案件で、Wordpressの既存のサイトを更新という案件があるのですが、これがまだクラッシックエディタで固定ページを作っているいうサイトです。しかも、記事をHTMLでdiv divと多用して作成していくという、私(だけ)が呼ぶところの「Wordpress div divサイト」です。

    お客さんからはクラッシックエディタを辞めてグーテンベルクのブロックエディタで作成してもいいよ、と言われているのですが、何とテーマがグーテンベルクに対応していない相当古いテーマ(有料なのに)なので、Gutenbergプラグインをインストールしても動きません。

    今更テーマを変更するなんて無謀なことができませんし、時間もお金もいただけないので、そのままdiv divのHTMLで作成していくことになります。

    問題のWordpress div divサイトは、その会社の支店で横にサイトがコピーされていきますので、支店が増えるたびにWordpress div divサイトが量産されていくことになり、またメンテナンスはdiv divで悩まされることになります。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

  • 外部リンクをPz-LinkCardプラグインとオリジナルパターンでWordPressのリンクカードを挿入した話し

    WordPressの記事中に外部リンクを貼り付けるには、今までは引用ブロックを使っていました。引用ブロックを使う場合は、貼り付けるページのURLとタイトルを拾って貼り付けていました。タイトルを貼り付けるの意外と面倒で、サイトのソースのtitleタグを見つけて拾ってきていました。

    意外と面倒くさい外部リンクの貼り付けを何とかしたいと思って考えてみました。

    最初は、ブロックに埋め込みリンクを探してみましたが、Twenty Twenty-Twoのテーマには残念ながら用意されていませんでした。仕方ないので、プラグインを探します。見つかったのは、Pz-LinkCardというプラグインです。以下のサイトを参考にしました。あまりプラグインを増やしたくないので、これまた仕方ありません。

    こちらはPz-LinkCardプラグインでリンクカードを生成しています。

    Pz-LinkCardプラグインをインストールしてみましたが、こちらの要求する機能はあります。貼り付けたカードはリンクカードとか、ブログカードと言うのですね。これは知りませんでした。oEmbedをサポートしているサイトなら、リンクカードを生成してくれます。

    Pz-LinkCardプラグインで生成されたリンクカードのデザインは、行間とかフォントスタイルなどが気に入らないところがありますので、スタイルシートを調整してしまいます。追加したスタイルシートは以下の通りです。Pz-LinkCardプラグインの設定も多少調整しています。

    .lkc-title-text,
    .lkc-domain,
    .lkc-title-text {
      font-family: var(--wp--preset--font-family--system-font) !important;
    }
    .lkc-content>div {
      margin-bottom: 10px;
    }

    あとは、リンクカードを使いしていくだけと思いましたが、Pz-LinkCardプラグインのショートコードをいちいち入力していくのも、これまた面倒です。最初は再利用可能ブロックで実現しようとしましたが、こちらは登録は簡単なのですが、いちいち通常ブロックに変換するのが面倒なのでやめました。そこで、WordpressのパターンにPz-LinkCardプラグインのショートコードを追加します。

    こんなコードをテーマのfunction.phpに追加します

    // Pz-LinkCard リンクカードショートカットのためのパターンを登録
    add_action('admin_init', function () {
      //1 パラメータの設定
      $pattern = [
        "title" => "Pz-LinkCard リンクカードショートカット",
        "categories" => ["original", "featured"],
        "descripiton" => "",
        "content" => '<!-- wp:paragraph --><p>[blogcard url=""]</p><!-- /wp:paragraph -->',
      ];
    
      //2 ブロックパターンの登録
      register_block_pattern($pattern["title"], $pattern);
    
      //3 カテゴリーの登録
      register_block_pattern_category('original', ['label' => 'オリジナル']);
    });

    参考にしたのはこのサイトです。こちらのソースを丸ごとコピーさせていただきました。

    こちらはサイトがWordpressなのでリンクを貼り付けるだけでリンクカードを自動的に生成してくれます。

    以上のサイトの通りに書くとパターンのカテゴリーがオリジナルだけになります。それだけではカテゴリーからオリジナルを選択してなんて作業が一つ入ってこれまたまた面倒なので、パターンの最初に表示されてくる”注目”カテゴリーにPz-LinkCard プラグインのショートカットが表示されるように追加しています。こちらでこのようにパターンにPz-LinkCardプラグインのショートカットが表示されます。

    このパターンを選択すると、以下のショートカットが記事に挿入されます。

    [blogcard url=""]

    こちらのショートカットのダブルクォーテーションの中に外部リンクで表示したいサイトのURLを貼り付ければリンクカードが表示されるはずです。

    もし、リンクカードが表示されない場合は、サイトがoEmbedをサポートされていないので諦めて引用ブロックやリンクで誤魔化しておきましょう。

    Pz-LinkCardプラグインを使わなくてもWordpressのほうでリンクを貼り付けてあげれば、自動的にリンクカードを生成してくれればいいのです。現にリンクを貼り付けてあげれば、一応はタイトルやサムネール画像が表示してくれるので、一応はサイトの情報は取得してくれているのではないかと思います。しかも外部リンクがWordpressのサイトであれば、今も自動的にリンクカードにリンクを変換してくれています。すべての外部リンクがリンクカードにしてくれるように望みます。

    以上、面倒なことを重なってPz-LinkCardプラグインを使ってリンクカードを生成する話しでした。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。

    追記(2022年10月19日)

    現在、主立ったページのあるリンクを引用ブロックからPz-LinkCardプラグインのリンクカードに手作業で変更しています。

    リンクで気になったのは、あるページでリンク先がアダルトサイトへのリンクに置き換わっている箇所があったことです。おそらく、リンク先が乗っ取られたのでしょうか? リンクを外しておきましたが、外部のリンクを埋め込む場合には注意が必要です。

    追記(2022年10月31日)

    最近Wordpressがアップデートしたようで、パターンの選択が味気ないUIに変わってしまった。プレビューが最初に表示されなくなったのは寂しい。

    今まではパターンを選択すれば、すぐにPz-LinkCardプラグインのショートカットが選択できたのに、一度「注目」か「オリジナル」のメニューを選択しなければいけなくなった。ワンクッション動作が増えるのは、なにげに面倒である。

    WordPressは、たまにこのようによく使う機能へのUIが変わってしまうのは辛い。

  • WordPressの画像ブロックのテキスト回り込みがモバイルでアクセスしたときに気持ち悪いので対応の話し

    WordPressでグーテンベルクを使っていますか? 私は完全にクラッシックエディタからグーテンベルクに乗り換えました。多少、ブロックエディタは融通が利かないのですが、その一つの対応の紹介です。

    画像にテキストを回り込ませたいときには、画像ブロックの配置の設定で左寄せ、右寄せで簡単に設定できます。例えば以下のように実現できます。グーテンベルクのブロックエディタでプレビューがおかしいというのは置いておいて・・・。

    これをモバイルからアクセスするとこんな感じになります。

    左のマージンがそのままですので、画像が右に寄って気持ち悪いですね。おそらく今使っているTwenty-Twenty-twoのテーマが細かくモバイルに対応していないのが原因でしょう。

    そこでちょっとスタイルを改造してしまいます。本来ならばwenty-Twenty-twoテーマのスタイルシートを編集すれば素直なんですが、今回は簡単に画像にクラスを設定して、JetpackのカスタムCSSで対応してしまいます。まずはJetpackのカスタムCSSを有効にしてください。

    画像ブロックに追加CSSクラスで適当にクラスを設定しておきます。今回は、inline-imagesとしておきました。すべての画像ブロックの回り込みを修正したいときには、やはりテーマから修正したほうがいいでしょう。

    WordPressの「外観」-「追加CSS」で以下のCSSコードを追加しておきます。

    @media (max-width: 600px) {
      .inline-images {
        float: none!important;
        margin: 0 auto!important;
      }
    }

    !importはあまり使いたくないのですけど、テーマによっては深いクラスを書かなければいけないので、これでよしとします。モバイルの画面幅はサイトに合わせて適当に変更してください。後は適当にスタイルを設定してください。画像幅の設定をやった方がいいかもしれません。

    これでモバイルでアクセスしたときに、テキストが回り込まずに画像が中央に配置されています。

    気に入らないブロックのスタイルは、追加CSSを設定して修正してしまいましょう。

    著:久保田涼子, 著:西原礼奈, 著:阿諏訪聡美
    ¥2,399 (2025/03/28 17:08時点 | Amazon調べ)

    なんやかんやでWordPressのサイト構築で躓くのは、PHPのプログラミングなのでした。