Mai Suzuki Photo Works

タグ: wordpress

  • 【解決】WordPressのElementorで500エラーが出て公開・更新ができない

    WordPressのプラグイン「Elementor」便利なのでWEB操作に慣れない方へのサイトで頼りがちなのですが、しょっちゅう500エラーで更新できなくなるのが悩ましい。

    500エラーが出た際の解決方法としてWAFの無効が一般的のようですが解決せず、プラグイン「WP-Optimize」のインストール＞データベース＞すべての投稿リビジョンをクリーンにチェック＞[最適化を実行]を押下 で解決。

  • 【解決】WordPressのThe Event Calendarでページネーションのリンクが無効になる

    WordPressのプラグインThe Event Calendar、All-In-One Event Calendar亡き今、イベント関連のプラグインではこれが一強らしい。

    ということで依頼を受けてインストールしたものの、「前のイベント」「後のイベント」のページネーションリンクが効かない。URLを観てみると、URL内に日本語が入ってしまっている。

    これはどうもリンク構造と翻訳の問題らしく、Gemini先生に聴いてみてテーマ内のfunction.phpにリンクを翻訳しないコードを書いてみても解決せず。結局パーマリンクを「月と投稿名」（https://hogehoge.com/2026/01/sample-post/）から基本（デフォルト：https://hogehoge.com/?p=123） にしたところ解決。

    これにともない、リダイレクト処理が必要になりプラグイン「redirection」をインストールすることに。

  • ロリポップ WordPressのデータベースMySQLを5.6から8にバージョンアップする

    2024年の2月あたりから、ロリポップのライトプランでもデータベースを複数作成することができるようになったらしいのでこれを機に5.6だったMySQLを8にバージョンアップすることに。

    こちらを参考にさせていただきました。

    ロリポップ・データベース(MySQL8.0 (← 5.7(5.6)バージョンアップデートの手順

    • WordPress管理画面＞ツール＞エクスポート　でバックアップを取得
    • ロリポップ管理画面（FTPでも）のロリポップFTPにてwp-config.phpを複製→リネーム
    • 上記のDB名、ユーザ名、DBパスワード、DBテーブル接頭辞をメモ（wp_）
    • ロリポップ管理画面＞サーバの管理・設定＞データベースで現行のphpMyAdminに入りエクスポートを実行
      • 左メニューからテーブルを選択
      • エクスポートをクリック
      • テーブルは全選択
      • 生成オプションの下記にチェック
        • CREATE DATEVASE / USE コマンドを追加する
        • DROP TABLE / VIEW / PROCEDURE / FUNCTION / EVENT コマンドを追加する
      • 「実行」を押下→生成されたsqlファイルをデスクトップに保存
    • ロリポップの管理画面＞サーバの管理・設定＞データベースで新規にデータベースを作成
      • このとき、旧DBとパスワードを同じにしたほうが便利
      • phpMyAdminに入る
      • 左メニューからテーブルを選択＞インポート＞デスクトップに保存したsqlファイルを選択＞実行
    • インポートエラー #1044が出たのでsqlファイルの古いDB名を新しいDB名に書き換えて保存
      • Database: 「古いDB名」
        CREATE DATABASE ××× DEFAULT CHARACTER SET
        utf8 ××× COLLATE ××××××;
        USE 「古いDB名」;
    • 再挑戦するとだいたい成功する
    • ロリポップFTPにてwp-config.phpを編集
      • DBパスワード、DB名、ユーザー名など。接頭辞も忘れずに
      • 編集したwp-config.phpはパーミッション400でアップロード、アップロード後に600に書き換え

  • WordPressで特定のカテゴリのアイキャッチ画像を並べる（ディスコグラフィの作り方）

    ミュージシャンのサイトを作成していると、必ずディスコグラフィーを作りたいという場面に遭遇します。要件は以下の通り

    • 投稿でカテゴリを「ディスコグラフィー」にチェックを入れた投稿を並べたい。
    • アイキャッチ画像と、本文タイトルだけを表示したい
    • アイキャッチ画像は正方形でグリッドに並べたい
    • レスポンシブだとなおよし

    イメージはこんなかんじ。Discographyではないですが「Theme」というカテゴリーに関連づけられた投稿のアイキャッチが時系列順に正方形で並んでいます。

    今まではNewpost Catchというプラグインにお世話になっていたのですが、デバイスの解像度があがってきた昨今、thumbnailサイズの画像しか取得できないのは厳しい。というわけでWP_Queryを使った方法で実装してみました。

    プラグイン

    WP Codeというコードをスニペットとして登録、ショートコードとして本文に埋め込めるプラグインを使用します。

    コード

    WP_Queryで以下を作成し、WP CodeでCode Snipetを新規作成し、コードを入力します。そこで生成されたショートコードを本文の表示したいところに挿入すれば、サムネイル集が好きなところに表示できるようになります。

    <?php
    $args = array('posts_per_page' => -1, 'orderby' => 'date');
    $query = new WP_Query($args);
    $query = new WP_Query( 'cat=492' );
?>
<?php if( $query->have_posts() ) : ?>
<ul class="list-gallery">
    <?php while ($query->have_posts()) : $query->the_post(); ?>
    <li>
        <div class="thumbnail"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('medium'); ?></a></div>
        <div class="title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></div>
   </li>
   <?php endwhile; ?>
</ul>
<?php endif; ?>
<?php wp_reset_postdata(); ?>

    $args = array(‘posts_per_page’ => -1, ‘orderby’ => ‘date’);
    posts_per_pageを-1にすると上限なく表示できる…はずなのですが、ダッシュボードの表示件数に依存してしまいます。
    orderbyをdateにすると投稿日時順（昇順）で並びます

    $query = new WP_Query( ‘cat=492’ );
    cat=のあとにカテゴリーIDを入力することで特定のカテゴリーのアイキャッチだけひっぱってこれます

    <ul class=”list-gallery”>
    画像をグリッドで並べるのに使うクラス

    <div class=”thumbnail”>

    画像の大きさを制御するのに使うクラス

    CSS

    CSSはこんなかんじで可変のグリッドにしています（CSSは得意ではないのでもっとすっきりした方法があると思いますが）

    
ul.list-gallery{
  display: grid;
  grid-gap: 10px;
  overflow: hidden;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  list-style:none
}

.list-gallery li {
  margin-right:10px;
}

.thumbnail img{
  width:250px;
  height:250px;
  object-fit: cover; 
}


  • WordPressで「現在メンテナンス中のため、しばらくの間ご利用いただけません」から復旧できない

    なんでかメンテナンス画面から復旧できなくなってたんだけど、リモート側のルートを表示して「.maintenance」を一旦「.maintenance_」（アンスコ追加）とリネームしたら正常に表示されるようになった。なんだったんだろ…

    ありがとう過去に同じ障害に陥った人…

    https://www.terakoya.work/wordpress-maintenance-howto/


  • ロリポップでWordPressのアップロードファイル容量の上限を変更する方法

    今どき写真の容量なんて軽く3MB, 4MBはあるこのご時世に
    Wordpressって、なぜか2MBまでの写真しかあげられなくて不便ですよね。
    で、調べてみたところphp.ini, htaccessを使った変更方法が。

    参考
    http://www.magical-remix.co.jp/magicalog/archives/2857

    しかしながら、php.iniとhtaccessの両方トライしたものの
    WordPressの管理画面ではいっこうに反映されず…
    ホスティングサービスのロリポップのFAQを調べたところ
    管理画面からPHP.iniを編集できるようでした。

    ログイン＞WEBツール＞PHP設定＞ドメインを選択し「設定変更へ」をクリック
    「■そのほか」の表内にある
    ====================================
    upload_max_filesize
    「 post_max_size 」 も同時に変更します
    ====================================
    上記を2Mから20Mに変更することで対応できました。
    ちなみにここのPHP設定でPHPのバージョンもアップできる。ロリポップべんり。

  • WordPressで公式テーマをアップデートするとカスタマイズが消えるときの対処法

    子テーマを作ることで解決できました。

    たとえばtwentyfifteenを親テーマとし、子テーマ「twentyfifteen-child」を作る、というふうなかんじ。これだとカスタムした部分は別ディレクトリに保存されているので、親テーマにアップデートがかかっても子テーマに記載したカスタマイズは影響を受けません。

    まず、カスタマイズ用をディレクトリ（twentyfifteen-child）を作成して、中に白紙のstyle.cssとfunctions.phpを作成して放り込みます。
    そして、style.cssのトップに下記を記載

    
/*
Theme Name: テーマの名前（Twentyfifteen-childとか)
Theme URI: http://example.com/wp-content/themes/twentyfifteen-child/
Description: Twenty Fifteen Child
Author: なまえ
Author URI: http://example.com/
Template: twentyfifteen　（親テーマの名前）
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-fifteen-child
*/

    functions.phpに下記を記載

    あとは必要に応じてheader.php, footer.phpなんかを放り込んでいくと親テーマを上書きしてくれます。functions.phpだけは上書きされないようです。
    そこまで用意ができたら管理画面の外観＞テーマから子テーマを有効にします。
    わたしは-childという名前にするとサイト運営者がわかりにくいので、サイトのサービス名を子テーマの名前にしています。

    参考：
    http://wpdocs.sourceforge.jp/%E5%AD%90%E3%83%86%E3%83%BC%E3%83%9E

  • WordPressの多言語対応：プラグイン「mqTranslate」の実装

    2015/5/1追記
    mqTranslateはアップデート止めてしまったらしいので、qTranslate-xに移行しました。

    サイトを多言語対応にしたい。日英対照のページを作るのはいいとして、はて、どうやって言語を保持したままのナビゲーションを作ったらいいんだろう、と思って調べたところ、さすがオープンソース。「あったらいいな」というものはたいがいどこかの偉い人が作ってくれているものなのですね。ありがたいことです。

    WordPressを多言語対応するにあたってのメモ (さらに…)

  • WordPressで、カテゴリー別サムネイル一覧を作成する Newpost Catch

    WordPressで、1枚の固定ページの中に、カテゴリーごとにまとめられたサムネイルのブロックを配置したいなあと思ったことはないでしょうか？写真をやっている人はギャラリー、音楽をやっている人ならディスコグラフィ、料理をやっている人ならジャンル別写真一覧など、結構使う場面はありますよね。わたしは写真をやっているので下記のように運用しています。

    • ギャラリーのインデックスを固定ページで用意
    • 個別の写真は投稿ページで更新

    で、新しい投稿をするたびに、ギャラリーのインデックスに個別ページのサムネイルが自動で追加され、かつ、それがカテゴリー別にまとめられたら良いなと思っておりました。
    今までは調べまくってindexテンプレートにphpを直書きして実装していたのですが
    Newpost Catchという素晴らしいプラグインを見つけたので僭越ながらご紹介します。

    Newpost Catch

    詳細は上記ページをご覧いただくとして

    [npc]

    Newpost Catchのショートコードについて
    ほんとうに素晴らしいプラグインをありがとうございます！

    ちなみにNewpost Catchを利用して組んでいるのが下記のページになります。
    私は本文にはimgを挿入していないのですが、アイキャッチ画像に画像を設定するとひっぱってきてくれます。便利ー！（実際の個別投稿ページではアイキャッチ画像はdisplay:noneで消しています）

    Gallery | Mai Suzuki Photo Works

  • WordPressのトップの表示が遅い場合の対策

    http://www.inboundpress.net/wordpress-speed.html

    上記サイトを参考に、キャッシュ系のプラグインをいくつか入れてみた。

    速度計測サイト
    http://gtmetrix.com/

    WPプラグイン

    • MO Cache
    • WP File Cache
    • WP Super Cache
    • WP Widget Cache
    • Head Cleaner
    • DB Cache Reloaded Fix

    体感としては早くなったような気がするがGTmetrixの評価は変わらずだった。

  • WordPressのプラグイン Slickr FlickrでFatal errorが出た場合の対処方法

    ◆エラーが出た場合の対処方法
    Fatal error: Theme CSS could not load after 20 sec. Please download the latest theme at http://galleria.io/customer/.
    というエラーが出た場合の対処方法
    Galleriaが呼んでいるCSSに不具合があるっぽいのでWordPressの管理画面で

    設定　> Slickr Flickr　> Galleria Optionで「Galeria not required so do not load the script」を選択 > Save Changesを押下

    で解決した。

    ◆Flickr IDの探し方
    http://flickr-id.cohga.net/

    ◆setをサムネイルで表示する場合のタグの記述方法
    [slickr-flickr type=”gallery” search=”sets” set=”setのID番号” items=”アイテム数”]