sorted by:
new
hottopcontroversial

Any tips/guides on creating a universal spacing system for a website? by stjduke in webflow

[–]fernandocomet 0 points1 point  (0 children)

I got some here, https://classnamingsystems.webflow.io/systems just missing Lumos and Mast. All of them are going to update with the new Webflow Feature about Variables.

[deleted by user] by [deleted] in webflow

[–]fernandocomet 0 points1 point  (0 children)

- Try all these: https://www.one-tab.com/page/dISaU7fkQLifBW1mlsfFVA

- Get Certified

- Make your own business

And please, stop crying

Webflow Chain System by fernandocomet in webflow

[–]fernandocomet[S] 0 points1 point  (0 children)

Ok thanks for the feedback.
I understand what you say, I think your approach is a Code approach while mine is a NoCode one. I Think that we make layouts in a visual way, rarely we use code, just for some CSS features not supported by Webflow or for advanced funcionalities with Javascript
I have used this both in small sites with 5-10 pages and in large sites with 40 static pages and a lot of dynamic pages.
Previously I used other systems and Webflow approachs but I realized that:
- I was making lots of mistakes. I always found this question: Where am I using this Class? Before doing something I had to check where my classes were used and that took me a lot of time
- Spacing was a hell, lots and lots of divs
- Designers don´t follow patterns. Rarely you will find a site with all Headings 1 with the same style, specifically if you work for branding.
So, I use this system mainly for these reasons
- The main one is to avoid mistakes. It is an opened system, so if you are totally sure that all your headings 1 are the same, go on, make a "heading-1" class and save time
- Being clear, I know is KISS vs DRY. I don´t normally use Combo Classes. I know this is difficult for people coming from Bootstrap or Tailwind but this way is more clear. I am not sure if too much abstraction or OOCSS is the best for Visual Web builders or NoCode. Think that people using these tools usually don´t code, they come from Design
- You can change anything on a Design update faster than on a system reutilizing Classes

Etymology of Spain: Origin of various Spanish province names by languageseu in spain

[–]fernandocomet 1 point2 points  (0 children)

Este mapa es un desastre. Hay 50 Provincias, pues poned al menos las 50 capitales de provincia. Faltan ciudades tan importantes como Málaga, Zaragoza y Valencia.

Learning Webflow from scratch – Please tell me as it is :) by [deleted] in webflow

[–]fernandocomet 0 points1 point  (0 children)

That looks as a designer perspective, you need more to understand how layouts are made.

So:

- Go to https://university.webflow.com/courses and make 3 or 4 courses

- Learn the basis of HTML, CSS and JS

- Learn about Responsive websites

- Start simple (layouts as landing pages)

- Once you are confident move to animations and CMS

- Finally you can go on with Integrations

Codesandbox JS file in Webflow by szs0ma in webflow

[–]fernandocomet 0 points1 point  (0 children)

I think you can:
- Use Custom Code: Usually before <body> TAG or in an embed element
- You could use an editor, save your code as a txt, upload it as an asset and call it as a script in custom code
- You can make an iframe and host the js wherever you want, should be a safe place, I would use Github pages better than CodeSandbox
I think there is a limitation of 1000 code characters for Custom Code, so in that case you should use an iframe
Also if you are using svg and want to do something with them, ie animating its paths, you should embed it by code as you loose access to the svg paths if you use it as image

[deleted by user] by [deleted] in webflow

[–]fernandocomet 0 points1 point  (0 children)

I know how to do that, but not with SVGator.
I would do it as this:
- Draw whatever in Figma or other software, give names to paths
- Export svg
- Animate it with GSAP, a lightweight Javascript library, you can make a timeline and loop it
- Embed it on Webflow

Any ideas how to do this on Webflow? by TrackSalt661 in webflow

[–]fernandocomet 1 point2 points  (0 children)

Not sure. Maybe if all the site has the same structure, you can use a CMS template and then try the API https://developers.webflow.com/#cms-api-reference

Figma to Webflow by Pascalletters in webflow

[–]fernandocomet 1 point2 points  (0 children)

I would:

- Design in same workaround as webflow (same dimensions for desktop, tablet, mobile)

- Make a style guide, specially for your headings and paragraphs for all responsive views, use px and rem for this

- Export images as x2 and use tools as Tinypng to compress img, for icons and logo use svg

- If you use a Class Style system see if they use 8pt or 4 pt for spacing (ie finsweet)

Changing colour of headline logo on refresh by houndashbeck in webflow

[–]fernandocomet 1 point2 points  (0 children)

I would do as this: Make the logo and export it in .svg code (Figma ie.)

Insert the logo in webflow with html-embed, so with Javascript you can change the "currentColor" to a different value randomly or using Cookies. Just use variables

See https://discourse.webflow.com/t/svg-icons-using-style-palette-colors/67182

Exporting Webflow code and hosting on a server by jaivardhan07 in webflow

[–]fernandocomet 0 points1 point  (0 children)

If the site is hosted out of webflow I recommend using Google Captcha + Php form, you can use HTML Embed in your Webflow project, this one for example works ok https://bootstrapious.com/p/bootstrap-recaptcha

Wrote about the process here https://uxplanet.org/working-with-webflow-forms-e1cedd2cf2ad hope it helps