Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

Applying multiple classes with Dreamweaver CC 2017

Explorer ,
Jun 14, 2017 Jun 14, 2017

Version: Dreamweaver CC 2017.5

OS: Windows 10

In earlier versions of Dreamweaver (e.g. Dreamweaver CS6) I had the ability to do a keyboard shortcut for applying multiple CSS classes to selected text and used that shortcut dozens of times every day. With Dreamweaver CC it appears Adobe removed the ability to apply multiple classes with no real explanation to why.

With new versions of Dreamweaver what is the easiest method of applying multiple classes to a tag?

For example, if I wanted to apply two classes to a paragraph tag the easiest method I can come up with is to add a class attribute to the paragraph tag with the two classes I want to apply to that tag.

In CS6 I could press Ctrl+Alt+C (my custom keyboard shortcut), type in the two classes I wanted and press Enter.

2.4K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Jun 14, 2017 Jun 14, 2017

They actually removed the Add Multiple Classes option a few versions ago without explanation.

The fastest way to add classes is manually to the source code using code hints.

1. Click inside the tag you want to add your class to

2. Type in class=" you'll be presented with all available classes in the code hint pop up

3. Arrow down through the options and hit Enter/Return to add a class

4. Hit the back arrow (to get back inside the class attribute's quotes) then a space and the list pops up again

Once y

...
Translate
Community Expert ,
Jun 14, 2017 Jun 14, 2017

They actually removed the Add Multiple Classes option a few versions ago without explanation.

The fastest way to add classes is manually to the source code using code hints.

1. Click inside the tag you want to add your class to

2. Type in class=" you'll be presented with all available classes in the code hint pop up

3. Arrow down through the options and hit Enter/Return to add a class

4. Hit the back arrow (to get back inside the class attribute's quotes) then a space and the list pops up again

Once you're used to the manual work-around, it's pretty quick, probably not as fast as a nice keyboard shortcut though.

Make sure to submit a feature request through DW under Help > Submit Bug/Feature Request and/or join in on the already existing requests.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017

https://forums.adobe.com/people/Jon+Fritz+II  wrote

They actually removed the Add Multiple Classes option a few versions ago without explanation.

The fastest way to add classes is manually to the source code using code hints.

1. Click inside the tag you want to add your class to

2. Type in class=" you'll be presented with all available classes in the code hint pop up

3. Arrow down through the options and hit Enter/Return to add a class

4. Hit the back arrow (to get back inside the class attribute's quotes) then a space and the list pops up again

Once you're used to the manual work-around, it's pretty quick, probably not as fast as a nice keyboard shortcut though.

Make sure to submit a feature request through DW under Help > Submit Bug/Feature Request and/or join in on the already existing requests.

Could you not make a code snippet class="" then allocate the keyboard letter 'c' for the abbreviation key/tab. I dont know if DW has a way of automatically inserting the cursor within the quotes. Still means you would have to start typing in the class name/s (they would most likely pop up in a menu to choose from) but you wouldn't have to keep typing in class="" but you would have to do this in code view which for some is not an option.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 14, 2017 Jun 14, 2017

Just sticking with Code Hinting is better, all you need to do is type in c+Enter to get class="|"

You can use a Snippet Keyword of "c", but if you use Emmet that's the default for an html comment.

One of the main reasons I hate the new "keyword system" for Snippets. A lot of simple "keywords" are already used in Emmet and if you use them for a snippet, you lose them from Emmet.Keywords are the reason wrapping snippets were removed. Since you had to highlight the code you wanted to wrap, typing in a keyword would just replace the code.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017

https://forums.adobe.com/people/Jon+Fritz+II  wrote

You can use a Snippet Keyword of "c", but if you use Emmet that's the default for an html comment.

Interesting, its not in the bit of software I use.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 14, 2017 Jun 14, 2017

According to the Emmet Cheat Sheet, it should be...

https://docs.emmet.io/cheat-sheet/

...and is in DW.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017

https://forums.adobe.com/people/Jon+Fritz+II  wrote

According to the Emmet Cheat Sheet, it should be...

https://docs.emmet.io/cheat-sheet/

...and is in DW.

I could have disabled it by using 'c'. Since I dont use Emmet much I guess that doesnt matter much.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017

https://forums.adobe.com/people/Jon+Fritz+II  wrote

Keywords are the reason wrapping snippets were removed.

Really, DW doesnt have the option to produce wrapping snippets? I use them pretty much all the time for wrapping sections of code such as css in media queries etc.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 14, 2017 Jun 14, 2017

Adobe (in my opinion, extremely short-sightedly) removed them in CC2017.0 when they added the keyword shortcut function to the Snippets window.

People can still use old ones if they transfer them over from the older versions, however the ability to create them has been removed (more likely hidden) from the UI.

A bad, albeit functional, work-around is to create one in CC2015 and transfer it to 2017 so it can be used there.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017

https://forums.adobe.com/people/Jon+Fritz+II  wrote

Adobe (in my opinion, extremely short-sightedly) removed them in CC2017.0 when they added the keyword shortcut function to the Snippets window.

Maybe they will come to their senses, eventually. It's not a game changer but its nice to have as an option and would be annoying if someone comes from using another bit of software and find they are not available.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jun 14, 2017 Jun 14, 2017

They used to have wrapping; it's been gone for quite a few versions now.

By the way, missing the multiply class hint options forced me to find alternative methods too. I sometimes do a "pre-flight" visual check using the DOM panel to add/adjust multiple classes (double click in the element line to add):

2017-06-14_DOM-demo.gif

or in the Live View:

2017-06-14_LIVE-view-demo.gif

As the others have stated, definitely request to have it added back in the Code View in the Feature Requests mentioned by Mrhope​

Hope this helps!
Make sure to press "✔ Correct Answer" on this post if this answers your question. Happy Creating!
Anissa • @anissat
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Mentor ,
Jun 14, 2017 Jun 14, 2017

In case anyone did not know, everything Adobe has taken out of Dreamweaver is actually still in there. It's just hidden. So if anyone from Adobe leads you to believe it is hard to add stuff back in, do not believe them. We found this out as we developed our DW Tools extension, which adds back Server-Side Includes and Design Time CSS. We also found it out when building our extension manager. I just wish I could figure out what the Dreamweaver team is thinking -- or if they're even thinking at all .

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jun 14, 2017 Jun 14, 2017
LATEST

Don't get me started AL, a number of people want me thrown out of the forums as it is .

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jun 14, 2017 Jun 14, 2017

I have created a feature request although if it hasn't changed for several versions cannot imagine Adobe putting this feature back into Dreamweaver.

apply multiple classes – Adobe Dreamweaver CC: Feature Ideas

I changed the Ctrl+` shortcut (View>Switch Views) to the shortcut key I'm used to (Ctrl+Alt+C) and although it's not as fast as the previous method at least I can keep away from using the mouse which is always my goal.

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