前言介紹
- 這款 WordPress 外掛「CP Blocks」是 2017-08-29 上架。
- 目前有 1000 個安裝啟用數。
- 上一次更新是 2025-04-02，距離現在已有 31 天。
- 外掛最低要求 WordPress 3.0.5 以上版本才可以安裝。
- 有 12 人給過評分。
- 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。
外掛協作開發者
外掛標籤
css | blocks | button | design | script |
內容簡介
CP Blocks 主要功能：
讓使用者在其網站中使用多個程式碼區塊
整合 Calculated Fields Form 外掛程式
整合 Contact Form 7 外掛程式
允許將區塊插入到網站的文章和頁面中
不斷開發更新，包括許多新區塊
… 以及更多功能
CP Blocks 是一種簡單的方式，可將很棒的按鈕、樣式、腳本、付款/捐款按鈕和功能插入到您的 WordPress 網站中，而無需具備程式編寫知識。使用 CP Blocks，您可以訪問許多資源，如設計元素、表單欄位、新功能等等。
使用 CP Blocks 非常簡單，只需在「Contact Form 7」或「Calculated Fields Form」外掛程式的控制面板中按下「插入區塊」按鈕即可（螢幕截圖：2. Contact Form 7 整合和 3. Calculated Fields Form 整合），此外，在頁面/文章內容中的「新增媒體」按鈕旁也可以找到「插入區塊」按鈕（螢幕截圖：4. 與頁面和文章整合）。
一些免費的區塊包括：
文本長度：計算文本中的字元數
列印表單：用於列印表單
Lorem Ipsum 產生器：產生 Lorem ipsum 文本
PayPal 捐款按鈕：插入 PayPal 捐款按鈕
禁用文字選擇突顯：禁用頁面上的文字選擇突顯
禁用頁面上的鼠標右鍵菜單：禁用鼠標右鍵菜單
顯示當前日期：在頁面上顯示當前日期
自動刷新頁面：每隔指定秒數自動刷新頁面
工具提示：允許將工具提示關聯到表單元素
增長效果：設計效果
圓角按鈕：按鈕設計
動畫邊框按鈕：按鈕設計
角標按鈕：按鈕設計
邊框效果按鈕：按鈕設計
動畫邊框按鈕 2：按鈕設計
帶折疊效果的按鈕：按鈕設計
角標按鈕 2：按鈕設計
角標按鈕 3：按鈕設計
動畫邊框按鈕 3：按鈕設計
下拉填充按鈕：按鈕設計
向上滑動填充按鈕：按鈕設計
向左滑動填充按鈕：按鈕設計
帶圖標的暗色按鈕：按鈕設計
帶圖標的暗色按鈕 2：按鈕設計
斜面暗色按鈕：按鈕設計
帷幕效果按鈕：按鈕設計
帶縮放圖標的按鈕：按鈕設計
帶覆蓋的推薦信息：資訊框設計
帶圖標、引文和標題的推薦卡片：資訊框設計
帶圖像、標題和引文的推薦卡片：資訊框設計
具有個人檔案圖像的推薦信息卡：資訊框設計
帶圖像、標題和引文的推薦卡片：資訊框設計
引文推薦
原文外掛簡介
CP Blocks main features:
Multiple blocks of code in the users’ websites
Integration with the Calculated Fields Form plugin
Integration with the Contact Form 7 plugin
Allows the insertion of blocks in the website’s posts and pages
Constant development including many new blocks
… and more features
CP Blocks is an easy way to insert cool buttons, styles, scripts, payment / donation buttons and features into your WordPress website without requiring programming knowledge. With CP Blocks you can access many resources like design elements, form’s fields, new features, and more.
The use of CP Blocks is very simple, just press the “Insert Block” button in the controls of the “Contact Form 7” or the “Calculated Fields Form” plugin (Screenshots: 2. Contact Form 7 integration and 3. Calculated Fields Form integration), the “Insert Block” button is available beside the “Add Media” button too over the content of the pages/posts (Screenshot: 4. Integration with pages and posts)
Some of the free blocks included are:
Text Length: To calculate the number of characters in a text
Print Form: For printing a form
Lorem Ipsum Generator: Lorem ipsum text generator
PayPal Donation Button: For inserting PayPal donation buttons
Disable Text Selection Hightlighting: Disable the text selection hightlighting on the page
Disable Right-click on the Page: Disable the mouse right-click menu
Display current date: display the current date on the page
Autorefresh page: Autorefresh the page every a specified number of seconds
Tooltips: Allows associating tooltips to the form’s elements
Grow Effect: Design effect
Rounded Button: Button design
Animated Border Button: Button design
Corner Tab Button: Button design
Border Effect Button: Button design
Animated Border Button 2: Button design
Button With Fold Effect: Button design
Corner Tab Button 2: Button design
Corner Tab Button 3: Button design
Animated Border Button 3: Button design
Slide Down Fill Button: Button design
Slide Up Fill Button: Button design
Slide Left Fill Button: Button design
Dark Button With Icon: Button design
Dark Button With Icon 2: Button design
Beveled Dark Button: Button design
Curtain Effect Button: Button design
Button With Scaled Icon: Button design
Image With Overlaying Testimonial: Information box design
Testimonial Card with Icon, Quote and Title: Information box design
Testimonial Card with Image, Title and Quote: Information box design
Testimonial with Profile Image: Information box design
Testimonial Card with Image, Title and Quote: Information box design
Testimonial with Quote and Profile Image: Information box design
Dark Themed Testimonial with Tile Quote and Profile Image: Information box design
Some of the additional commercial blocks are:
Words Counter: To calculate the number of words in a text
Read CSV File: For reading an online CSV file and use it into form
PayPal Payment Button: Inserts a PayPal one time payment button
PayPal Subscription Button: Inserts a PayPal recurrent payment button
Skrill Payment Button: Inserts a Skrill one time payment button
Address Field: Inserts an autocomplete address field integrated to Google Places
Prevent framing: Inserts a block to find out if the page is embedded as a frame to other site and will prevent that by redirecting to the correct page without framing
Detect HTTP or HTTPS then force HTTPS: Inserts a code block to detect HTTP or HTTPS and then force usage of HTTPS to be sure that the page is loaded over a SSL secure connection.
Ad Blocker Alert: Displays a pop-up window if there is an Ad Blocker active in the browser and limits the access to the page’s content in that case.
How to insert the blocks?
Press the “Insert Blocks” button in the toolbar of the forms builder in the “Calculated Fields Form” (Screenshot: 3. Calculated Fields Form integration), or the toolbar of the “Contact Form 7” (Screenshot: 2. Contact Form 7 integration). The button is available too beside the “Add Media” button in the posts and pages (Screenshot: 4. Integration with pages and posts)
CP Blocks opens a popup window (Screenshot: 5. Blocks popup), that includes at top-right the list of blocks categories, and below it, the list of blocks. Selecting a specific category the blocks list is refreshed with their blocks.
After selecting a block, its description, assets and insertion options are displayed in the right column (Screenshot: 6. Inserting the block)
Pressing the “Insert Block” button the piece of code corresponding to the block is inserted in the website (Screenshot: 7. Block in the CFF form)
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「CP Blocks」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
1.1.0 | 1.1.1 | trunk | 1.0.17 | 1.0.18 | 1.0.19 | 1.0.20 | 1.0.21 | 1.0.22 | 1.0.23 |
延伸相關外掛（你可能也想知道）
WPCode – Insert Headers and Footers + Custom Code Snippets – WordPress Code Manager 》插入標頭和頁腳 + 完整的 WordPress 代碼片段外掛, WPCode (前稱为 WPBeginner 的 "插入標頭和頁腳"）是使用率超过 100 万个网站的 WordPress 代码片段外掛中...。
Code Snippets 》Code Snippets 是在您的網站上運行程式碼片段的簡單，清潔和簡單的方法。它消除了將自定義片段添加到您的佈景主題的 functions.php 檔案的需求。, 現在提供 C...。
Widget CSS Classes 》Widget CSS Classes 可以讓您給 WordPress Widget 添加自定義的 class 和 id, 請注意，此外掛並不支援輸入自定義的 CSS。您需要修改主題的 style.css，或加入...。
Simple Custom CSS Plugin 》無需麻煩地將自訂 CSS 新增到 WordPress 網站中。, 這是一個易於使用的 WordPress 外掛，可以添加自訂 CSS 樣式以覆寫外掛和佈景主題的預設樣式。該外掛旨在...。
Simple CSS 》需要在你的網站中添加自定義 CSS 嗎？Simple CSS 提供一個很棒的管理編輯器和 Customizer 中的即時預覽編輯器，讓你能夠輕鬆添加 CSS。, 想讓你的 CSS 僅應用...。
WP Add Custom CSS 》WP Add Custom CSS 外掛允許您在整個網站及個別文章、頁面和自訂文章類型（例如 Woocommerce 產品）中添加自訂的 CSS。, 對整個網站應用的 CSS 樣式將覆蓋您...。
Visual CSS Style Editor 》Style your WordPress site visually. Discover the most popular front-end design plugin! Try live demo., , Visual CSS Editor, The plugin allows you t...。
WP-SCSS 》此外掛使用 ScssPhp，在 WordPress 安裝中編譯 .scss 檔案。包含設定頁面，可配置目錄、錯誤報告、編譯選項和自動佇列。, 此外掛僅在更改 .scss 檔案時進行編...。
Clear Cache for Me 》Clear Cache For Me 是一個 WordPress 外掛，適用於 W3 Total Cache 和 WP Super Cache，因為它們不知道 widget 何時更新，且在更新 widget 和 menu 時都不會...。
Scripts n Styles 》這個外掛讓管理員用戶能夠將自訂的 CSS 和 JavaScript 直接添加到個別文章、頁面或任何註冊的自訂文章類型中，也可以將類別添加到 body 標籤和文章容器中。還...。
Forget About Shortcode Buttons 》相容於 WordPress 傳統編輯器，Gutenberg 整合即將推出🙂, 歡迎提出功能需求/建議！, 即忘短碼(FASC)按鈕是在所見即所得編輯器中及網站佈景主題中加入 CSS 按...。
Code Embed 》注意： WordPress 5.0 及以上版本的使用者請查看常見問題以了解如何在區塊編輯器中使用此外掛。, Code Embed 外掛允許您在文章中嵌入程式碼（JavaScript 和 H...。
Raw HTML 》is capability is only granted to administrators. If you’re not an admin, you will need to ask them to add it to your role., Raw HTML is not r...。
Microthemer Lite – Visual Editor to Customize CSS 》Microthemer是一個輕量級且功能強大的視覺編輯器，可以自訂網站的CSS樣式，從Google字體到響應式佈局，它適用於程式開發人員和非程式開發人員，並與Elementor...。
Core Framework 》總結：Core Framework是一個簡單易用、樂趣滿滿的WordPress外掛，如同你的CSS瑞士軍刀，幫助你輕鬆打造完美網站。, , 問題與答案：, - Core Framework是什麼...。