Title: HRTSoftX – Conditional Elements Author: HRTSoftX Published: 2026 年 10 月 8 日 Last modified: 2026 年 10 月 8 日 --- 搜尋外掛 ![](https://ps.w.org/hrtsoftx-conditional-elements/assets/banner-772x250.png?rev =3733647) ![](https://ps.w.org/hrtsoftx-conditional-elements/assets/icon-256x256.png?rev=3733647) # HRTSoftX – Conditional Elements 由 [HRTSoftX](https://profiles.wordpress.org/hrtsoftx/) 開發 [下載](https://downloads.wordpress.org/plugin/hrtsoftx-conditional-elements.1.0.0.zip) [即時預覽](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/?preview=1) * [詳細資料](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/#description) * [使用者評論](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/#reviews) * [安裝方式](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/#installation) * [開發資訊](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/#developers) [技術支援](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/) ## 外掛說明 Conditional Elements lets you create content with the WordPress block editor, add it to WordPress hooks, and control when it is displayed. Create Gutenberg content, choose where it should appear, and configure conditions to control its visibility. You can include or exclude content based on configured conditions, control visibility by user role or device, and use custom WordPress action hooks when you need more flexibility. Key Features * Gutenberg Content – Create and manage content using the WordPress block editor. * Flexible Placement – Add Gutenberg content before or after supported locations. * Theme-Aware Placement – Automatically provides available placement options based on the active theme. * Block Theme Support – Provides placement options for WordPress block themes. * Custom Hooks – Add content to your own WordPress action hooks. * Include Conditions – Display content when selected conditions are met. * Exclude Conditions – Prevent content from being displayed when selected conditions are met. * User Role Conditions – Control content visibility based on the current user’s role. * Device Visibility – Show or hide content for desktop, tablet, or mobile devices. * Shortcodes – Render Conditional Elements content directly inside posts, pages, templates, widgets, or other shortcode-compatible areas. Placement Conditional Elements provides theme-aware placement options based on the active theme. For supported classic themes, additional theme-specific placement options may be available. For other classic themes, common WordPress hook locations are available, including: * Before Site Wrapper * After Site Wrapper * Before Header * Before Inner Content * After Inner Content * Before Footer * After Footer For WordPress block themes, supported placement locations include: * Before Site Wrapper * After Site Wrapper * Before Header * After Header * Before Title * After Title * Before Content * After Content * Before Inner Content * After Inner Content * Before Footer * After Footer Available placement options depend on the active theme and its supported hooks. You can also use Custom Hook to add content to any WordPress action hook. Conditions Conditional Elements provides several ways to control when content is displayed. Include Display content when the configured conditions match. Exclude Prevent content from being displayed when the configured conditions match. User Role Control content visibility based on the current user’s WordPress role. Device Visibility Control visibility based on the visitor’s device: * Desktop * Tablet * Mobile Shortcode Each Conditional Element has a shortcode that can be copied directly from the Shortcode column in the Conditional Elements list table. Example: [hrtcel_element id=32] Use the shortcode anywhere WordPress supports shortcodes. The shortcode respects the Conditional Element’s configured conditions by default. Bypass Conditions You can optionally bypass the configured conditions by passing bypass_conditions =”true”. Example: [hrtcel_element id=32 bypass_conditions=”true”] This renders the element’s content without applying its configured conditional rules. ### Source Code The JavaScript and CSS files in the `build/` directory are compiled from human-readable source code. The full, uncompiled source is included in this plugin in the `src/` directory. Compiled files and their sources: * `build/hrtcel-admin-list.js` and `build/hrtcel-admin-list.css` are built from` src/admin-list/` * `build/hrtcel-sidebar.js` and `build/hrtcel-sidebar.css` are built from `src/ sidebar/` The source is written in TypeScript/React and SCSS. The build is configured in ` package.json`, `tsconfig.json` and `webpack.config.js`, and uses the `@wordpress/ scripts` toolchain (webpack). Dependency versions are locked in `package-lock.json`. #### Building from source Requirements: Node.js 20.17 or later and npm. 1. Open the plugin directory in a terminal. 2. Run `npm install` to install the build tools. 3. Run `npm run build` to regenerate the files in `build/`. 4. Run `npm run dev` during development to rebuild automatically when files change. #### Third-party libraries The following libraries are bundled into the compiled JavaScript: * react-select (MIT) – https://github.com/JedWatson/react-select * Emotion packages used by react-select (MIT) – https://github.com/emotion-js/emotion * @wordpress/icons (GPL-2.0-or-later) – https://github.com/WordPress/gutenberg/ tree/trunk/packages/icons All other `@wordpress/*` packages are loaded from WordPress core as script dependencies and are not bundled. ## 螢幕擷圖 [⌊Conditional Elements list table with placement, display rules, user roles and shortcode.⌉⌊Conditional Elements list table with placement, display rules, user roles and shortcode.⌉[ Conditional Elements list table with placement, display rules, user roles and shortcode. [⌊Build your content with the familiar Gutenberg block editor.⌉⌊Build your content with the familiar Gutenberg block editor.⌉[ Build your content with the familiar Gutenberg block editor. [⌊Element Settings sidebar: choose placement, set priority and open display rules.⌉⌊ Element Settings sidebar: choose placement, set priority and open display rules.⌉[ Element Settings sidebar: choose placement, set priority and open display rules. [⌊Display Rules modal: include and exclude locations and target user roles.⌉⌊Display Rules modal: include and exclude locations and target user roles.⌉[ Display Rules modal: include and exclude locations and target user roles. [⌊Frontend example: a Black Friday top bar rendered before the header.⌉⌊Frontend example: a Black Friday top bar rendered before the header.⌉[ Frontend example: a Black Friday top bar rendered before the header. ## 安裝方式 1. Install Conditional Elements through the WordPress plugin directory or upload the plugin files to the /wp-content/plugins/hrtsoftx-conditional-elements/ directory. 2. Activate the plugin through the Plugins screen in WordPress. 3. Go to Conditional Elements in the WordPress admin area. 4. Create your content using the WordPress block editor. 5. Select a placement and configure your conditions. 6. Publish your Conditional Element. 7. Copy the shortcode from the Shortcode column when you want to render the element directly. ## 常見問題集 ### Which themes are supported? Conditional Elements supports WordPress block themes and includes integrations for popular classic themes such as Astra, Kadence, GeneratePress, Neve, and OceanWP. For other classic themes, common WordPress hook locations are available where supported by the theme. You can also use Custom Hook to add content to any WordPress action hook. ### Can I use my own WordPress hook? Yes. Use the Custom Hook placement and enter one or more WordPress action hooks separated by commas. ### Does Conditional Elements work with Gutenberg? Yes. Conditional Elements uses the WordPress block editor to create and manage content. ### Can I control content visibility based on conditions? Yes. You can configure include and exclude conditions to control when your content is displayed. ### Can I control content visibility based on user roles? Yes. You can configure user role conditions to control who can see your content. ### Can I control content visibility by device? Yes. Device visibility conditions let you show or hide content for desktop, tablet, or mobile devices. ### Can I use Conditional Elements with a shortcode? Yes. Every Conditional Element has a shortcode available from the Shortcode column in the Conditional Elements list table. For example: [hrtcel_element id=32] ### Can I bypass conditions when using a shortcode? Yes. Add bypass_conditions=”true” to the shortcode. For example: [hrtcel_element id=32 bypass_conditions=”true”] This renders the element without applying its configured conditional rules. ## 使用者評論 ![](https://secure.gravatar.com/avatar/f77ce752952547c586d217f1aa3af8ad5102f9625ed43d0f3e63a8125dcc5022? s=60&d=retro&r=g) ### 󠀁[Best Gutenberg elements plugin](https://wordpress.org/support/topic/best-gutenberg-elements-plugin/)󠁿 [Yash Kapoor](https://profiles.wordpress.org/yashkapoor/) 2026 年 10 月 10 日 I needed a way to add content to specific areas of my WordPress site without modifying theme files, and this plugin looks like a practical solution. Being able to use Gutenberg to create content, choose where it appears, and control visibility based on devices or user roles is really useful. The shortcode support is a nice addition, too, especially when I need to place content in a specific location. [ 閱讀全部 1 則使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/) ## 參與者及開發者 以下人員參與了開源軟體〈HRTSoftX – Conditional Elements〉的開發相關工作。 參與者 * [ HRTSoftX ](https://profiles.wordpress.org/hrtsoftx/) [將〈HRTSoftX – Conditional Elements〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/hrtsoftx-conditional-elements) ### 對開發相關資訊感興趣？ 任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/hrtsoftx-conditional-elements/)、 查看 [SVN 存放庫](https://plugins.svn.wordpress.org/hrtsoftx-conditional-elements/)， 或透過 [RSS](https://plugins.trac.wordpress.org/log/hrtsoftx-conditional-elements/?limit=100&mode=stop_on_copy&format=rss) 訂閱[開發記錄](https://plugins.trac.wordpress.org/log/hrtsoftx-conditional-elements/)。 ## 變更記錄 #### 1.0.0 * Initial release. ## 中繼資料 * 版本 **1.0.0** * 最後更新 **3 週前** * 啟用安裝數 **少於 10 次** * WordPress 版本需求 ** 6.6 或更新版本 ** * 已測試相容的 WordPress 版本 **7.1.3** * PHP 版本需求 ** 7.4 或更新版本 ** * 語言 * [English (US)](https://wordpress.org/plugins/hrtsoftx-conditional-elements/) * 標籤: * [conditional content](https://tw.wordpress.org/plugins/tags/conditional-content/) [content visibility](https://tw.wordpress.org/plugins/tags/content-visibility/) [display conditions](https://tw.wordpress.org/plugins/tags/display-conditions/) [hooks](https://tw.wordpress.org/plugins/tags/hooks/)[user roles](https://tw.wordpress.org/plugins/tags/user-roles/) * [進階檢視](https://tw.wordpress.org/plugins/hrtsoftx-conditional-elements/advanced/) ## 評分 5 星，滿分為 5 星 * [ 1 個 5 星使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/?filter=5) * [ 0 個 4 星使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/?filter=4) * [ 0 個 3 星使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/?filter=3) * [ 0 個 2 星使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/?filter=2) * [ 0 個 1 星使用者評論 ](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/?filter=1) [撰寫評分](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/#new-post) [查看全部使用者評論](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/reviews/) ## 參與者 * [ HRTSoftX ](https://profiles.wordpress.org/hrtsoftx/) ## 技術支援 使用者可在技術支援論壇提出意見反應或使用問題。 [檢視技術支援論壇](https://wordpress.org/support/plugin/hrtsoftx-conditional-elements/)