Streaming live at 10am (PST)

How to import a website back into webflow


#1

Hi webflow forum,

After being ignored for more than 2 weeks for a simple parallax question. I went on and scoured the internet to find the answer. It was the longest adventures and sleepless nights.

But I found it and feel empowered, not cause of webflow. I now made my functionality, see http://wedowe.org

So how do I bring this back to my webflow designer to work on other stuff?

It's made in html/css/javascript

Webflow support sucks.

Hopefully there is hope for the forum.


#2

Whoa. GJ on the parallax. smile

In regards to importing a website, WF does not have a tool to do that. What you can do is put all your special CSS into the custom code head area, and your special javascript in the custom code body area.

This way, you can still design your site in WF, but also have that parallax effect.


#3

Thanks @PixelGeek Thanks so much for your answer. But where do I leave the HTML then? Cause I wrote the html and styled it further with css. Or is there no way to import the html.

Am happy that there is a way to keep working within webflow. It was nice to back to basic with a text document and code, but the whole reason for getting webflow was to save me some time smile

Again, thanks for your answer. U are awesome!


#4

Hi @Aimanisms, just wanted to reiterate what @PixelGeek said and also encourage you to share your thoughts on this thread: http://forum.webflow.com/t/importing-html-css-into-webflow/871 smile


#7

@Aimanisms You can recreate those elements in the Webflow designer tool by:

  1. dragging in a basic "DIV BLOCK" element on to your canvas.
  2. give that element a class name of "parallax-container"
  3. drag in another basic "DIV BLOCK" element inside of the parallax-container
  4. give this new element a class name of "parallax-layer" then add a sub-class name of "layer-0"
  5. style this element how ever you see fit.
  6. click on the settings tab for this element (the cog icon)
  7. in the "CUSTOM ATTRIBUTES" area, add a new attribute with a name of "data-parallax-speed" and a value of "0.05"
  8. then create another new attribute with a name of "data-max-scroll" and a value of "565"
  9. repeat steps 4 through 8 as necessary, but change the sub-class name to "layer-[x]" where [x] is a different number. Also, change the attribute values as needed

hope this helps you out =)


#8

@PixelGeek You are most awesome person! Thanks so much for this. This is basically all I was asking for 2 weeks ago, and I kept waiting to then just get a general response, which if I see your instructions was not even correct and just plain lazy. I am happy with all the lessons I learned outside of webflow for that time and just using plain html/css/javascript code. In a big lack of support and frustration, great things can come!

I will try this tomorrow and let you know how it went.

Thanks a big bunch again!


#9

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.