Selective exporting

When exporting a project, to be able to choose what gets exported. This is an idea that is a collection of a series of ideas from other users. 

- Only include the javascript needed for the project

- Option to export only elements/styles that have changed since last export

- Ability to see what was changed since last export

- Export just CSS, HTML, or JS etc. 

- Option to select which files to include

  • Linda Pham
  • Jun 9 2017
  • Evgeny Serg commented
    June 10, 2017 06:40

    I realy want this feature.

    Add selective export will be great. Only page, element, class...  See whole html, css, js file online so i can just copy single element that i need.

     

  • Matthew Oliver commented
    January 30, 2018 02:59

    I really recommend this. I had this issue recently with a team of designers where I worked. I made it work, but none of them used webflow, only me. Life would have been so much easier with selective exporting. 

  • Martin Adams commented
    February 09, 2018 19:28

    Also, add a “Select & Copy All” button for quick copying of HTML or CSS or JS code.

    Use Webflow a lot for quick back-and-forth prototyping using Webflow CSS and apps.

    👍🏼

  • Martin Adams commented
    February 09, 2018 19:29

    As described here: https://medium.com/consciousapps/designing-apps-using-webflow-c1d0e8dd4d36

  • Martin Adams commented
    15 Jul 21:35

    Since there’s not yet a single-button Webflow export for HTML, CSS, or JS, I put together a little sequence using key automation (with the Keyboard Maestro app) — attached.

    Without using this automation procedure, you can also export JavaScript, HTML, or CSS like this:

    1. Visit your Webflow site: https://webflow.com/design/yoursite

    2. Press shift + e to open the export window.

    3. Open the developer console (e.g. command + option + j in Chrome)

    4. Paste the following code into Webflow (yes, Webflow tells you not to paste code in there — the below snippets won’t grant anyone access to your Webflow account):

    HTML

    cssText = document.querySelectorAll('code')[0].innerText
    dummy = document.createElement('textarea')
    document.body.appendChild(dummy)
    dummy.value = cssText
    dummy.select()
    document.execCommand('copy')
    document.body.removeChild(dummy)

    CSS

    cssText = document.querySelectorAll('code')[1].innerText
    dummy = document.createElement('textarea')
    document.body.appendChild(dummy)
    dummy.value = cssText
    dummy.select()
    document.execCommand('copy')
    document.body.removeChild(dummy)

    JavaScript

    cssText = document.querySelectorAll('code')[2].innerText
    dummy = document.createElement('textarea')
    document.body.appendChild(dummy)
    dummy.value = cssText
    dummy.select()
    document.execCommand('copy')
    document.body.removeChild(dummy)

    Presto! HTML, CSS, or JS is now recorded in your clipboard!

    https://gist.github.com/heymartinadams/031e214261f3743b2c0211ab2c74d00f