Title: WP Dev Flag
Author: Poodle Plugins
Published: <strong>2019 年 4 月 10 日</strong>
Last modified: 2026 年 4 月 7 日

---

搜尋外掛

![](https://ps.w.org/wp-dev-flag/assets/banner-772x250.png?rev=3109637)

![](https://ps.w.org/wp-dev-flag/assets/icon-256x256.png?rev=3109638)

# WP Dev Flag

 由 [Poodle Plugins](https://profiles.wordpress.org/poodleplugins/) 開發

[下載](https://downloads.wordpress.org/plugin/wp-dev-flag.2.0.1.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/wp-dev-flag/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/wp-dev-flag/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/wp-dev-flag/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/wp-dev-flag/#developers)

 [技術支援](https://wordpress.org/support/plugin/wp-dev-flag/)

## 外掛說明

This plugin makes it easy to distinguish between your local development site, and
your live site.
 I created this because I often use a local duplicate of my live
site, for development, with the same DB, and the same URL.

I needed a quick & easy way of distinguishing between my live and development sites
at a glance. This plugin acheives that in the simplest way possible.

There are settings for colour, positioning and the text displayed on the badge. 
It is also possible to add a link onto the badge.

## 螢幕擷圖

[⌊This is what the default badge looks like.⌉⌊This is what the default badge looks
like.⌉[

This is what the default badge looks like.

[⌊This is the Trigger Options tab.⌉⌊This is the Trigger Options tab.⌉[

This is the Trigger Options tab.

[⌊This is the Display Options tab.⌉⌊This is the Display Options tab.⌉[

This is the Display Options tab.

[⌊This is the Link Options tab.⌉⌊This is the Link Options tab.⌉[

This is the Link Options tab.

## 安裝方式

#### From your WordPress dashboard

 1. Visit ‘Plugins > Add New’
 2. Search for ‘WP Dev Flag’
 3. Activate ‘WP Dev Flag’ from your Plugins page.
 4. Visit ‘WP Dev Flag Options’ in the ‘Plugins’ submenu to access the settings.

#### From WordPress.org

 1. Download ‘WP Dev Flag’.
 2. Upload the ‘wp-dev-flag’ directory to your ‘/wp-content/plugins/’ directory, using
    your favorite method (ftp, sftp, scp, etc…)
 3. Activate ‘WP Dev Flag’ from your Plugins page.
 4. Visit ‘WP Dev Flag Options’ in the ‘Plugins’ submenu to access the settings.

## 常見問題集

### Can I create my own CSS for the badge?

Currently, you can customise the colour, text and position of the badge. The ability
to add a custom class is coming in the next release.

Feel free to just style `.wp-dev-flag` yourself though.

I will also explore additonal options such as custom fonts & href functionality.

### Will the badge display on my live site if I duplicate the entire database as is?

No, it detects the current server environment and if it doesn’t match the environment
that was set originally, the plugin will not display the badge. You can simply click
update to set the new environment if required.

### Can I add a link to the badge?

Yes, as of Version 1.3.0 you can add your own link and toggle it to open in a new
tab.

## 使用者評論

![](https://secure.gravatar.com/avatar/1b888fe0beb731ea02c214d6f65233dca1cbfdb81ee30095ad7e8f56c9a0d0bb?
s=60&d=retro&r=g)

### 󠀁[Alternative](https://wordpress.org/support/topic/alternative-17/)󠁿

 [evangun](https://profiles.wordpress.org/evangun/) 2020 年 11 月 21 日

I downloaded the plugin but did not install it when I saw the number of files. It
might be great, I won’t say anything on it, I just wanted to share a few lines of
code that did the job for me instead: if (defined('WP_DEBUG') and true === WP_DEBUG){//
add a green dot at the bottom left of the screen // when WP_DEBUG in wp-config is
true function devTag () { echo '<div style="background:green;border-radius:10px;
bottom:20px;height:10px;left:20px;position:fixed;width:10px;z-index: 9999;"></div
>'; } add_action('wp_body_open', 'devTag'); }

![](https://secure.gravatar.com/avatar/5e134fbc5ab8cbf624f44df367604e79b94bfc7551f4f45ca117836ccfe5dff8?
s=60&d=retro&r=g)

### 󠀁[Useful plugin](https://wordpress.org/support/topic/useful-plugin-528/)󠁿

 [kaybeast](https://profiles.wordpress.org/kaybeast/) 2019 年 5 月 6 日

Just what I was looking for. Adding this to my favorites.

![](https://secure.gravatar.com/avatar/63a18ff43351bbf88f362bc45d577c28ce1342dd2f8c55c934edd6233ec9daa0?
s=60&d=retro&r=g)

### 󠀁[Handy plugin](https://wordpress.org/support/topic/handy-plugin-83/)󠁿

 [sgtberbatov](https://profiles.wordpress.org/sgtberbatov/) 2019 年 4 月 12 日

Installed this on my website when I was developing it, and it’s been a very handy
yet simple tool for me. It’s now part of my toolkit for when I am developing WordPress
websites.

 [ 閱讀全部 3 則使用者評論 ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/)

## 參與者及開發者

以下人員參與了開源軟體〈WP Dev Flag〉的開發相關工作。

參與者

 *   [ Poodle Plugins ](https://profiles.wordpress.org/poodleplugins/)

[將〈WP Dev Flag〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/wp-dev-flag)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/wp-dev-flag/)、
查看 [SVN 存放庫](https://plugins.svn.wordpress.org/wp-dev-flag/)，或透過 [RSS](https://plugins.trac.wordpress.org/log/wp-dev-flag/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/wp-dev-flag/)。

## 變更記錄

#### v2.0.1

 * Bug fixes & customiser error fix.

#### v2.0.0

 * Full codebase rewrite. Remove code fluff, restructure code.

#### v1.3.1 – 23 May 21

 * Bug fix: Add default option values to fix possible PHP notices.

#### v1.3.0 – 02 Jan 21

 * Enhancement: Added a link options settings tab. This allows you to add a link
   and toggle it to open in a new tab.

#### v1.2.0 – 25 Jun 19

 * Enhancement: Added a setting to toggle the badge on the front end. You now have
   control over the display of the badge on both front end and dashboard, independently.

#### v1.1.0 – 02 Jun 19

 * Enhancement: Added the ability to show a badge in the admin dashboard. This will
   appear in the admin bar, to avoid obscuring any menu options.

#### v1.0.0

 * First Version.

## 中繼資料

 *  版本 **2.0.1**
 *  最後更新 **3 個月前**
 *  啟用安裝數 **10+**
 *  WordPress 版本需求 ** 3.0.1 或更新版本 **
 *  已測試相容的 WordPress 版本 **6.9.4**
 *  PHP 版本需求 ** 5.6 或更新版本 **
 *  語言
 * [English (US)](https://wordpress.org/plugins/wp-dev-flag/)
 * 標籤:
 * [banner](https://tw.wordpress.org/plugins/tags/banner/)[development](https://tw.wordpress.org/plugins/tags/development/)
   [flag](https://tw.wordpress.org/plugins/tags/flag/)[localhost](https://tw.wordpress.org/plugins/tags/localhost/)
   [production](https://tw.wordpress.org/plugins/tags/production/)
 *  [進階檢視](https://tw.wordpress.org/plugins/wp-dev-flag/advanced/)

## 評分

 5 星，滿分為 5 星

 *  [  3 個 5 星使用者評論     ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/?filter=5)
 *  [  0 個 4 星使用者評論     ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/?filter=4)
 *  [  0 個 3 星使用者評論     ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/?filter=3)
 *  [  0 個 2 星使用者評論     ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/?filter=2)
 *  [  0 個 1 星使用者評論     ](https://wordpress.org/support/plugin/wp-dev-flag/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/wp-dev-flag/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/wp-dev-flag/reviews/)

## 參與者

 *   [ Poodle Plugins ](https://profiles.wordpress.org/poodleplugins/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/wp-dev-flag/)