Title: DragBlock – WordPress Site & Page Builder with Advanced Blocks Author: DragBlock.Com Published: 2023 年 10 月 7 日 Last modified: 2025 年 12 月 26 日 --- 搜索插件 ![](https://ps.w.org/dragblock/assets/banner-772x250.png?rev=2975882) ![](https://ps.w.org/dragblock/assets/icon-256x256.png?rev=2975940) # DragBlock – WordPress Site & Page Builder with Advanced Blocks 作者：[DragBlock.Com](https://profiles.wordpress.org/dragblock/) [下载](https://downloads.wordpress.org/plugin/dragblock.25.12.25.zip) * [详情](https://cn.wordpress.org/plugins/dragblock/#description) * [评价](https://cn.wordpress.org/plugins/dragblock/#reviews) * [开发进展](https://cn.wordpress.org/plugins/dragblock/#developers) [支持](https://wordpress.org/support/plugin/dragblock/) ## 描述 The “DragBlock” plugin enhances the WordPress Full Site Gutenberg Editor to support designing pixel perfect websites easily. ### YOU CAN: **[Add Appearance Styles](https://www.youtube.com/watch?v=c0kgB-mBDTo):** to design perfect websites. You can also select devices for the styles to create responsive designs. **[Add Tag Attributes](https://www.youtube.com/watch?v=KpjyBqkY-MY): ** like title, alt, placeholder… to improve both search engine optimization (SEO) and Core Web Vital Score. **[Build Forms](https://www.youtube.com/watch?v=q90uCWkNRKA): ** such as contact forms or any kind of forms. ContactForm7 and all other heavy form plugins are no longer needed **[Query Database](https://www.youtube.com/watch?v=zqqhUubFawY): ** to load posts and other dynamic contents to your design. **[Define Interactions](https://www.youtube.com/watch?v=UTTi8Smuz3g):** like onClick, onMouseEnter onMouseLeave between blocks. **[Quick Styling](https://www.youtube.com/watch?v=KRILy2KsT60): ** via the block toolbars. **[Pick Google Fonts](https://www.youtube.com/watch?v=bbnUsu-fXU4): ** through the font library. You can also upload your custom font to the library. **Define multilingual texts:** to support many languages without creating separate pages and designs ### CREDITS AND CONTRIBUTION The icon feature is an improvision of [**The Icon Block**](https://wordpress.org/plugins/icon-block/) of **Nick Diego**. Thank you very much, Nick! If you want to contribute to my plugin, check it at [DragBlock GitHub](https://github.com/tiennguyenvan/wp.org.dragblock/) ### DESIGN PHILOSOPHY Our philosophy is “block oriented designing” (BOD) which means attaching everything related to a block to itself. By doing that, we can manage things related to an individual block easily and when removing a block, everything that is plugged into it, including server side scripts, client scripts, css and text definitions, will be completely removed as well. This will give a huge impact on improving the performance of websites and also saving the time for developers to not find and clean codes manually like before. Moreover, we also want to get rid of the era when we treat users like babies by providing them inputs for everything. In the DragBlock, we provide users with dictionaries so they can grasp their layout properties completely without being smashed by a flood of many different kinds of inputs. In summary, DragBlock empowers users to create professional-looking websites like an expert designer effortlessly with a fresh feeling of managing blocks with simplicity. Everything can be done within the Gutenberg editor, ushering in a new era of Full Site Editing with the DragBlock plugin. ## 屏幕截图 [⌊Powerful Block Toolbars Easily pick design layout for wrapper, font-size, rotation and other attributes for blocks⌉⌊Powerful Block Toolbars Easily pick design layout for wrapper, font-size, rotation and other attributes for blocks⌉[ **Powerful Block Toolbars** Easily pick design layout for wrapper, font-size, rotation and other attributes for blocks [⌊Devices and States for Styles Visually select devices and states for individual styles via the DragBlock appearance panel⌉⌊Devices and States for Styles Visually select devices and states for individual styles via the DragBlock appearance panel⌉[ **Devices and States for Styles** Visually select devices and states for individual styles via the DragBlock appearance panel [⌊Interaction Define action and behavior for blocks via the interaction panel⌉⌊Interaction Define action and behavior for blocks via the interaction panel⌉[ **Interaction** Define action and behavior for blocks via the interaction panel [⌊Database Queries Get posts from the database and place them to custom places via the Database panel⌉⌊Database Queries Get posts from the database and place them to custom places via the Database panel⌉[ **Database Queries** Get posts from the database and place them to custom places via the Database panel [⌊Multilingual Text Input texts and attributes for different languages easily without need WPML, Polylang or other language plugin. Saving time by not creating many different pages.⌉⌊Multilingual Text Input texts and attributes for different languages easily without need WPML, Polylang or other language plugin. Saving time by not creating many different pages.⌉[ **Multilingual Text** Input texts and attributes for different languages easily without need WPML, Polylang or other language plugin. Saving time by not creating many different pages. [⌊Custom Create custom forms with beautiful layout and assign form action to process submitted data automatically. No need Contact-Form 7 or any other form plugins.⌉⌊ Custom Create custom forms with beautiful layout and assign form action to process submitted data automatically. No need Contact-Form 7 or any other form plugins.⌉[ **Custom** Create custom forms with beautiful layout and assign form action to process submitted data automatically. No need Contact-Form 7 or any other form plugins. ## 区块 该插件提供了 22 个区块. * Input Insert a flexible input field * Slider Insert a slider or carousel * Pattern Insert a pattern from library * Wrapper Insert a wrapper/container * Iframe Insert a flexible iframe * Icon Insert an SVG icon or graphic. * Form Insert a form processor * Text Insert a flexible and translatable text * Image Insert a flexible image * Textarea Insert a textarea field * Select Insert a select field * Link Insert a flexible link/button * Visual Compare Interactive before–after image comparison slider with a draggable handle. Perfect for showcasing transformations, product differences, and side- by-side visual analysis. * ___ * _______ * DragBlock Applications for Admin (Dashboard Elements) * _______________ * ___ * DragBlock Applications for Managing Fonts * Slide Insert a slide into a slider * VisualCompare Item Add an item (before/after layer) for the visual comparison slider. Enables interactive image comparison within a single slider track for transformations and product differences. * Option Insert an option for a select field ## 评价 ![](https://secure.gravatar.com/avatar/954ae9f8302ac3536a2c39ee3664371c06eee8ecdf915c9c12d2dd40e7f26570? s=60&d=retro&r=g) ### 󠀁[The best plugin for block theme](https://wordpress.org/support/topic/the-best-plugin-for-block-theme/)󠁿 [hungvu1412](https://profiles.wordpress.org/hungvu1412/) 2023 年 11 月 13 日 I’m diving into creating my first block theme, and guess what? This plugin is seriously the bomb for getting started. It’s super flexible, and even for someone like me who’s just starting out, it’s a total breeze to use. If you’re thinking about kicking off with a block theme, I’d say give this plugin a shot. Seriously, everything about it is spot-on. Big shoutout to the folks behind it – thanks a bunch for this awesome tool ![](https://secure.gravatar.com/avatar/ad68ad41be353f5411b3c3fff2bc7fe577d08c3e8cf4b7defc03161116e199cd? s=60&d=retro&r=g) ### 󠀁[The best plugin grid system and features for the Gutenberg](https://wordpress.org/support/topic/the-best-plugin-grid-system-and-features-for-the-gutenberg/)󠁿 [ThemeRuby](https://profiles.wordpress.org/themeruby/) 2023 年 10 月 8 日 I’ve been developing WordPress themes for quite some time now, and I recently had the pleasure of utilizing the Grid System and Responsiveness features of this plugin. It has made it incredibly easy to create complex grid layouts and ensure that your content looks stunning on all devices. Additionally, it achieves excellent speed and maintains a smaller DOM size compared to other plugins because it integrates seamlessly with the default Gutenberg editor. Great plugin at all! [ 阅读所有2条评价 ](https://wordpress.org/support/plugin/dragblock/reviews/) ## 贡献者及开发者 「DragBlock – WordPress Site & Page Builder with Advanced Blocks」是开源软件。 以下 人员对此插件做出了贡献。 贡献者 * [ DragBlock.Com ](https://profiles.wordpress.org/dragblock/) * [ Sneeit.Com ](https://profiles.wordpress.org/sneeit/) * [ Tim Codex ](https://profiles.wordpress.org/tien-nguyen/) [帮助将「DragBlock – WordPress Site & Page Builder with Advanced Blocks」翻译成简体中文。](https://translate.wordpress.org/projects/wp-plugins/dragblock) ### 对开发感兴趣吗? 您可以[浏览代码](https://plugins.trac.wordpress.org/browser/dragblock/)，查看[SVN仓库](https://plugins.svn.wordpress.org/dragblock/)， 或通过[RSS](https://plugins.trac.wordpress.org/log/dragblock/?limit=100&mode=stop_on_copy&format=rss) 订阅[开发日志](https://plugins.trac.wordpress.org/log/dragblock/)。 ## 更新日志 #### 25.12.25 * Fixed all racing errors related to clientId conflicts * Support Before/After block * Color picker does not show in some properties #### 25.11.15 * Toolbar popover does not not hide when switching blocks #### 24.08.01 * Remove unused toolbar buttons #### 24.07.31 * Support query posts by post views #### 24.07.28 * Add new Appearance Presets #### 24.06.02 * Replace CSS Variable names to suppot non-unicode databases #### 24.05.27 * DragBlock default form action does not work * Support more options for Ignore Loaded Posts filter #### 24.05.12 * Support background image gradient picker * Support fallback color when removing global colors * Support URL_QUERY renderability/visibility conditions * Support LANGUAGE renderability/visibility conditions #### 24.04.30 * Fixed: cannot modify the grid builder * Support managing pattern sets * Fixed: cannot select default layout values * Fixed: cannot change border for A tag from the toolbar * Fixed: cannot change box-shadow fields #### 24.04.25 * Support new essential appearance styles (text-underline-offset, box-sizing, resize, pointer-event) * Support stripping title appearance preset * Fixed: share links does not work #### 24.04.12 * Support changing plugin front-end display language via the ‘locale’ hook. * Fixed font-style field. #### 24.02.16 * Support custom taxonomy for Get_Post filter for administrator #### 24.02.11 * Support custom taxonomy for Get_Post filter on the Database panel #### 24.01.30 * Fixed non-negative values for x,y of box-shadow and text-shadow property #### 24.01.18 * Support showing author bio for author boxes * Fixed error loading invalid parameters for WooCommerce blocks #### 23.12.24 * Avoid render the empty parse_item query blocks * Fixed: Ignore loaded posts does not work * Fixed: category shortcode not show when there is no parent #### 23.12.18 * Fixed woo shop page does not show properly * Remove SEO meta and graphs to not conflict with this plugin scope * Support uploading site favicon * Improve property popover design * Add more patterns to the pattern library #### 23.12.04 * Fixed background toolbar not update background image * Fixed Pattern library not load if cache timeout #### 23.12.03 * Enhanced block toolbars #### 23.11.10 * Fix Wrapper Grid Designer * Generate Schema Graphs and Meta Tags automatically * Support tag name for the text block #### 23.11.03 * Support auto youtube thumbnail inserter * Support hotkeys to work with Appearance and Attributes properties * Improve show/hide for hover effect * Support Style Presets * Support form template * Support live content for database queries * Redesign panels #### 23.10.24 * Enhance hover effect for selected blocks * Support block toolbar navigator * Add more icons and fonts * Fix wrong locale for text blocks * Fix wrong default database query params #### 23.10.22 * Support: Appender for empty wrapper blocks * Fixed: cannot add styles for paragraphs in post editor * Fixed: remove empty post images #### 23.10.19 * Minimized right side panels and highlight block that has database queries * Show real post content in the Editor * Add Thread and X-Twitter icon to the icon library * Change position of panels for better exploration * Fix wrong session states * Wrapper toolbars not show in single post * Support link control suggestion type * Fix scrolling bugs * Improve performance #### 23.10.13 * Improve editor performance * Add more appearance styles * Support scrolling and current link classes #### 23.10.07 * Initial Release #### 23.09.28 * Fixed: remove direct script enqueue * Fixed: remove relative path defines * New: provide public source code github links * Fixed: update Tested Upto Version * Fixed: sanitize variables to echo #### 23.09.11 * Switched to the CalVer * Fixed all code issues related to WordPress Coding Standards * Reorganized files as a Microservices Architecture * Simplified our variable names to reduce the naming time * Mapped code commenting to avoid updating the plugin solely for comment changes. #### 23.08.08 * Fixed: replaced move_uploaded_file with wp_handle_upload * Fixed: added nonce verification for all data processes in the font library * Fixed: cleaned up font credits to minify the initial release * Fixed: removed unnecessary system option updates #### 23.07.19 * Fixed: incorrect stable tag * Fixed: prevent accessing files directly * Fixed: sanitized, escaped, and validated all i/o data * Fixed: verify nonce before processing form data ## 额外信息 * 版本 **25.12.25** * 最后更新：**6 月前** * 活跃安装数量 **60+** * WordPress 版本 ** 5.9 或更高版本 ** * 已测试的最高版本为 **6.9.0** * PHP 版本 ** 7.0 或更高版本 ** * 语言 * [English (US)](https://wordpress.org/plugins/dragblock/) * 标签 * [drag-and-drop](https://cn.wordpress.org/plugins/tags/drag-and-drop/)[gutenberg](https://cn.wordpress.org/plugins/tags/gutenberg/) [gutenberg blocks](https://cn.wordpress.org/plugins/tags/gutenberg-blocks/)[site-builder](https://cn.wordpress.org/plugins/tags/site-builder/) [visual editor](https://cn.wordpress.org/plugins/tags/visual-editor/) * [高级视图](https://cn.wordpress.org/plugins/dragblock/advanced/) ## 评级 5 星（最高 5 星）。 * [ 2 条 5 星评价 ](https://wordpress.org/support/plugin/dragblock/reviews/?filter=5) * [ 0 条 4 星评价 ](https://wordpress.org/support/plugin/dragblock/reviews/?filter=4) * [ 0 条 3 星评价 ](https://wordpress.org/support/plugin/dragblock/reviews/?filter=3) * [ 0 条 2 星评价 ](https://wordpress.org/support/plugin/dragblock/reviews/?filter=2) * [ 0 条 1 星评价 ](https://wordpress.org/support/plugin/dragblock/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/dragblock/reviews/#new-post) [查看全部评论](https://wordpress.org/support/plugin/dragblock/reviews/) ## 贡献者 * [ DragBlock.Com ](https://profiles.wordpress.org/dragblock/) * [ Sneeit.Com ](https://profiles.wordpress.org/sneeit/) * [ Tim Codex ](https://profiles.wordpress.org/tien-nguyen/) ## 支持 有话要说吗？是否需要帮助？ [查看支持论坛](https://wordpress.org/support/plugin/dragblock/) ## 捐助 您愿意支持这个插件的发展吗? [ 捐助此插件 ](https://www.paypal.me/sneeit)