Dreamweaver CC 2017 indent guides and how to

Explorer ,
Oct 05, 2017

Copy link to clipboard

Copied

ok, i have solution finally.

after few hours of research i have solution how to create indent guides in dreamweaver cc 2017 functional. of course indentation works on lines with wrap text now correctly (see images below).

indent_guide_a.pngfirst of all, you must use TAB indentation in your code. my settings are show on picture.

sorry, but space not create specific tag in code editor which is need for styling.

lets go.. open your main.less file and copy this code somewhere.

  • if you use modified theme, file location is C:\Users\~name~\AppData\Roaming\Adobe\Dreamweaver CC 2017\en_US\Configuration\Brackets\extensions\user
  • if you use default theme, file can be found C:\Program Files\Adobe\Adobe Dreamweaver CC 2017\www\extensions\default\~UsedTheme~

// indent guide settings

.CodeMirror pre {

overflow: hidden;

}

.cm-tab {

position: relative;

}

.cm-tab:after {

content: '';

position: absolute;

border-left: 1px solid #cccccc; // your color choice

top: 0px;

left: 3px;

width: 0px;

height: 100vh;

}

save and enjoy!

..or you can download my edited themes where indentation is now implemented.

Light themeDark theme
indent_guide_d.pngindent_guide_e.png

Download (.zip)

install instruction here

Download file (.zip)

install instruction here

if you have any questions, ask me cheerfully

thank.

Views

3.9K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Dreamweaver CC 2017 indent guides and how to

Explorer ,
Oct 05, 2017

Copy link to clipboard

Copied

ok, i have solution finally.

after few hours of research i have solution how to create indent guides in dreamweaver cc 2017 functional. of course indentation works on lines with wrap text now correctly (see images below).

indent_guide_a.pngfirst of all, you must use TAB indentation in your code. my settings are show on picture.

sorry, but space not create specific tag in code editor which is need for styling.

lets go.. open your main.less file and copy this code somewhere.

  • if you use modified theme, file location is C:\Users\~name~\AppData\Roaming\Adobe\Dreamweaver CC 2017\en_US\Configuration\Brackets\extensions\user
  • if you use default theme, file can be found C:\Program Files\Adobe\Adobe Dreamweaver CC 2017\www\extensions\default\~UsedTheme~

// indent guide settings

.CodeMirror pre {

overflow: hidden;

}

.cm-tab {

position: relative;

}

.cm-tab:after {

content: '';

position: absolute;

border-left: 1px solid #cccccc; // your color choice

top: 0px;

left: 3px;

width: 0px;

height: 100vh;

}

save and enjoy!

..or you can download my edited themes where indentation is now implemented.

Light themeDark theme
indent_guide_d.pngindent_guide_e.png

Download (.zip)

install instruction here

Download file (.zip)

install instruction here

if you have any questions, ask me cheerfully

thank.

Views

3.9K

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Oct 05, 2017 2
Adobe Community Professional ,
Oct 05, 2017

Copy link to clipboard

Copied

Thank you, very useful.


Ben

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 05, 2017 0
New Here ,
Oct 09, 2017

Copy link to clipboard

Copied

Hello

Thanks so much.

Capture.PNG

Gracias!!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Oct 09, 2017 0
Adobe Community Professional ,
Nov 07, 2017

Copy link to clipboard

Copied

as one can see on this last screen shot... the TABed line are looking nice, but the indent code is not well formated and that doesn't help anyhow on formating it correctly... so it this is only a fake visual rendering ... and not at all structural ... did I missed a step ?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 07, 2017 0
Explorer ,
Nov 07, 2017

Copy link to clipboard

Copied

yes, is only visual help where TAB is stylized as you can see on my code in first post. code mirror in core does not support indent guides then is not possible to make structural indent lines helper. maybe with help by addon, but i can not find any. and nevertheless, dreamweawer not support addons.. in addition, dreamweaver source code which handle this is minified, then ist not possible change whatever..

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 07, 2017 0
Adobe Community Professional ,
Nov 14, 2017

Copy link to clipboard

Copied

too bad... so we must only rely on open close tag, ans tag selection highlight ?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 14, 2017 0
Explorer ,
Nov 16, 2017

Copy link to clipboard

Copied

.. it is so yet

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 16, 2017 0
Explorer ,
Nov 16, 2017

Copy link to clipboard

Copied

i researching something.. look at the screenshot! maybe the dream will be reality!

custom code coloring for specific tags (so it's not problem create same theme like DW2015)! and indent guides now it`s not defined in main.less but as a addon!

dw.jpg

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 16, 2017 1
Adobe Community Professional ,
Dec 02, 2017

Copy link to clipboard

Copied

an they are not only visual, but reallt structural ? what is the addon ?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 02, 2017 0
Netoper LATEST
Explorer ,
Dec 02, 2017

Copy link to clipboard

Copied

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Dec 02, 2017 0