Global Colors & Fonts: Creating a Design System With Elementor - Sites on WordPress
video description
Date: 2022-04-30
Related videos
Comments and reviews: 10
A.
This was not a video on creating a design system and while the global and theme styles is a good step in the right direction, it is a long way from being effective. Please do another video on actually creating a design system. Show how to pick a simple color palette with dark grey, medium grey, light grey, white, black, and two or three accents. Disable global colors first, add the color palette, add a standard font family and setup theme styles, THEN import all the stuff and show how nice it is to have it uniform and how changes affect the site. If you would include a good starting color palette, a good font family with settings and good theme style settings on your help pages for global styles, fonts and theme styles, it would eliminate a world of confusion, especially if you showed how to use the global styles and fonts within the theme styles. Most of the videos I have watched to date, don't even demonstrate this correctly.
reply
This was not a video on creating a design system and while the global and theme styles is a good step in the right direction, it is a long way from being effective. Please do another video on actually creating a design system. Show how to pick a simple color palette with dark grey, medium grey, light grey, white, black, and two or three accents. Disable global colors first, add the color palette, add a standard font family and setup theme styles, THEN import all the stuff and show how nice it is to have it uniform and how changes affect the site. If you would include a good starting color palette, a good font family with settings and good theme style settings on your help pages for global styles, fonts and theme styles, it would eliminate a world of confusion, especially if you showed how to use the global styles and fonts within the theme styles. Most of the videos I have watched to date, don't even demonstrate this correctly.
reply
Scott
Ziv, Your presentation would benefit from two (2) slight changes. First, go with a mouse that is easier to follow. It could be larger and a different color. Maybe a trail would help. You move fast. It is not possible to follow without backing up and playing again. This is tedious. Since I am certain you want to be a great teacher, you will need to look at ways to make your moves very obvious to your students. Second, don't say -As you can see...-. This is especially frustrating to me when I could not keep up or even find a mouse. You need to make any reference to a place on the page completely obvious. Slowing down just a tiny bit to add stronger references combined with a bigger, brighter mouse will improve your presentation significantly. Thank you for sharing your knowledge.
reply
Ziv, Your presentation would benefit from two (2) slight changes. First, go with a mouse that is easier to follow. It could be larger and a different color. Maybe a trail would help. You move fast. It is not possible to follow without backing up and playing again. This is tedious. Since I am certain you want to be a great teacher, you will need to look at ways to make your moves very obvious to your students. Second, don't say -As you can see...-. This is especially frustrating to me when I could not keep up or even find a mouse. You need to make any reference to a place on the page completely obvious. Slowing down just a tiny bit to add stronger references combined with a bigger, brighter mouse will improve your presentation significantly. Thank you for sharing your knowledge.
reply
Alexandre
Ziv and Elementor, please could you guys explain more about things beyond the Elementor features and the WHY's you are doing all these things? For example, why did you choose the section width to 1220? Is this a standard when creating a website? Is this just your preference? Is this the best option for good browsing experience? Another example, why did you choose 50% VH hero and 50% VH on contact us? (this one is easier to understand, but some people don't understand). It would be much more interesting and helpful if you guys go a little bit further than just -click here, add this, add that, choose this value....- Thank you for the video, it was very good!
reply
Ziv and Elementor, please could you guys explain more about things beyond the Elementor features and the WHY's you are doing all these things? For example, why did you choose the section width to 1220? Is this a standard when creating a website? Is this just your preference? Is this the best option for good browsing experience? Another example, why did you choose 50% VH hero and 50% VH on contact us? (this one is easier to understand, but some people don't understand). It would be much more interesting and helpful if you guys go a little bit further than just -click here, add this, add that, choose this value....- Thank you for the video, it was very good!
reply
Denis
Before you watch don't be fooled by the title;
This video did not create any website design system, it just edited two page templates using the new settings.
A website design system would cover planning all website layout settings, typography font settings and sizes and colours, plus website colour scheme for backgrounds and buttons and borders and forms etc.
It would also explain what parts of Elementor elements are typically styled by Primary, Secondary, Accent colours etc.
reply
Before you watch don't be fooled by the title;
This video did not create any website design system, it just edited two page templates using the new settings.
A website design system would cover planning all website layout settings, typography font settings and sizes and colours, plus website colour scheme for backgrounds and buttons and borders and forms etc.
It would also explain what parts of Elementor elements are typically styled by Primary, Secondary, Accent colours etc.
reply
U-Save
thanks! I'm wondering if best practice is to make more custom colors/fonts for that setting for example H6 to be a special secondary heading when need that or setting a custom font and color only? And will changing the H tag for a heading or inside a text element invoke the H theme settings without needing to set this in style tab?
reply
thanks! I'm wondering if best practice is to make more custom colors/fonts for that setting for example H6 to be a special secondary heading when need that or setting a custom font and color only? And will changing the H tag for a heading or inside a text element invoke the H theme settings without needing to set this in style tab?
reply
el
how can I get started on this while already having a website tied to a template? I would love to work on a v2 version of my site without template while my v1 is still up and running. It seems I would have to kill my website first, get rid of the template and then design my v2 or am I mistaken? Thank you
reply
how can I get started on this while already having a website tied to a template? I would love to work on a v2 version of my site without template while my v1 is still up and running. It seems I would have to kill my website first, get rid of the template and then design my v2 or am I mistaken? Thank you
reply
Best
Hello Sir,
I am using Elementor and Elementor Pro.
Is there any way to insert images in fonts without using CSS currently in Elementor / Elementor Pro ?
If possible, please share me your website and social media so that I may follow your tutorials regularly.
With regards,
Vivek Kumar
reply
Hello Sir,
I am using Elementor and Elementor Pro.
Is there any way to insert images in fonts without using CSS currently in Elementor / Elementor Pro ?
If possible, please share me your website and social media so that I may follow your tutorials regularly.
With regards,
Vivek Kumar
reply
Tatah
All good, but how does these global changes affect posts created with Gutenberg? After doing all my global changes, I inserted a button with gutenberg on my post and it did not reflect the color of the button design in the global color section in elementor. How do you fix this?
reply
All good, but how does these global changes affect posts created with Gutenberg? After doing all my global changes, I inserted a button with gutenberg on my post and it did not reflect the color of the button design in the global color section in elementor. How do you fix this?
reply
Prince
-DBinski1 On the page u want private.. Click on Edit Page and change the settings from public to private, at the right side of your screen. You can do this for other pages as well. Once you are done editing you can set it back to public and everyone will see it.
reply
-DBinski1 On the page u want private.. Click on Edit Page and change the settings from public to private, at the right side of your screen. You can do this for other pages as well. Once you are done editing you can set it back to public and everyone will see it.
reply
Con
Hi! I've been using elemento for a while and when I'm creating everything looks fine but then when I take a look to my page through my link it doesn't look right or as I created it...So I don't know if I'm doing something wrong or what...thanks
reply
Hi! I've been using elemento for a while and when I'm creating everything looks fine but then when I take a look to my page through my link it doesn't look right or as I created it...So I don't know if I'm doing something wrong or what...thanks
reply
Add a review, comment
Other channel videos
