カテゴリー: WordPress

  • [WordPress] Widget Logic プラグイン [2020/12/17]

    [WordPress] Widget Logic プラグイン [2020/12/17]

    Widget Logicプラグイン

    2020/12現在、updateがされておらず、WordPress の最新Version ではテストされていますせんが、おそらく、複雑なコードになっていないと思われるので、最新のWordPressでも使用できると思います。DeveloperはWPChefさんです。

    例えば、ページが、mobileに表示しているのか、PCに表示しているのかで条件を設定してやることで、あるWidgetの表示/非表示をコントロールしてくれるプラグインです。詳細は、リンクをご参照ください。

    条件の例

    • is_front_page()
    • wp_is_mobile()
    • etc.
    https://wordpress.org/plugins/widget-logic

    ウィジェットの表示・非表示を制御できるプラグイン Widget Logic の使い方 – vektor,Inc

    https://www.vektor-inc.co.jp/post/widget-logic/

    編集履歴

    2020/12/17, はりきり(Mr)

  • [WordPress] AMP対応化で、使用しているその他のプラグインによるエラーが出ないようにするために – プラグイン別 [2020/11/16]

    [WordPress] AMP対応化で、使用しているその他のプラグインによるエラーが出ないようにするために – プラグイン別 [2020/11/16]

    はじめに

    AMPプラグインをインストールしている場合、投稿/ページを公開/更新した際に、AMPの検証/再検証が行われます。サイト毎に使用されているプラグインがAMPに沿ったコードを作るわけでは無いため、AMPの仕様に沿わない場合があります。その結果として、「makeupエラー」や「スクリプトエラー」などがアラートされる訳です。これらのエラーは、AMPにおいてなるべく出なくすることが良いと考えます。そのエラーとなったコードを削除した場合にどうなるのかは、表示させたりしてその結果を確認しないと分かりません。

    • AMP (Accelerated Mobile Pages)はGoogleが提唱する高速化の仕様であり、以下のような制約が設定されている
    • JavaScript は使用禁止
    • CSS は head セクション内にインラインで 75,000 バイト(約 75KB) 以下
    • img タグは amp-img に置換
    • frameタグはamp-fameに置換
    • フォームや video、audio タグを利用するには専用のライブラリをロードしSSL 環境行う
    • すべての仕様に準拠する必要がある
    • AMP の詳しい仕組み

    以下の情報は、AMPプラグインを使用している前提で、その他のブラグインの使用として、エラーが出ないように工夫してきた、知識情報です。

    あるプラグインを使用する場合、使用していもエラーが出ないもの、使用すると前述のようなエラーが出るものなど、基本的にやってみないと分からないものばかりです。

    機能を充実したり、見栄えを良くしたりするために、色々なプラグインを使用することは、速度の制約となるという、トレードオフの関係にあります。その規律(ルール)となっているのが、AMPプラグインです。AMPプラグインは、速度の制約となるものをエラーとして知らせます。エラーとならない使い方、すなわち、機能の有効化/無効化が、AMPプラグインで設定が可能です。

    AMPエラーが出たとしても、そのプラグインを使用したい場合は、AMPページでの、そのプラグインの使用を無効化することで、AMPに非対応にできます。この最終手段により、そのプラグインを使用できます。

    以下は、そのプラグインを使用して、且つ、AMP対応にしたい使い方について、プラグイン別に示しました。

    基本的な設定方法

    • 使用したいプラグインを有効にして、目的のページに使用し、AMPページを更新する
    • AMPの検証済みURLを表示
      • 当該ページが赤フラグ(エラー)となっていれば、そのAMPページを表示させる
      • エラー(削除提案が出ている)について、削除のチェックをつけ、更新ボタンを押す
      • ページを表示して、表示状況を確認する
      • 問題があれば、削除提案のチェックは外す
      • 問題なければ、その後の操作は必要ない。その更新内容を受け入れることになる
    • エラーになった機能の削除を受けてれた場合は、そのプラグイでエラーとなっていた機能を削除したその操作は、今後のその他のAMPページでも自動的に採用されるので、同様のエラーとはならず、デフォルトで削除チェックが付いた状態で更新される。
    • 削除をチェックして更新した場合、その設定は、全てのAMPページに及ぶため、その他のAMPページは、「最新でない結果」というフラグが付く
    • 「最新でない結果」は、全て再検証する必要がある
      • AMPの検証済みURLを表示させ、オプションで表示数を100に設定する。
      • 最後のページを表示させて、全てをチェックして100ページを選択状態にした上で、再検証を選択し実行する。
      • 一つ前の100ページ分のリストに移動して、同様に、全てをチェックして100ページを選択状態にした上で、再検証を選択し実行する。
      • 以上を繰り返し、一つ前の100ページ分のリストを表示する番号として、最後の1までは実施せず、3番目で留めておく
      • その理由は、この再検証のタスクは、リアルタイムで実施されていないので、100ページの処理には、数十分かかるため、すでに完了したページが100ページ分のリストに表示される可能性があるため、複数回の無駄な再検証を避けるためである。

    WordPress プラグイン別

    現在は、以下、1つのプラグインのみです。

    Content of Table Plus

    • 目次の表示/非表示機能を使わない設定にする
    • AMPプラグインが提案するエラーが出る機能を削除設定で更新
    • 以後、新しいページに、以上の設定が自動的に採用される

    以上

    編集履歴
    2020/11/16 Mr.Harikiri
    2020/12/11、追記 (基本的な設定方法)
    2021/09/13,AMPの制限について追記
  • [WordPress] 「AMP」対応奮闘記 – プラグインAMPはVer.2.20になったけれど。[2022/01/05]

    [WordPress] 「AMP」対応奮闘記 – プラグインAMPはVer.2.20になったけれど。[2022/01/05]

    ID22520

    はじめに

    AMPページに対応すべく奮闘しています。当サイトで記事にしたAMP関連と情報リンクをまとめました。AMPプラグインはVer. 2.2.0になりました。プラグインをアップデートした際、またもや、「検証済みURL」での投稿の非表示の問題が出ました。対応策を見つけて何とか全ての投稿ページを検証済みURLのリストに登録させることができました(直近の対応)。

    Google Search Console

    Google Search ConsoleのAMP項目に、「エラー」、「有効(警告あり)」および「有効」があります。有効(警告あり)では、画像の大きさ関連のものが多く、推奨サイズを使うようにコメントが出ていることがあります。そのような場合には、投稿のアイキャッチ画像のサイズが小さいことが考えられます。当サイトでは、画像の最適化には「EWWW Image Optimizer」プラグインを使用していますが、画像のアップロード時にリサイズする設定において、推奨サイズ以下のサイズに設定されていることがあるので確認してみます。サイズが1200 x 675を推奨しているようなので、これより大きいサイズを設定し直します(例えば、2000 x 2000)。

    すでにWordPressにアップロードした画像を大きいサイズにリサイズすることはできないので、改めて同じ画像を元サイズを大きくするか、多いサイズが既にあれば、それをWordPressにアップロードして、更に、アイキャッチ画面に設定しなおしなす。

    AMPプラグインの「更新済みURL」が作成されない問題と対策

    AMPプラグインが正常に動かないことが多々あります。未だに完全解説には至っていませんが、以下の記録を続けてその内完全な解決策を見出せることを願いつつ、活動を続けていきたいと思います。

    おそらくは、AMPプラグインとその他使用しているプラグインとの相性の問題があると考えています。

    AMPプラグインのバージョンは、初期のバージョンアップの頻度からすると、現在は、その頻度は低くなっています、また、バージョンもだいぶ上がっています。また、使用経験も積み重ねているものの、このAMPプラグインについては、まだまだ挙動が読めません。まだまだ開発途上ということですね。

    2020/09/13

    投稿は存在しているのに、AMPの更新済みURLが作成されていなと、AMPプラグインの関連するページの各種操作において、タイムエラーなどを起こす。また、更新済みURLが作成されていないことは気持ちが悪いなどのデメリットがある。

    • 現象 : 投稿を新規に公開する場合、他のサイトを参照するプラグインを使用して多数のリンクを貼っていると、AMPのデータペースを作成/更新できなくなることがある
    • 具体例 : Advance Gutenberg Blocksプラグインの「Plugin」を使って、あるプラグインのリンクを10個張っている投稿の作成において、それを公開/更新した時、完了までの時間が非常に長くなる。投稿自体は作成/更新できるが、AMPの「検証済みURL」は作成されない。
    • 対策 : 投稿の公開/更新の最初に、原因であるAdvance Gutenberg Blocksの「Plugin」を取り除いて公開/更新を行って、AMPの「更新済みURL」が作成されたことを確認した後、原因であるそれを追加して投稿を公開/更新する

    AMP: a well-lit path to optimizing for Google’s page experience signal

    https://blog.amp.dev/2020/05/28/amp-page-experience/?utm_source=amp_newsletter&utm_medium=email&utm_campaign=amp_highlights_20126252

    AMPページに対応するプラグインは、このリンクにリストされています。

    「CoBlocks」には、アコーディオン・ブロックがあるので、助かっています。

    https://amp-wp.org/ecosystem/plugins/

    2021/10/10

    自宅のblog Serverを2台目として購入したDS920+に移行した時に、AMPの検証済みリストが出なくなってしまいました。データベースから消えたのか、データベースには存在するが、何らかの問題がありリスト化できないのか、理由はわかりません。

    以前に、再検証済みのリストを表示されるようにできた経験があります。その方法は、作業中の不手際でフォルダのアクセス権の設定(777とか664とかの設定)でミスした結果、全てのプラグインの無効化が生じた時です。その後、レスキュー作業で全てのプラグインの有効化を行なったことで解決した過去の経験です。具体的には、「WP Super Cache」プラグインを導入後、blogのフォルダーにパーミッション設定がおかしいので修正するように、というようなワーニングが出ました。そこで、NASにログインして、chmodコマンドで、そのフォルダーのパーミッションを設定して確認をしている時に、それは起きました。

    現在、過去の記事については、AMPの検証済みリストとして全く表示されないものの、新規に作った投稿では、AMPの検証済みリストに現れます。このことを利用して、投稿を一つ一つ開いて「更新」することで、AMPの検証済みリストに現れるようにできます。この作業は結構骨が折れます(2021/10/10 by MR.HARIKIR)。

    結局、一つ一つ投稿を開いては更新する作業を850行いました。完全な力技で対応してしまいました。本当は、こんなことはしたくはなかったのですが、他に解決策を見つけられず仕方くな実施しました(2021/11/05)。

    2021/01/05 : AMP Ver.2.20

    まだ、「検証済みURL」の問題は続いています。いっそのこと、有償版がある「AMP for WP」に乗り換えようとインストールして評価してみましたが、Free版では少しも速度アップは確認できませんでした。評価は、Page Speed Insightsを使用しています。
    対策(2022/01/05): 「検証済みURL」が作成されない場合、
    (1)AMPのデータベースが壊れている可能性があるので、「忘れる」処理をした後、投稿のページで更新する。
    (2)直近のプラグインの更新により「検証済みURL」が消えてしまいました。AMPデータベースが壊れた可能性/仕様の変更があります。実施した対応は、以下の通りです。キャッシュプラグインの少なともデータベースを無効にしてから、投稿ページを一つずつ開く操作を実施すると「検証済みURL」にリストされことを確認できたので全ての投稿ページに実施することにしました。素早く操作するには以下の方法が可能です。「投稿一覧」から一つずつ開き、その投稿の編集ページが開いたら直ぐにブラウザの戻るボタンで「投稿一覧」に戻るを繰り返して、一つ一つの投稿ページを開く処理する方法をとることです。連続操作できる数はNASの処理能力に依存します。投稿ページが開く速度が低下してきたら(5秒以上)、一旦休止してください。因みに、AMP関連のデータベースは、AMPプラグインの削除で削除されない仕様であることは開発者の間では知られていますが、その改善対応は未だ不十分の状況のようです。そのような状況下、プラグインのアップデートにより挙動の変化が毎回起こっています。まあ、ユーザーの立場で追従するのは大変です^^)。

    3つのURL

    AMP対応にすると3つのURLができます。以下の参考文献に詳しく書かれています。

    AMP URLの正体

    https://developers-jp.googleblog.com/2017/02/whats-in-amp-url.html

    編集履歴

    2020/09/13 はりきり(Mr)
    2020/12/13 Mr.Harikiri
    2021/02/11 追記 (Google Search Consoleのエラーや警告に対応する方法)
    2021/10/10,追記(AMP 検証済みリストが表示されない場合のとりあえずの対処法を「その他、問題解決」に記載)
    2021/11/05,追記(検証済みリストにリストさせるために、一つづつ記事を更新する作業を実施)
    2022/01/05,追記(AMPプラグインVer.2.20での「検証済みURL」の問題に対する対応策)
  • [WordPress] Synology (新)NASに立ち上げたWordPressから外へメールを飛ばす – WP Mail SMTP by WPFormsプラグインとGMail APIの設定 [2020/09/13]

    [WordPress] Synology (新)NASに立ち上げたWordPressから外へメールを飛ばす – WP Mail SMTP by WPFormsプラグインとGMail APIの設定 [2020/09/13]

    はじめに

    レンタルサーバーでのWordPressの運用とは違い、Synology NASにWordPressを構築して、サイト外へのメール送信するには、少し面倒な作業をしなければなりません。自分が選んだ道であり仕方がいなのです。

    今回の作業は、「WP Mail SMTP by WPForms」プラグインのインストール、およびGmail API (Google Developer Consoleの設定)によって、WordPressおよびその他のプラグインが、サイト外にメールを飛ばせるようにします。例えば、以下のケースです。

    • コンタクトフォーム・プラグイン
      • WordPressには、基本情報として訪問者のemailアドレスを記入し保管しています
      • 訪問者が、コンタクトフォームに当サイトへの質問、コメントを記載して送信するとき、その内容を、管理者メールアドレスに送信されます。この時、今回のプラグイン「WP Mail SMTP by WPForms」とGoogle Developer Consoleの「APIの作成」が必要です
    • Ultimate Member プラグイン
      • Ultimate Memberは、メンバーシップを構築できるプラグインです。
      • 訪問者が当サイトにemailを新規登録する場合、その申請内容を管理者メールアドレスに送信されると共に、訪問者が記載したメールアドレスに、確認用のメールを当サイトから送信します。いずれにも、今回の作業が必要です
    • UpdraftPlus プラグイン
      • UpdraftPlusは、WordPressとプラグインなど、全体的をバックアップ、リストアするツール・プラグインです
      • バックアップを開始した後、作業が終了した際に、管理者メールアドレスに、終了通知のemailを送信します。この送信を可能にするには、今回の作業が必要です

    準備

    「Google Developer console」でOAuth 2.0 クライアント IDを設定します。そのために、Google Developer consoleを使用可能にしてください。

    プラグインのインストール

    WP Mail SMTP by WPFormsをインストールします。

    インストール後は、「一般」から以下の設定の必要です。

    1. 以下の図のように設定します
    2. 送信元アドレス : これは、WordPressの設定から自動的に入力される
    3. 送信者名 : 同上
    4. メーラー : ここをGoogleに設定します

    次に、以下の設定が必要ですが、その値は、Google Developer ConsoleのAPIの設定と同時に進めていきます。

    1. ①と②は、Google Developer Console APIを設定して完了後に使用可能になります。そこからコピペします。
    2. ③は、このプラグインから提供させる値です。この値をGoogle Developer Console APIの「OAuth クライアント IDの作成」のURIの設定に使用します。まずは、右横のアイコンをクリックしてコピーしておきます

    API プロジェクトの作成

    Google Developer Consoleに入ります。

    1. 以下の図のような画面が現れます。以下の作業を進めます。
    2. メニューの「My Project」をクリックすると、「プロジェクトの選択」画面が現れます(図1)
    3. 右上の「新しいプロジェクト」をクリック

    1. 適当なプロジェクト名で、「プロジェクト」を作成(既存のプロジェクトにGMAIL APIがあれば、それを使用しても良い)
    1. メニューの「My Project」から作成した「プロジェクト」を選択
    2. もしも、左メニューの「認証情報」をセレクトしてあれば、選択した「プロジェクト」の「認証情報」画面が現れます
    3. その画面の一段目に、「同意画面の構成」ボタンが現れます。これをクリック。もしくは、左メニューの「OAuth 同意画面」をクリック

    1. 「OAuth同意画面」が現れるので、外部をチェック(内部はセレクトできない)して、「作成」ボタンをクリック
    1. 図は示しませんが、以下のような設定項目が現れるので設定していきます
    2. アプリケーション名 :プラグインがわかるように適当な名前
    3. サポートメール : Google Developer Consoleにログインしたメールアドレスが自動に入力されている
    4. 承認済みドメイン : harikiri.diskstation.me
    5. 「アプリケーション ホームページ」リンク : 同上(正確には、リンクですが、これでもOK)
    6. 「アプリケーション プライバシー ポリシー」リンク : 同上(正確には、リンクですが、これでもOK)
    7. 「アプリケーション利用規約」リンク : 必要ないようです
    8. 「保存」をクリック
    9. 確認画面が現れます。この設定内容は、左メニューの「OAuth同意画面」をクリックすると確認してできます。よく読んでみると、
    10. 確認ステータス : 検証は不要です、とあります。
    11. ユーザーの種類 : 外部
    12. OAuthレート制限
    13. 以上で、ようやく、「OAuth クライアント IDの作成」が可能となりました

    OAuthクライアント IDの作成

    1. 「認証情報」のメニューの「認証情報を作成」をクリックすると、更に目にメニューが現れます。二番目の「OAuthクライアント ID」をクリック
    1. アプリケーションの種類を「ウェブアプリケーション」に設定します
    1. その後、以下の設定を進めます
    2. ①は、とくに必要ないかもしれません。
    3. ②は、プラグインからのコピペです。
    1. 設定が完了すれば、メニューの「My Project」からプロジェクトを選択すると、「OAuth 2.0 クライアント ID」の項目にリストが追加されています
    2. その追加された項目リンクをクリックします。
    1. ③と④の「クライアント ID」と「クラアンスト シークレット」をコピーして、WP Mail SMTP by WPFromsプラグインの設定項目に、それぞれペーストします。
    1. プラグインの設定項目にペーストします。
    2. 最後に、「Authorization」項目で、橙色のボタン「Allow plugin to send emails using your Google account」をクリックします。
    1. Google Developer ConsoleでのAPI設定が正しく実施されていレバ、以下のような画面になります。

    以上で、プラグインとGMAILのAPIの設定が完了しました。Email Testで送信テストを実施してみてください。

    これで完了です。

    参考文献

    WP Mail SMTP Documentation

    https://wpmailsmtp.com/docs/how-to-set-up-the-gmail-mailer-in-wp-mail-smtp/

    参考文献

    Gmail APIでクライアントIDを有効にするまでの手順

    https://spica.tokyo/note/275
  • [WordPress] このサイトの表示に関係する使用している「テーマ」と「プラグイン」のリスト – [2020/09/11]

    [WordPress] このサイトの表示に関係する使用している「テーマ」と「プラグイン」のリスト – [2020/09/11]

    ID22353

    はじめに

    現在、皆さんが、このサイトに来て見てみいるページ表示に関わるWordPressテーマ、およびプラグインのリストを公開します。これからWordPressでサイトの構築をされる方の参考になれば幸いです。

    システム構成

    Synology NAS

    • 2020/12現在
    • DS920+ (DS918+からWordPressを載せ替え, 2020/07)
    • Disk Station Manager, Version 6.2.3-25426 Update 2 (2020/12現在)

    WordPress

    • Version : 5.6-ja
    • Theme : Twenty Twenty
    • Editor : Gutenberg (標準エディタ)

    表示に関係するプラグイン・リスト

    • AMP
      • ページのAMP化
    • Advanced Ads – Ad Manager & AdSense (有料)
      • 広告の自動挿入、手動挿入
    • Flex Posts – Widget and Gutenberg Block
      • ポスト・リスト表示(カスタマイズあり)
    • Table of Content Plus
      • ページへの自動的な目次の挿入
    • EWWW Image Optimizer (有料)
      • 全てのイメージを圧縮・最適化とLady Loadなど
    • Default featured image
      • feature imageを設定していない場合のDefault imageを自動設定
    • Flying Analytics by WP Speed Matters
      • レスポンス改善
    • Insert Pages
      • 表示のカスタマイズ
    • Share Buttons by AddThis
      • TwitterなどのSNSへの投稿

    以上

    編集履歴
    2020/07/11 Mr.HARIKIRI
    2020/12/15、現状にupdate
  • [PHP] プログラミング – include, require – パス [2020/07/08]

    [PHP] プログラミング – include, require – パス [2020/07/08]

    外部の関数を使うには

    プラグインの関数チェック

    プラグインの削除/停止で、使いたい関数がなくなったことも考慮して存在をチェックします

    if ( function_exists( ‘function_in_plugin’ )){ function_in_plugin(); }

    phpファイルを挿入

    • include(), require()の機能
      • include(), include_once(): ファイルが無い場合、警告するが実行停止しない
      • require(), require_once(): ファイルが無い場合、実行停止する
      • その位置に単純挿入
      • 両者で変数を共有できる
    • include(/hoge/hoge/file.php), require(/hoge/hoge/file.php)でのパスの設定
      • dirname(__FILE__) : 現在パス
      • $_SERVER[‘DOCUMENT_ROOT’] : blogのルートパス
      • 相対パス : ‘../path/file.php’) : ‘..’はパスを1つ戻ってfile.phpを探す。ない場合は、元パスも探す(らしい)。
      • SERVERの設定
        • include_path変数の変更/設定
        • set_include_path(hoge/hoge);で初期値を変更可能
        • ini_set(‘include_path’, ‘/hoge/hoge’);でも可能

    PHPの挙動に関するセッティング

    サーバー側の設定です。キャッシュや使用するメモリー容量、その他の細かな設定が可能なようです。僕の場合は、Synology NAS のDSMからWebStationを起動して、script language settingのcoreタグで数値の設定をします。

    今現在では、その設定の仕方がよく理解できていません。以下には専門用語(キーワード)を抽出してどのような内容な内容なのか理解を進めている途中です(2021/11/26)。

    FPM

    FastCGI Process Manger (FPM)は、Synology NASのWebStationからパラメータを設定できます。

    FastCGI Process Manager

    https://www.php.net/manual/ja/install.fpm.php

    APC

    APC

    https://havelog.aho.mu/develop/php/e167-php-apc-install.html

    https://www.php.net/manual/ja/apcu.configuration.php

    編集履歴

    2020/08/25 Mr.HARIKIRI
    
  • [WordPress] blogに載せる写真のメタデータは、EWWW Image Optimizerで取り除く [2020/08/20]

    [WordPress] blogに載せる写真のメタデータは、EWWW Image Optimizerで取り除く [2020/08/20]

    EWWW Image Optimizerプラグイン

    WordPressのblogで載せる写真は、そのままのサイズでアップしてはいけません。メタデータはそのまま残っているためです。メタデータのGeotabには、位置情報が記録されています。WordPressのプラグインの内、写真のサイズを小さくしてくれるプラグインを使えば、将来にきっと困るサイトのレスポンス速度も改善するので、単にメタ情報だけを取り除くプラグインよりは合理的です。EWWW Image Optimizer というプラグインは、写真のデータサイズを小さくできるし、メタデータも削除する事ができます。無料版では、小さくできる割合が50%程度ですが、有料版では、10%未満の縮小化も可能です。確か、¥1,000で3,000枚の写真を処理できる許可がもらえます。最初は、これで試してよければ、更に購入すれば良いでしょう。

    運用方法

    無尽蔵に写真をblogに使用するためにアップロードすると、EWWW Image Optimzerで購入した写真数を直ぐに超えてしまいます。サイズ違いもカウントされるので注意が必要です。

    そこで、Mr.Harikiriは以下の方法を考えました。スライドショーにできる写真は、iOSの写真アプリでスライドショーにしてしまうのです。

    そのスライドショーを写真の代替にして、写真は、削除します。削除するとEWWW Image Optimizerの可能な写真数を削減できるはずです。

    編集履歴

    2020/08/20, Mr. Harikri
    2022/08/12, 追記(運用方法: スライドショーにしてしてしまう)

  • [サイト運用] これまで使ってきたTooltipプラグインであるEncyclopedia Proを今後は使わないことにした – その後、再インストールして復活させた理由 [2020/12/16]

    [サイト運用] これまで使ってきたTooltipプラグインであるEncyclopedia Proを今後は使わないことにした – その後、再インストールして復活させた理由 [2020/12/16]

    はじめに

    WordPressの投稿において,登録したワードに吹き出しをつけることができる「Encyclopedia」というプラグインに関する内容です.現在,このサイトでは,Encyclopediaによる吹き出しはしなくななりました.自分でphpコードを作り代替できるようになったこと,および,EncyclopediaはAMP対応ではななかったこと,更にサイトのレスポンスを向上させたいためです.

    以下の記載は,Encyclopediaを使用しないくなるまでのプラグイン導入記です.備忘として残します(2022/11/18, by Mr. Harikiri)

    Encyclopedia Pro

    Encyclopedia Proは、有料版です。Tooltip(用語を登録しておけば吹き出しを出したり、hyper linkへ飛ぶことが可能となる)プラグインです。Encyclopediaは、ページへのアクセスがあった場合に、表示の際に登録リストから、そのページに記述されているワードを検索して、リンクを付ける処理をリアルタイムで行うプラグインです。そのため、Encyclopediaに登録されている数が多くなるほど表示レスポンスが低下することが予想されますが、しぱらくは運用を続けてみます。

    Disable期間と再開

    Pro版を購入して半年以上運用してきましたが、以下の理由のから、このプラグインを外すことにして、2020/07/11から2020/12/13までDisableにしていました。Diableの理由は、以下の通りですが、今回、Enableにした理由は、十分ではないものの対策が得られたためです。

    Disableとした理由

    • 英語と日本語が併記されたページで不具合がある
      • 日本語で単語が一致してするように設定すると、英語単語において一部の一致でも認識されてしまう
      • 原因は、日本語では単語と単語には空白がありませんが、アルファベット圏の文章では、単語と単語の間には、必ず空白があります
      • この処理が丁寧にコードとして盛り込まれていないと日英の併用は難しいことを理解しました。今後のバージョンアップで対応できる内容出ないことも理解しました
    • 登録していたほとんどのエントリーの記述内容(excerption)が消えてしまっていた
      • 原因は、よくわかりませんが、以下のイベントがありました
      • WordPress ServerをDS918+からDS920+に載せ替えた
      • WordPressのバージョンアップをした
      • Encycropedia Proのバージョンアップをした
    • Tooltipプラグインを導入する当初から懸念していた問題を、自分の中で払拭できなかった
      • 投稿ページを表示する場合、Tooltipプラグインは、その内容を登録されたワードの全てを使って検索してhtmlのhyper lineを作ると考えられるが、登録ワードの数,または/および,投稿に出で来る単語のガスが増えてきた場合、その処理にかかる時間が,その数に応じて増えていくと考えられる
      • この問題はサイトの応答速度に影響するため、登録することの足かせとなってくるのではないかとの懸念を持っていた
    • 代替案を具体化できるphpコードを書けるようになってきた
      • 説明したいワードについて、必ずしもhyper linkや吹き出しにせずとも、投稿の最後に一括して、キーワードとして表示されることでも良いのではないかと納得できるようになってきた
      • 投稿の最後に一括して、必要なワードの表示を可能とするコードを実際にサイトに載せてみたところ、使えそうであることが確認できた

    今回、Enableして再開した理由

    • 以下のように、Case sensitivityを有効にすることで、ある程度の対策となるため。
    • 例えば、AMPを登録していて、Sampleという文言があった場合、Sampleのように赤字のampが当たっていまう。そこで、大文字のAMPで無い限り当たらないようにすることで、Sampleのampには当たらないようにした。
    • この対策は、完全ではないですが、登録ルールの徹底によって、途中マッチングを相当数を抑制できると思われる。この運用でしばらく継続していこうと考えている。

    まとめ

    • Encyclopedia Proを2020/07/11~2020/12/13まで、disableとして、Encycropediaによる機能を停止していた。
    • Encyclopedia で登録してしていた、ワードについては、投稿ページに再登録してきたが、投稿ページには、豊富な情報の登録のために使用することを今後も継続する。
    • phpコードの概要 : 登録する投稿ページのタグには、タイトルと同じワードを登録する。このタグを離床して投稿ページを表示した後、タグ検索により関わるワードを一括表示される。今後も継続する。
    • 運用しなが、phpコードの成熟を図っていく。今後も継続する。

    そして、サイトはの作りは、単純化されていくことをEncyclopediaの無効化と「投稿ページにキーワードを登録する方法」で目論んだものの、やはり、インタラクティブな単語の意味の理解が可能となるEncyclopediaプラグインを外すことは残念であると考えていた。今回のEncyclopediaの再開を許容できたことは、満足している。

    Simple is best, but additional better function is wonderfull!

    編集履歴
    2020/07/11 Mr.はりきり
    2020/12/14、追記 (Encyclopedia Proの再開)
    2020/12/16、追記 (SPIスコアの劣化は避けられない、現時点で8~10ポイントの低下)
    2022/11/18,追記 (完全にEncyclopediプラグインを削除した)
  • [WordPress] ブログサイトのスピード測定 – GTmetrix.com [2020/07/24]

    [WordPress] ブログサイトのスピード測定 – GTmetrix.com [2020/07/24]

    はじめに

    サイトのスピード測定には、GTmetrix.comとPageSpeed Insightsがあるが、それぞれ測定方法に違いがあることを、EWWW Image Optimizerの有料版のサポートEmailで情報を頂いた。

    最初のサイト速度改善は画像圧縮

    サイトの速度改善として、画像圧縮は最初に直面してする課題です。「はりきり(Mr)サイト」では、「EWWW Image Optimizer」プラグインを使っています。Free版を使用してから有料版に切り替えました。有料版は、Free版より更に圧縮率が高くなります。3000枚単位は1000円程度ですが、割安の1万枚単位でもクレジットできます。

    その次の対策は・・・

    画像圧縮の次は、キャッシュ設定、JavaScriptやHTMLなどのコードの最適化を行います。これらの詳細については、当サイトの関連記事をご覧ください。

    サイト速度の評価

    対策の結果を知るには、評価が必要です。

    速度対策の成果を測定するには、皆さんよくご存知のGoogle PageSpeed Insightsが有名ですが、今回紹介する「GTmetrix.com」とでは、画像の圧縮形式に対してそれぞれ以下特徴があるようです。向き不向きは、さて置き、GTmetrix.comでは、どの処理にどれくらいの処理がかかったのか、そのシーケンスをチャートで詳細に得られたり、その他、詳細な分析結果が得られることが特徴です。

    • Google PageSpeed Insights : 不可逆圧縮画像を配信するサイトの評価に向く
    • GTmetrix.com : 不可逆圧縮画像を配信しないサイトの評価に向く

    GTmetrix.com

    • GTmetrix.com : 不可逆圧縮画像を配信しないサイトの評価に向く
    • どの処理がどれくらい処理時間を要したかのタイムライン・チャート表示
    • その他

    GTmetrix.com (サイト速度分析サイト)

    http://gtmetrix.com/
    編集情報
    ID 9721
    2020/06/15 Mr.はりきり
    2020/07/24 GT metrixサイトで測定している動画を追加

    以上