ショートコードでも説明をしましたが [ss timelimit] と記載することで、カウントダウがゼロになるタイムリミット日時を表示させることができます。
表示例:2100年 12月 31日 23時間 59分 59秒
特定の数値だけ表示するショートコード
- 基本 → [ss timelimit]
- 年だけ表示 → [ss timelimit_year]
- 月だけ表示 → [ss timelimit_month]
- 日だけ表示 → [ss timelimit_day]
- 時だけ表示 → [[sstimelimit_hour]]
- 分だけ表示 → [ss timelimit_min]
- 秒だけ表示 → [ss timelimit_sec]
直近の「もっとも期限が早いカウントダウン」が対象
親子ページの両方に時間制限がされている場合、表示されるタイムリミット日時は、カウントダウンと同じ条件にて特定をされます
タイムリミット日時HTMLソース
スタイルシートの設定を行うことでカウントダウンタイマーをデザインすることが可能です。下記に出力されるHTMLコードを記します。
<span class="ss-tlt ss-timelimit">
<span class="ss-tlt-num ss-tlt-year">2100</span><span class="ss-tlt-str ss-tlt-year-str">年</span>
<span class="ss-tlt-num ss-tlt-month">4</span><span class="ss-tlt-str ss-tlt-month-str">月</span>
<span class="ss-tlt-num ss-tlt-day">20</span><span class="ss-tlt-str ss-tlt-day-str">日</span>
<span class="ss-tlt-num ss-tlt-hour">23</span><span class="ss-tlt-str ss-tlt-hour-str">時間</span>
<span class="ss-tlt-num ss-tlt-min">59</span><span class="ss-tlt-str ss-tlt-min-str">分</span>
<span class="ss-tlt-num ss-tlt-sec">59</span><span class="ss-tlt-str ss-tlt-sec-str">秒</span>
</span>tlt-num ss-cdt-hour">0</span><span class="ss-cdt-str ss-cdt-hour-str">時間</span><span class="ss-cdt-num ss-cdt-min">56</span><span class="ss-cdt-str ss-cdt-min-str">分</span><span class="ss-cdt-num ss-cdt-sec">19</span><span class="ss-cdt-str ss-cdt-sec-str">秒</span><span class="ss-cdt-num ss-cdt-milli">42</span></span>
それぞれに設定されたClassを利用してデザインするようにしてください。
Wordpress 本文内に <style></style> を記入すると不要な改行タグが混入してデザインが崩れる場合があります。おすすめプラグインなどを利用してください。
設定例
<style>
/* 数字のデザインを指定する */
.ss-tlt-num { font-size: 20px; color: #3333ff; }
</style>