[WordPress] 外掛分享: PCF New Year Countdown

首頁外掛目錄 › PCF New Year Countdown
WordPress 外掛 PCF New Year Countdown 的封面圖片
10+
安裝啟用
尚無評分
3817 天前
最後更新
問題解決
WordPress 4.0+ v1.2 上架:2015-09-13

內容簡介

基本指令

此外掛是可以直接使用,安裝後只需要在想要呈現倒數的地方加入簡碼即可。

使用範例:[pcf_ny_countdown]

預設的倒數格式是以天數呈現(例如:「離新年還有 105 天!」)

更改呈現格式

透過指定簡碼的「type」屬性,可以更改倒數的呈現格式,例如:

[pcf_ny_countdown type="days|weeks|sleeps"]

可以選擇以下三種格式之一:

天數
週數
尚須睡眠天數(用於年末跨年的倒數,例如:「尚須睡眠 5 天,即將歡迎新的一年!」)

若未指定「type」屬性或輸入的屬性無效,則預設為「days」(天數)。

範例:

[pcf_ny_countdown type="weeks"]

呈現效果為:

距離新年還有 `x` 週 `y` 天!

自訂呈現樣式

自訂呈現樣式屬於進階功能,需要使用自定義 CSS。

若指定簡碼的「id」屬性,可以在 CSS 中使用此 ID 設定樣式。

例如:

[pcf_ny_countdown id="my-id"]

會以以下 HTML 呈現:

<p id="my-id">...</p>

可以在「外觀 > 編輯器」中新增自定義的 CSS,如果你的主題支援自訂 CSS,也可以透過主題選項新增自訂的樣式。如果編輯器中有自定義的 CSS 檔案,建議使用該檔案來設定自訂樣式。

以下是一個自訂樣式的範例:

#my-id{
color: red;
font-size: 16px;
text-decoration: underline;
}

這會將輸出的倒數樣式設為紅色底線、字體大小為 16px。

外掛標籤

開發者團隊

⬇ 下載最新版 (v1.2) 或搜尋安裝

① 下載 ZIP → 後台「外掛 › 安裝外掛 › 上傳外掛」
② 後台搜尋「PCF New Year Countdown」→ 直接安裝(推薦)
📦 歷史版本下載

原文外掛簡介

Basic Instructions
This plugin works out-of-the-box, so once the plugin is installed, you can place a shortcode wherever you want.
Use the shortcode [pcf_ny_countdown] to output the countdown.
The countdown will output in days by default (e.g ‘105 days until New Year!’).
Changing output type
The shortcode can be given a ‘type’ attribute, like so:
[pcf_ny_countdown type="days|weeks|sleeps"]

This enables you to change the output type.
There are 3 types to choose from:

Days
Weeks
Sleeps

If you do not specify the type attribute, or specify an invalid type, it will default to ‘days’.
Example:
[pcf_ny_countdown type="weeks"]

will output as
It's `x` weeks and `y` days until New Year!

Styling the output
Styling the output is an advanced setting, that involves writing custom CSS.
The shortcode can be given an ‘id’ attribute, which can then be used to style the output using CSS.
For example,
[pcf_ny_countdown id="my-id"]

would output in HTML as

...

You can then add custom CSS through Appearance > Editor. If your theme supports custom CSS, you may be able to add your styles in Theme Options. If there is a custom css file in Editor, it is advised to use that for custom styles.
Here is an example of some custom styles:
#my-id{
color: red;
font-size: 16px;
text-decoration: underline;
}

This will set the output to be red, underlined, and to have a font size of 16px.

延伸相關外掛

文章
Filter
Mastodon