新WordPressテーマ「THE THOR(ザ・トール)」へ改装完了!
Easy CountDowner

【WordPressプラグイン】Easy CountDownerの使い方と設定方法!デモサイトもあるよ

大手通販サイトなどでセール期間の終了をカウントダウンで表示されているのをよく見ませんか?

ただの文字だけで「〇月〇日〇時〇分で終了します。」

より

「あと〇日〇時間〇分で終了します」

とカウントダウン方式で表示されている方が、見る見る時間数が減っていき、見ている人に焦りを促して購買意欲が高まる効果が期待できます。

またはクリスマスやお正月などの行事ごとでは、ワクワク感を持たせることができますし、イベント告知にも効果が出るでしょう。

今回は、WordPressのプラグインでカウントタイマーを設置することができる「Easy CountDowner」を紹介します。

タケ坊
タケ坊
たしかにセール終了まで1日きってる!と思ったら、早く何か買わなきゃ!って思っちゃうかも。
柚子
柚子
あと、クリスマスまであと何日だ~って分かったらワクワクしちゃうしね!

WordPressプラグイン「Easy CountDowner」とは?

Easy CountDownerとは?

Easy CountDowner」は、設定した期限を「年」「月」「日」「時」「分」「秒」でカウントダウンしてくれるプラグインです。

しかも「秒」の単位はアニメーション表示になっていて、ちょっとカッコいい感じですね。

  • シンプルな設定
  • JavaScriptでアニメーション表示
  • 色や文言を自由に設定
  • 任意の場所にショートコードが自動で挿入
柚子
柚子
特に難しい設定もなく、簡単にカウントダウンを表示させれるよ!

デモサイトへGO!

Easy CountDownerのインストール

それではEasy CountDownerをインストールしましょう。

管理メニュー画面のプラグイン新規追加から「Easy CountDowner」を検索してインストールします。

柚子
柚子
プラグインのインストール方法はこちらの記事を参考にしてね!
関連記事

タケ坊 今回はWordPressの基本の1つ、プラグインのインストール方法について話しましょうか。 柚子 そーだね!ところで、そもそもプラグインが分からないって人はいないかな? タケ坊 […]

WordPressプラグインのインストール方法
柚子
柚子
プラグインをインストールしたら【有効化】を忘れないでね!

プラグイン新規追加からインストール

または公式サイトからダウンロードしてインストールします。

【公式サイト】Easy CountDowner

公式サイトからダウンロードしてインストール

Easy CountDownerの設定方法は?

Easy CountDownerの設定はビジュアルエディター上で行います。

投稿編集画面を開き、上部のツールバーに「CountDowner」ボタンが追加されているのを確認してください。

ビジュアルエディタで使用

このボタンをクリックすると設定画面が開きます。

設定画面

柚子
柚子
各設定項目は次の通りです。
①CountDowner Unique Name タイマーの設定名を決めます。
②CountDowner End Date タイマーの終了日を設定します。
③CountDowner End Time タイマーの終了時刻を設定します。
④Label for Days 日付けのラベルを設定します。デフォルトは「Days」日本語なら「日」に変更します。
⑤Label for Hours 時刻の時間ラベルを設定します。デフォルトは「Hours」日本語なら「時」に変更します。
⑥Label for Minutes 時刻の分ラベルを設定します。デフォルトは「Minutes」日本語なら「分」に変更します。
⑦Label for Seconds 時刻の秒ラベルを設定します。デフォルトは「Seconds」日本語なら「秒」に変更します。
アニメーションのエフェクトを「Smooth」「Ticks」から選択します。
⑨Select CountDowner Theme タイマーのテーマを「Super Slim」「Thick」「Fat」から選択します。
⑩Countdowner Circle Color タイマーのサークルカラーを設定します。
⑪Days Circle Color 「日」のサークルカラーを設定します。
⑫Hours Circle Color 「時」のサークルカラーを設定します。
⑬Minutes Circle Color 「分」のサークルカラーを設定します。
⑭Seconds Circle Color 「秒」のサークルカラーを設定します。

カラーコードはこちらのサイトを参考にしてみてください。

カラーコード検索

柚子
柚子
エフェクトやテーマはデモサイトの方でテストしてるから見てみてね!

デモサイトへGO!

Easy CountDownerの使い方

使い方は簡単です。

上の設定で「OK」ボタンをクリックすると反映されます。

ビジュアルエディターではコード表示がそのままなので実際の表示状態は分からないですが、プレビューで確認できるので安心してください。

ビジュアルエディター上の表示

柚子
柚子
ビジュアルエディターなのにコードが表示されたら間違えたと思っちゃうのはワタシだけ?

Easy CountDownerの注意点

注意点

便利なカウントダウンタイマーのプラグインですが、いくつか注意点があります。

プラグインの最終更新が1年前(2018年9月現在)

プラグインの最終更新が1年前となっていて、検証済みWordPress最新バージョンが4.7.11となっています。

2018年9月現在のWordPressバージョンは4.9.8ですが、今のところ正常に作動しています。

しかし今後、このままプラグインが更新されない場合は不具合が出る可能性があるので注意が必要でしょう。

スタイルがシンプル過ぎる

これは好みがあると思いますが、表示のスタイルが僕から見るとちょっとシンプル過ぎるかな~って感じがしますね。

デモサイトの方を見てもらうと分かると思いますが、「時」や「分」の表示が小さいのも見ずらい印象です。

これで十分という人には良いとは思いますが、もっとスタイルのバリエーションがあったら嬉しいですね。

デモサイトへGO!

WordPressプラグイン「Easy CountDowner」のまとめ

まとめ

いかがでしたか?

今回は、WordPressの記事にカウントダウンタイマーを表示させるプラグイン「Easy CountDowner」のインストールから使い方までを紹介しました。

シンプルにカウントダウンタイマーを表示させたい場合は、ぜひ導入を検討してみてくださいね。

タケ坊
タケ坊
カウントダウンタイマーに関しては、外部サイトを利用する方法もあるので、今後記事にしたいと思います。
柚子
柚子
乞うご期待!
Easy CountDowner
最新情報をチェックしよう!