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

Wrap multiple lines in individual tags, simultaneously?

Community Beginner ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

My job is currently having me transcribe a lot of works in public domain to web pages, to keep on our media server. This largely has me wrapping several hundred things in <p> and <li> tags each day, and I'm looking to improve my workflow.

I know there must be some function in Dreamweaver like this, but I can't figure it out and Google is failing me and only showing me things from 2006. For example, I want to take this:

Two roads diverged in a yellow wood,

And sorry I could not travel both

And be one traveler, long I stood

And looked down one as far as I could

To where it bent in the undergrowth;

and turn it into this:

<li>Two roads diverged in a yellow wood,</li>

<li>And sorry I could not travel both</li>

<li>And be one traveler, long I stood</li>

<li>And looked down one as far as I could</li>

<li>To where it bent in the undergrowth; </li>

Without me having to highlight every line, one at a time, and type li into the quick tag editor. It's time consuming, especially when I get to 50 chapter novels like the tales of Don Quixote (wrapping paragraph tags around each line took me several days).

HTML Kit Tools does this, shown here, in two clicks:

Creating lists, simple to advanced options - YouTube

Please, please tell me there's a way for Dreamweaver to do what's shown in this video.

Views

2.8K

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
community guidelines

correct answers 1 Correct answer

Community Expert , Oct 25, 2018 Oct 25, 2018

I fully understand what you are looking for..... I'm not sure Dreamweaver (coupled with Emmet) can handle it easily... at least every time I've tried and searched I've never found a way to handle it...

maybe I missed the technique to get there and if someone can give it to us, like you I would be interested....

Anyway, I use Sublime Text for everyday coding and this tool manages this feature very simply and very quickly as you can see on this movie 10.25.2018-17.27.33

Votes

Translate

Translate
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

This will save you some time:

In Design View (not live view),

place your cursor like so:

Two roads diverged in a yellow wood,

Cursor Here And sorry I could not travel both

Use your backspace key to brig it up to the preceding line:

Two roads diverged in a yellow wood,Cursor Here And sorry I could not travel both

Press Enter.

This will create a paragraph.

Repeat for the remaining lines.

If you quickly switch to code view, this is what you should see:

<p>Two roads diverged in a yellow wood,</p>

<p>And sorry I could not travel both</p>

<p>And be one traveler, long I stood</p>

<p>And looked down one as far as I could</p>

<p>To where it bent in the undergrowth; </p>

Select all 5 lines and click the unordered list icon on your property inspector.

The code will now look like this:

<ul>

<li>Two roads diverged in a yellow wood,</li>

<li>And sorry I could not travel both</li>

<li>And be one traveler, long I stood</li>

<li>And looked down one as far as I could</li>

<li>To where it bent in the undergrowth; </li>

<ul>

The operation for me took less than 10 seconds. You'll get quicker as you do it.

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

<joke data-important="no polemics to you Al" data-real="pure question to folks @Adobe"> it took you 10 seconds for 5 lines ?????.... in Sublime.. it takes me 1 or 2 seconds... without any practice, whatever number of line there is... </joke>

but that's true, as you can watch on the previous movie...

so come on folks at Adobe, could you polish the emmet integration as mentionned in so many FR posted on the bug base ????

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I fully understand what you are looking for..... I'm not sure Dreamweaver (coupled with Emmet) can handle it easily... at least every time I've tried and searched I've never found a way to handle it...

maybe I missed the technique to get there and if someone can give it to us, like you I would be interested....

Anyway, I use Sublime Text for everyday coding and this tool manages this feature very simply and very quickly as you can see on this movie 10.25.2018-17.27.33

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

You forgot the UL tags

I was giving the original poster a solution he could actually use in Dreamweaver, as it exists today. Simple, huh?

We could probably write an extension to do that, but there are too many people on this forum who still get their kicks denigrating extensions. But perhaps we'll consider a new toolkit... at least our customers and our community might be grateful.

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

arf! arf!... you're right, I forgot...  so here we are

10.25.2018-18.53.28

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

Are you promoting Sublime or are you trying to help a Dreamweaver user?

In any event, as Jon pointed out, there are workflows that come into play. That said, where on earth is this coming from?

Two roads diverged in a yellow wood,

And sorry I could not travel both

And be one traveler, long I stood

And looked down one as far as I could

To where it bent in the undergrowth;

Depending on the application you are copying from, there are ways to set up a copy/paste. But is the original poster suggesting that a poem should be an unordered list?

So, before a proper solution is given, the original poster needs to provide significantly more of a backstory.

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I completly agree that directing the OP towards an alternative solution (certainly free) is not fair, especially being on a DW forum, being an ACP and being a member of the prerelease/CAB for many years...

but well, without looking for any excuse in my defense, I would say... look in my previous message.... I was addressing folks @Adobe by asking them to integrate these features (present in many FR requests)...in next builds...

so if the OP also send pressure and joins this kind of wishes that will help to make great strides in improving our preferred tool.... 😜

Votes

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
community guidelines
LEGEND ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

A decent paid for editor should be more than capable of this workflow without jumping through hoops, Textmate was capable, without emmet years ago......how times have advanced.

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I'd love to get more of a background on what the original poster is actually trying to do 🙂

Votes

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
community guidelines
Community Beginner ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

@ALsp: Well, I explained in my post. I'm taking stuff from public domain and putting the text into html files on our media server.

So I'm taking the text from places like this:

https://www.poetryfoundation.org/poems/44272/the-road-not-taken

And then putting it into HTML files. And yes, I'm using them as an unordered list because that way I can put line numbers next to the text using some basic javascript and css.

Some of the poems are extremely long epics, and for people to refer to line numbers, I need them in specific lines. That's why I'm not using pre tags or anything else, it just seemed easier to do javascript to make the line numbers for referencing the text. Because some are long epics, doing each line into the 300s and 400s is exhausting. The Sublime Text thing mentioned above seems to do what I'm looking for (I downloaded it and a package called Emmet? That lets me wrap multiple lines in individual tags like I was looking for. Can I do that in Dreamweaver with Emmet?), and I'm going to read through the responses more to see if there's a way to just do that in Dreamweaver since that's software we're already paying for.

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I went to the Robert Frost poem you linked to. I copied it from the actual browser view (because the markup is really bad...as if they copied it incorrectly from somewhere else). I then pasted it into Notepad. I recopied it and pasted it into Dreamweaver design view and this is the code it generated:

<p>The Road Not Taken<br>

  BY ROBERT FROST</p>

<p>Two roads diverged in a yellow wood,<br>

  And sorry I could not travel both<br>

  And be one traveler, long I stood<br>

  And looked down one as far as I could<br>

  To where it bent in the undergrowth;</p>

<p>Then took the other, as just as fair,<br>

  And having perhaps the better claim,<br>

  Because it was grassy and wanted wear;<br>

  Though as for that the passing there<br>

  Had worn them really about the same,</p>

<p>And both that morning equally lay<br>

  In leaves no step had trodden black.<br>

  Oh, I kept the first for another day!<br>

  Yet knowing how way leads on to way,<br>

  I doubted if I should ever come back.</p>

<p>I shall be telling this with a sigh<br>

  Somewhere ages and ages hence:<br>

  Two roads diverged in a wood, and I—<br>

  I took the one less traveled by,<br>

  And that has made all the difference.</p>

And I think that kind of how a poem should be formatted.

So, when you say you are taking text from the public domain, the question remains... exactly what is your workflow? For instance, if the text is properly formatted, you can simply right-click and use developer tools to grab the markup. If it's malformed, like the poem, you simply copy it and paste it into a clean text editor, as a quick intermediate step.

But you can use Emmet, I guess... but that doesn't necessarily help you to correct some of the steps you might be taking to grab your content in the first place.

Votes

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
community guidelines
Community Beginner ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

Hey, that seems to work great for that.  The problem then becomes converting it to a list so my line numbers work, lol, due to all the breaks and how the <p> tags are wrapped around whole stanzas. How would you pull that to be an unordered list, for example?

My workflow is exactly what I told you: I'm given a web page by someone else, copy the text from that page (half of this stuff is in tables, nonetheless), and then paste it into a page's template I already created. There's tons of different sites because they used to link out to these texts, and now they're wanting them on their media server so in the event of those links going dead, we still have access to them. That's really about it. I don't know what more information you want me to give you- would you like me to show the html, css, js, etc.?

A lot of this I'm learning as I go along. I'm a designer, not a developer, but this task was given to me to do the above to some 560 different poems, novels, and other texts. So... any help you can give is greatly appreciated lol.

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

Can I ask why you feel you need to convert the lines of a poem into a list?

That said, if you need to take public content that is in a list, then you would use developer tools to inspect the list and render the markup for that list, which you would then copy. To access developer tools in Firefox or Chrome, press the F12 key or right click an element and choose "Inspect".

I'm not positive, but I think this will be far superior than using Emmit.

Votes

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
community guidelines
Community Beginner ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I've been converting the lines into a list in order to show line numberings using stikhoi. if there's an easier way to do that, I'm all ears lol.

I've also been mandated to maintain consistent formatting across all pages I make, so some require substantially more formatting than others... I don't know if I mentioned this above, but some of these use tables for displaying their information, like this one:

625. Ode on a Grecian Urn. John Keats. The Oxford Book of English Verse


So taking the formatting from there isn't exactly great.

I appreciate the help.

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

In my opinion a poem is not a list, so I would use paragraphs, then CSS to count the lines and separate the stanzas. Like this:

Test Document

Votes

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
community guidelines
Community Beginner ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

Quick question: How would I use this:

.poem p::before {

margin-right: .5em;

counter-increment: section;

/* Increment the value of section counter by 1 */

content: counter(section) ".";/* Display the value of section counter and add trailing periond */

But have the counter show the numbers once every 5 lines (5, 10, 15, etc.)? Also, can I adjust the side on which the numbers appear?

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

vincentm20744199  wrote

Quick question: How would I use this:

.poem p::before {

margin-right: .5em;

counter-increment: section;

/* Increment the value of section counter by 1 */

content: counter(section) ".";/* Display the value of section counter and add trailing periond */

But have the counter show the numbers once every 5 lines (5, 10, 15, etc.)? Also, can I adjust the side on which the numbers appear?

You should read the spec:

Using CSS counters - CSS: Cascading Style Sheets | MDN

I am not sure about why you would want the numbers appearing on the right, but you could change ::before to ::after.

Votes

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
community guidelines
Enthusiast ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

Wow! I didn't know one could do that with CSS...cool!

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

https://forums.adobe.com/people/Rag+and+Bone  a écrit

Wow! I didn't know one could do that with CSS...cool!

you can even go a little further and refine your poem - Poem

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

ALsp  a écrit

I then pasted it into Notepad.

Are you promoting Notepad or are you trying to help a Dreamweaver user?

Admit it was too tempting... arf arf arf!!!!!

Votes

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
community guidelines
Mentor ,
Oct 27, 2018 Oct 27, 2018

Copy link to clipboard

Copied

LATEST

Votes

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
community guidelines
Community Expert ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

When copying text into DW from other programs...

1. Right click in Design View where you want the text to go (do not use Live View)

2. Choose Paste Special

3. Select "Text with Structure"
4. Ensure "Retain Line Breaks" and "Convert smart quotes to straight quotes" are checked

5. Hit OK

That should get you a fairly decent html text file to work with. It won't copy over garbage style code from Word, and will give you <p> and <li> tags where they belong.

Votes

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
community guidelines
Mentor ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I just opened Word to a copy of my latest novel that I use for copying and pasting into web documents. The version is a filtered html doc, which is a feature in Word.

Copying several contiguous paragraphs, I then did a normal paste in Dreamweaver design view, with this the result:

Test Document

So, the hoops one has to jump through are typically avoided by knowing how to use, in this case, Word 🙂

Votes

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
community guidelines
LEGEND ,
Oct 25, 2018 Oct 25, 2018

Copy link to clipboard

Copied

I dont have Word installed on either of my Macs. As far as l know Macs dont ship with it by default.

This kind of simple stuff should be able to be produced within the html editor itself and if it cant be done then this is the kind of problem which could be solved by an extension or simple apple script if the editor enterains them. Now this kind of script or extension IS really useful

Votes

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
community guidelines