This extension allows you to drag each element of your website around individually to help you get your site just right.

Latest Version

Version

1.1

Update

February 13, 2014

Size

137KiB

Developer

Drag Design Extension

This extension allows you to drag all or individual elements of a website. You can also edit the content of all or individual elements. This extension is great for anyone designing a web page but can't decide what to put where.

It's easy to use and simple to get the hang of.

You can drag elements and all of the items inside it as a group or you can drag every element individually. You can edit text on the whole web page, or just a single paragraph, with ease.

Author - Josh Cronin

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "manifest_version": 2, "name": "Drag Design", "short_name": "Drag Design", "description": "This extension allows you to drag each element of your website around individually to help you get your site just right.", "version": "1.1", "icons": { "16": "img/icon16.png", "48": "img/icon48.png", "128": "img/icon128.png" }, "web_accessible_resources": [ "js/jquery/jquery-ui.min.js", "js/jquery/jquery.min.js", "js/jquery/jquery.min.map", "img/notification_icon.png" ], "content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'", "content_scripts": [ { "matches": ["*://*/*"], "js": ["js/jquery/jquery.min.js", "js/jquery/jquery-ui.min.js", "js/injectscript.js"], "run_at": "document_start" } ], "permissions": [ "notifications", "tabs", "contextMenus" ], "browser_action": { "default_icon": "img/icon.png", "default_title": "Click to enable" }, "background": { "scripts": ["js/background.js"] }}

Download CRX(137KiB)

Similar Extensions

Positionable! Extension · Developer Tools 1,000+ 32 ★ 116KiB

Restyler Extension · Developer Tools 1,000+ 14 ★ 853KiB

Fluid Page Extension · Fun 1,000+ 11 ★ 22.93KiB

DragDropr - Drag & Drop Page Builder Extension · Developer Tools 1,000+ 3 ★ 69.55KiB

Redesign Extension · Developer Tools 1,000+ 2 ★ 121KiB

Live editor for CSS, Less & Sass - Magic CSS Extension · Developer Tools 1,000+ 266 ★ 2.15MiB

Web Design Pirate Extension · Developer Tools 1,000+ 21 ★ 134KiB

Design Mode Extension · Developer Tools 1,000+ 17 ★ 7.97KiB

Code Cola Extension · Developer Tools 1,000+ 188 ★ 189KiB

CSS remove and combine Extension · Developer Tools 1,000+ 115 ★ 270KiB

CSS Shapes Editor Extension · Developer Tools 1,000+ 101 ★ 84.76KiB

Style Adjuster Extension · Developer Tools 1,000+ 1 ★ 265KiB

CSS3 Generator Extension · Developer Tools 1,000+ 60 ★ 346KiB

Live CSS Editor Extension · Developer Tools 1,000+ 182 ★ 24.38KiB

Google Font Previewer for Chrome Extension · Developer Tools 1,000+ 265 ★ 45.88KiB

Design Mode - Page's Rich Text Editor Extension · Developer Tools 1,000+ 10 ★ 62.89KiB

Wordpress Style Editor Extension · Developer Tools 1,000+ 47 ★ 47.72KiB

Web Developer Checklist Extension · Developer Tools 1,000+ 54 ★ 32.65KiB

Bootstrap Twitter Offline Docs Extension · Developer Tools 1,000+ 90 ★ 3.11MiB

performance-HTML Extension · Developer Tools 1,000+ 8 ★ 19.31KiB

Amino: Live CSS Editor Extension · Developer Tools 1,000+ 453 ★ 1.45MiB

EnjoyCSS Extension · Developer Tools 1,000+ 24 ★ 13.37KiB

JScript tricks Extension · Developer Tools 1,000+ 50 ★ 340KiB

Stylebot Extension · Accessibility 1,000+ 1603 ★ 10.27MiB

User reviews

Matthew Walters (ID: 0000004472cae933) Voted 4 ★ - Updated 02/25/2023 Really clever. Only thing I cant' seem to drag buttons.

Steve (ID: 000000b29724af5f) Voted 4 ★ - Updated 06/27/2022 Otiomo, poderia ser melhor adicionando um 'delete element' e as listras de limite CSS

Dave Land (ID: 000000bd003c7919) Voted 1 ★ - Updated 03/25/2022 Doesn't work for me. Maybe there's a magic incantation to make it work, but there's no difference between "doesn't work" and "can't make it work" if it is impossible to intuit how it is supposed to work. Don't waste your time until the developer improves it beyond the point where the developer (and the very proud "Aaron Thoma") can make it do anything.

Aaron Thoma (ID: 0000002b2adf2d4f) Voted 3 ★ - Updated 02/07/2022 All features work, even though it first seemed otherwise, because the handling is counter-intuitive: The context menu ignores the element you right-clicked on; instead, you have to: 1. Click “Drag this element” 2. Select the target element by left-clicking it. (Unfortunately, if it’s a link, that will navigate you off the page.) 3. Afterwards, you can start dragging it around. “Edit this element” adds the html attribute “contenteditable”, so you can WYSIWYG-edit the visible text (not the html code). The extension’s design is pretty basic and has quite a few flaws.

Lukas Rossa (ID: 000000617bf4468a) Voted 1 ★ - Updated 11/09/2020 Doesn't work for me, no documentation available.

Get source code (.Zip)

Drop .crx file here or click
the button to choose the file

Drag Design