Streaming live at 10am (PST)

HTML exports single line


#1

Hello. I’m not really sure it is actually bug. I’m new here and it’s my very first project. So please excuse me in advance. But.

I need to export my website and the html file is just one long single line. I mean it is fully functional but it’s not good to have it like this. Is here any way to fix this? I use Lite plan.

http://stomatologie-michalek.cz/


#2

Hi! I’m not 100% certain if this setting deals with the exporting of your site code, but may be worth a try. Minifying HTML/CSS/JS helps with the load time of your site. If you turn off minifying, it should revert to the standard HTML code layout you’re used to seeing. Try turning this off in Project Settings > Hosting > Advanced Publishing Options at the bottom of the page. I’ve never tried this before for exporting, but it may work!


#3

I’ve tried this before but it doesn’t work. The HTML export is still single
line. Actually it affects rendering the page somehow and it doesn’t look
right when I publish it. So that’s not the solution. But thanks anyway.


#4

Odd behavior. I exported two separate projects (one hosted by Webflow and one not) and both .ZIP files don’t contain any minified files.

Following this thread in case someone else knows a solution. Hope you get it fixed!


#5

Which OS and program are you using to open the exported HTML files?


#6

I use mac OS (High Sierra) and don’t open the code at all. I upload the .zip directly to the hosting ftp. But it is not relevant in my opinion. The code is single line already in webflow export preview window.

I forgot to say I made a website when I was on Free plan and after the whole work was done I have changed to Lite. I don’t know if it can affect the export.


#7

Hi @pecamat, thanks for reporting the issue. There is definitely some strange behavior with the export. I have reached out to the dev team and will provide a further update when there is more info.

Thanks in advance


#11

#12

Hi @pecamat

Thank you again for posting about this issue.

It looks like we found the root cause of this issue. If you copy/pasted your text content from another app like Word or Pages there’s a chance some styles / characters like   made it into your project and this is causing the issue.

To resolve this you can copy/ paste your text without formatting or retype the text. Then try to export your project once more.

Hope this helps!


#13

Hi All,

My name is Stan and this is my very first comment here on WebFlow’s forum :slight_smile:

A bit of a long message, but I wanted to share my experience regarding the one-line-bug with you. Maybe it helps someone.

I encountered the same one-line code problem when trying to export my work (which is why I found this thread). I’ve got it solved, well… not really solved, I found two workarounds for it that worked for me.

Initially when I noticed the one line code I thought that maybe WebFlow automatically minifies the code after a certain length (I was working on a very long and complex page). This would not have been convenient because I like the possibility to make quick changes or additions in the code when necessary, but then again there are always un-minify tools online (Google it).

So I exported the code and opened the (what I thought to be) minified code in my text editor to find that it didn’t look like minified html at all (see screenshot below).

In addition the page looked as intended in WebFlow, but didn’t display as intended on my local server. The page showed excessive spacing between sections and stacked divs as if there was a margin added between them.

So it wasn’t minified code, but this did give me the idea to minify the code inside WebFlow before exporting to see if that would solve the issue. And it did! So if my theory is correct that this one-line-bug appears with very long/complex pages, minifying seems to work. After exporting just un-minify the code in case you want to be able to make edits manually outside WebFlow :slight_smile:

Exporting minified html in Webflow

However, I wasn’t sure if the problem was actually because of the very long/complex page. That was just my initial theory. To test this I split up the page in two separate pages with the intention to later stitch them together in my code editor.

The plus side for this approach, it worked! The code generated by WebFlow looked as it should (multiple lines and beautiful!) and both parts looked as intended in WebFlow and the browser as well.

The downside comes when you have animations in both parts (which are now separate pages). The animations of the part that you’re copying to the other page will stop working. So if you copy the code from page 2 (the second part of the long page to be added back) and add it to page 1 only the animations that were on page 1 already will work.

The reason for this (for as far as I understand) is because of the generated “data-wf-page” tag ID (the bunch of numbers next to the html opening tag in the exported code - see also image below) which is unique per page and communicates with the JS making the animations happen on that specific page (I think :wink: ).

I haven’t been able to figure out how to add both those IDs on one page. Not sure if that is even possible. But if you like puzzles, like myself, you could choose to add all animated sections on page 1 (if you don’t happen to have animated sections only) and the static sections on page 2. Then put them together in a code editor. Fun!

I hope the above made sense. Please note that the above is what worked for me. I can’t guarantee that it will work for you as well :slight_smile:

I’d also like to mention that, even though it is against my own rules, I did use copied text straight from the design PSD on this page because of the inhuman deadline, but this didn’t seem to be an issue after splitting up the page in two.

Hope this might help someone who encountered this issue to get creative with bugs and possibly give some insight to the WebFlow team.

Cheers,

Stan.