Highlighted

Custom HTML tags autocompletion

Community Beginner ,
Jun 18, 2018

Copy link to clipboard

Copied

Hi, currently I'm working with OnsenUI CSS library which have a bunch of custom HTML tags.

The problem is, I can't make Dreamweaver to autoclose any of OnsenUI custom tags i.e <ons-row>

And I need to type it manually <ons-row>content</ons-row> to proper close it. This is time consuming.

Any ideas how to instruct Dreamweaver to automatically close customs tags after I type "</"??

Disclaimer : any other HTML/HTML5 tags is properly autoclose, only custom tags is not working

Thanks


					
				
			
			
				
			
			
			
			
			
			
			
		
Adobe Community Professional
Correct answer by Jon Fritz II | Adobe Community Professional

Another option in CC 2015, once you write the custom opening tag, the closing tag list from the code hits will include it.

For example, if you type:

<sometag></s

...you will be presented with a list of all tags starting with "s" including "sometag". You can then arrow down and hit Enter to fill it in.

Once the tag is in the page, it will continue to appear in the code hint list for both starting and closing tags.

TOPICS
Learn Dreamweaver

Views

689

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

Custom HTML tags autocompletion

Community Beginner ,
Jun 18, 2018

Copy link to clipboard

Copied

Hi, currently I'm working with OnsenUI CSS library which have a bunch of custom HTML tags.

The problem is, I can't make Dreamweaver to autoclose any of OnsenUI custom tags i.e <ons-row>

And I need to type it manually <ons-row>content</ons-row> to proper close it. This is time consuming.

Any ideas how to instruct Dreamweaver to automatically close customs tags after I type "</"??

Disclaimer : any other HTML/HTML5 tags is properly autoclose, only custom tags is not working

Thanks


					
				
			
			
				
			
			
			
			
			
			
			
		
Adobe Community Professional
Correct answer by Jon Fritz II | Adobe Community Professional

Another option in CC 2015, once you write the custom opening tag, the closing tag list from the code hits will include it.

For example, if you type:

<sometag></s

...you will be presented with a list of all tags starting with "s" including "sometag". You can then arrow down and hit Enter to fill it in.

Once the tag is in the page, it will continue to appear in the code hint list for both starting and closing tags.

TOPICS
Learn Dreamweaver

Views

690

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
Jun 18, 2018 0
Adobe Community Professional ,
Jun 18, 2018

Copy link to clipboard

Copied

What version of DW are you using?

In newer versions (CC2014 and later), the built in Emmet functionality can write tags for you. You just type the name of the tag in Source View and hit Tab, DW will go from "thatname" to <thatname></thatname> automatically (unless it's a reserved name within Emmet). Don't place any brackets around it, just type the tag name and hit Tab to fire Emmet.

I don't know of a way to make DW recognize "invalid" tag names (from its perspective) the way you'd like them to work. Though it may exist, I've never seen it.

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...
Jun 18, 2018 1
Community Beginner ,
Jun 18, 2018

Copy link to clipboard

Copied

I'm using DW 2015.3.

Thanks for your instructions but thats only work with the "valid" HTML/HTML5/CSS/JS tags only and not custom tags (i.e I type form, press TAB and its automatically complete the whole tags <form></form>)

I also tried "Site > Site spesific code hints" functions but its not work as well.

As I remember, DW CS6 can autoclose custom tags after typing "</" but not DW from CC lines.

Any ideas?

p/s: All assets (css/js) files is properly links and accesable

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...
Jun 18, 2018 0
Adobe Community Professional ,
Jun 18, 2018

Copy link to clipboard

Copied

Sorry, that must have changed after CC2015.

In CC2018, it will turn anything you type into a tagset when you hit Tab.

In CC 2015, you can type in the beginning of the code to go between your tags, highlight it, hit Ctrl + T then type the custom tag you want and hit enter to wrap the code in the custom tag.

If you plan to use the tags all the time though, it might be better to create a bunch of Wrapping Snippets (gone from later versions of the program) of the tags you plan to use and organize them in a folder in the Snippets panel. It would be a bit of a set-up process, but once done, double clicking on the correct Snippet would place the code in your page.

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...
Jun 18, 2018 1
Adobe Community Professional ,
Jun 18, 2018

Copy link to clipboard

Copied

Another option in CC 2015, once you write the custom opening tag, the closing tag list from the code hits will include it.

For example, if you type:

<sometag></s

...you will be presented with a list of all tags starting with "s" including "sometag". You can then arrow down and hit Enter to fill it in.

Once the tag is in the page, it will continue to appear in the code hint list for both starting and closing tags.

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...
Jun 18, 2018 1
Community Beginner ,
Jun 18, 2018

Copy link to clipboard

Copied

The CTRL +T wrap things is new to me. Thanks.

Well, I'm gonna try the new DW CC 2018 and see if it can solve my problems otherwise I need to change my primary IDE to other vendor.

Thanks Jon!

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...
Jun 18, 2018 1
Adobe Community Professional ,
Jun 18, 2018

Copy link to clipboard

Copied

I can't think of any situation where I would want to use custom HTML tags.  But if I type one in code view my version of DW CC (2017) does recognize and close it.  It's also displayed in the DOM panel.

Nancy O'Shea, ACP
Alt-Web Design & Publishing

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...
Jun 18, 2018 1
Adobe Community Professional ,
Jun 18, 2018

Copy link to clipboard

Copied

mike_bee  wrote

The CTRL +T wrap things is new to me. Thanks.

Well, I'm gonna try the new DW CC 2018 and see if it can solve my problems otherwise I need to change my primary IDE to other vendor.

Thanks Jon!

Like the Prodigal Son, they all venture back into the fold.

The following is my experience using Emmet as Jon has suggested.


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...
Jun 18, 2018 0
Community Beginner ,
Jun 18, 2018

Copy link to clipboard

Copied

BenPleysier  wrote

Mike_Bee   wrote

The CTRL +T wrap things is new to me. Thanks.

Well, I'm gonna try the new DW CC 2018 and see if it can solve my problems otherwise I need to change my primary IDE to other vendor.

Thanks Jon!

Like the Prodigal Son, they all venture back into the fold.

The following is my experience using Emmet as Jon has suggested.

Custom Tags in Dreamweaver - YouTube

What DW version are you using?

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...
Jun 18, 2018 0
Adobe Community Professional ,
Jun 19, 2018

Copy link to clipboard

Copied

18.2 - 10165 Build


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...
Jun 19, 2018 1