その他

2022.07.29

Simple Calenderで日付/曜日がズレてしまう時の解決法

WordPressにGoogleカレンダーを連携して表示、デザインも自由にカスタマイズができる便利なプラグインのSimple Calendar
とても使いやすいのでよく使用しているのですが、日付と曜日がズレて崩れてしまうバグ?が最近起こりました…。

今回はその時に行った対処法についてご紹介いたします!

使い方についてはこちら

[card url=”https://note.spiqa.design/wp/googlecalendar/”]

起こった事象

普段通りカレンダーの設定をしていたのですが、このように表示がされました。

まず、【日曜始まり】で設定をしているのに一番左の曜日の表示は【土曜日】になっています。
カレンダーの中身をよく見ると、日付部分の表示は【日曜始まり】で設定と合っており、どうやら曜日と日付の部分がズレてしまっているようです。

原因調査をしている中で、「Wordpressのタイムゾーンが9時間ズレる」という事象の記事をいくつか見かけ、どうやらそれと同じようでした。

原因はたったの1行の記述

WordPress設定や、Googleカレンダーの設定とズレていないか、プラグイン設定の間違いがないかなど…
諸々の設定を片っ端から変えていたのですが直らず。

思い当たるところがなかったので、テンプレートファイルの中の設定周りを確認したところ、header.phpに下記の記述がありました。

<?php date_default_timezone_set('Asia/Tokyo'); ?>

タイムゾーンを東京に指定するための記述なのですが、こちらが原因でした。
date_default_timezone_set()で設定をすると、タイムゾーン設定が9時間ズレてしまうようです。

どうしてもタイムゾーンの設定が必要な場合

消せば解決ではあるのですが、APIなどとの連携の都合上、どうしてもタイムゾーンの設定が必要になる場合もあると思います。
WordPressのコアファイルのwp-settings.phpの中のdate_default_timezone_set( ‘UTC’ );を修正するという手もありますが、あまり推奨されていません。

そのため、どうしてもタイムゾーンを取り扱う場合はWordpress側で用意されているdate_i18n関数を使用することをお勧めします!

<?php date_i18n('Y-n-j'); ?>

まとめ

数時間悩んだ結果、まさかの1行の記述だとわかったときは驚きでした…。

今回はSimple Calenderで起こりましたが、その他のプラグインや対応の中でも起こりかねない事象のため、参考になれば幸いです!

この記事をシェアする

関連記事

  • 2024.03.22

    Webデザインにおけるアニメーションについて考えてみた〜実例編〜

    その他

  • 2024.03.12

    Webデザインにおけるアニメーションについて考えてみた〜メリット・デメリット編〜

    その他

  • 2024.02.02

    Webデザインにおけるアニメーションについて考えてみた〜目的編〜

    その他

おすすめ記事

  • 2023.11.14

    コーダー同士の情報のやり取りで効率がアップした話

    その他

  • 2022.02.04

    Photoshopで簡単に白背景を透過させる方法

    その他

  • 2021.04.28

    【HTML5】HTML5からのsmallタグの使い方

    その他

TAG

×