Classes Structure | Client-First Style-System for Webflow

Поделиться
HTML-код
  • Опубликовано: 18 ноя 2024

Комментарии • 22

  • @nicolaspettini3143
    @nicolaspettini3143 2 года назад +2

    So glad I found this great method! I’ll implement it on my next project. Thanks ☺️

  • @avl258
    @avl258 3 года назад +2

    This is wonderful. Exactly what I needed and searching dor lately to up mu Webflow skills.
    You are doing an incredible job with all this content

    • @Finsweet
      @Finsweet  3 года назад

      Glad you are finding value in all of it. Pay it forward is all we ask.

  • @TheKetoSurvivor
    @TheKetoSurvivor 3 года назад +1

    🤯 THANK YOU!

    • @Finsweet
      @Finsweet  3 года назад

      You're welcome!!

  • @lommedugnadenldtv6098
    @lommedugnadenldtv6098 3 года назад +2

    This is cool, but did you fix that pagination loading time for more than 100+ items doe....

    • @shpekov
      @shpekov 3 года назад

      noway to fix it. limited by webflow backend (in fundamental approach to transfer data)

    • @lommedugnadenldtv6098
      @lommedugnadenldtv6098 3 года назад

      ​@@shpekov Mixitup has a solution. But the filtering is limited, and it was an absolute nightmare to code...
      Ive implemented it on this page:
      www.klirr.no/rabattkoder-tilbud
      This seems to be how it solves the problem.
      And on slack finsweet doesnt even reply other than: "its webflows fault"
      var moveItems = document.querySelectorAll('.to-be-moved');
      moveItems.forEach(function (move) {
      document.getElementById('target-container').appendChild(move);
      });

    • @shpekov
      @shpekov 3 года назад +2

      ​ @Lommedugnaden LDTV data filtering is not a frontend task, coz DOM not ready for it and when you have many items it will be lagging anyway. now im working on blog with over 800 posts thats needs to be filtered by tags. And i tried all frontend solutions. noway. As result im using default webflow scheme. its an webflow data model limitation. google MVP MVC. If we cannot update collection list settings on live, so we cannot make perfect filter for large number of items. But if you have just 200, you can use loadall in finsweet lib. if you want discuss deeper you can email me im@shpekov.sk

  • @mjaroszimg
    @mjaroszimg 2 года назад

    Hi! Why all the .containner-width classes are identical? Is it editable by the dev's needs?

  • @07ariana07
    @07ariana07 3 года назад +2

    Would this be a good structure to follow for creating templates for Webflow?

    • @LetsDesignToday
      @LetsDesignToday 3 года назад

      Great question.

    • @Finsweet
      @Finsweet  3 года назад +1

      This structure should be perfectly acceptable by their template team as it meets accessibility standards and a few of the folks who worked on this came from the template ecosystem.
      That being said, Webflow does have the final call there and we do not have an official answer from them on this.

    • @07ariana07
      @07ariana07 3 года назад +1

      @@Finsweet Thank you for the quick reply and for the amazing work! 😊

    • @Finsweet
      @Finsweet  3 года назад

      @@07ariana07 Another thing I just thought of is that as prescribed it might be fine, but like any project in Webflow, someone could completely butcher it and use the system improperly. So that being the case, I imagine it comes down to the person using the system and their general knowledge of web design best practices. The goal of this system is to simplify that process and make it easier for more people to become familiar with it.

  • @TheVirtualGravity
    @TheVirtualGravity 3 года назад

    Thanks Guys! I've always wondered how to structure classes. Besides Accessibility are there other benefits using a system like this? Maybe SEO or Page loading?

    • @Finsweet
      @Finsweet  3 года назад

      We cover most all of the benefits to this system in our launch stream - ruclips.net/video/YP-tXAtSWZg/видео.html

  • @framerprojects
    @framerprojects 3 года назад

    Maybe this sounds weird but, why don't you just add "overflow-hidden" to the body tag? That way it should also prevent horizontal scroll bars.

  • @jasinAmsterdam1976
    @jasinAmsterdam1976 3 года назад

    Do you recommend making a "starter page" with this structure? and then copy-pasting "page wrapper" from there to each new "actual" page you are making.

    • @Finsweet
      @Finsweet  3 года назад +1

      This is one way to do it for sure. You can use our base cloneable or build your own template to start from. But having a core starting point is definitely a good idea.
      webflow.com/website/client-first-cloneable

  • @Norell88
    @Norell88 3 года назад +1

    Sugar sweet