Highlighted

Is there is a keyboard short cut to wrap an element in a <li>?

New Here ,
Jan 07, 2020

Copy link to clipboard

Copied

Anyone know if there is a keyboard short cut to wrap an element in a <li> or how to create one like there is one to wrap a <p> around a line of code.

<p> wrap windows: ctrl + shift + p = <p>some text </p>

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

You could also create a Wrapping Snippet, for really any tag you use frequently, in CC2015 and older or CC2020 and newer...

1. In the Snippets window, click the New Snippet button
2. Give the Snippet a name and description
3. Select Wrap selection for Snippet Type
4. For Insert Before, add <li>
5. For Insert After, add </li>

From there on out, you can highlight text and then doubleclick the Snippet in the Snippets Window to wrap it. In old versions of DW, you can set whatever keyboard shortcut you like to your Snippets. In versions after CC2015, they can only be set with Snippet Keywords which won't work with Wrapping Snippets, because the function overwrites your highlighted text instead.

TOPICS
Code, How to

Views

78

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

Is there is a keyboard short cut to wrap an element in a <li>?

New Here ,
Jan 07, 2020

Copy link to clipboard

Copied

Anyone know if there is a keyboard short cut to wrap an element in a <li> or how to create one like there is one to wrap a <p> around a line of code.

<p> wrap windows: ctrl + shift + p = <p>some text </p>

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

You could also create a Wrapping Snippet, for really any tag you use frequently, in CC2015 and older or CC2020 and newer...

1. In the Snippets window, click the New Snippet button
2. Give the Snippet a name and description
3. Select Wrap selection for Snippet Type
4. For Insert Before, add <li>
5. For Insert After, add </li>

From there on out, you can highlight text and then doubleclick the Snippet in the Snippets Window to wrap it. In old versions of DW, you can set whatever keyboard shortcut you like to your Snippets. In versions after CC2015, they can only be set with Snippet Keywords which won't work with Wrapping Snippets, because the function overwrites your highlighted text instead.

TOPICS
Code, How to

Views

79

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
Jan 07, 2020 0
Adobe Community Professional ,
Jan 07, 2020

Copy link to clipboard

Copied

There's no shortcut available for it, I think the closest you'll get would be...

1. Highlight the code you want wrapped
2. Hit Ctrl + T
3. Type l-i
4. Hit enter twice

or

Highlight the text you want to turn into a list item, then click one of the List button in the HTML section of the Properties window. If the text is adjacent to an already existing <ul> or <ol> it will add the highlighted text as an <li> to that list.

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...
Jan 07, 2020 1
New Here ,
Jan 07, 2020

Copy link to clipboard

Copied

Perfect thank you

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...
Jan 07, 2020 0
Adobe Community Professional ,
Jan 07, 2020

Copy link to clipboard

Copied

You could also create a Wrapping Snippet, for really any tag you use frequently, in CC2015 and older or CC2020 and newer...

1. In the Snippets window, click the New Snippet button
2. Give the Snippet a name and description
3. Select Wrap selection for Snippet Type
4. For Insert Before, add <li>
5. For Insert After, add </li>

From there on out, you can highlight text and then doubleclick the Snippet in the Snippets Window to wrap it. In old versions of DW, you can set whatever keyboard shortcut you like to your Snippets. In versions after CC2015, they can only be set with Snippet Keywords which won't work with Wrapping Snippets, because the function overwrites your highlighted text instead.

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...
Jan 07, 2020 0
New Here ,
Jan 07, 2020

Copy link to clipboard

Copied

Thank you 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...
Jan 07, 2020 0
Adobe Community Professional ,
Jan 07, 2020

Copy link to clipboard

Copied

I use Emmet short codes to create structure. 

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

 

Let's say I need 5 unordered list items.

Type this code followed by TAB key.

ul>li*5

 

Or navigation links.

nav>ul>li>*5>a{$ item}

 

Emmet short code abbreviations can wrap selected items. See the video examples. 

https://docs.emmet.io/actions/wrap-with-abbreviation/

Unfortunately, Emmet abbreviations (Shift+Ctrl+A) don't do anything in DW.  So I switch to Brackets with the Emmet plugin which does support abbreviations.

https://github.com/emmetio/brackets-emmet

 

Nancy O'Shea, ACP
Alt-Web.com

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...
Jan 07, 2020 1