What are CSS Properties?
So you have finally managed to build your online school! How exciting! At this point, you are about to find out that with LearnWorlds you can create the school of your dreams.
In order to do this, the only thing you should be wary about is paying attention to every single detail regarding your school’s content, but also its looks. Now, wouldn’t it be great if you had the ability to customise your page’s appearance? If you had full creative control over your school?
Υοu may be wondering where you can find this powerful “wand”, but chances are you have already noticed it while editing your school’s appearance. When selecting any element on your page builder, in any of your templates, you can see on the top right some options. The third button, the gear, is the customize appearance button.
Older users might remember it as the ‘CSS Properties’ window but recently it has been totally revamped and renamed to ‘Customize appearance’. With this amazing tool authors can change the fonts of their texts, control line-heights, font-sizes, the transparency of specific elements and much more! 😉
Why Should I Use Them?
The ‘CSS properties’ window is the handiest tool that allows you to change the unchangeable, as it can edit or change visual elements which on other platforms would normally require you to employ (and pay) an outside developer. With LearnWorlds you can just do it by yourself!
Through the “customize appearance window”, you can transform any ordinary object (template, text, course, etc) to an eye-catching treat, to suit your preferences. Not only can you change the fonts of your school’s texts, but you can also implement your text with animation, give a different shape to your templates, and decide about the allowed visibility of your courses or templates. Customize your online school depending on your needs and those of your learners. Τhis is both a matter of improving your school by making it easier to use and at the same time more unique in terms of its its appearance.
First, take a look at the choices you have depending on each template. When clicking the gear button, the “customize properties” window pops up, that presents you with a variety of options.
1Create Animations or Change the Shapes
Some elements, for example, can only be edited regarding their animation and their shape, manually or using some CSS code.
2Modify the Visibility of Your Templates
In other elements, by clicking the “eye” you can handle their visibility, whether it is a simple template or a course.
3Manage the Artistic Appearance of Your Texts
In most text elements you also have the ability to manage the appearance of your texts, by not only their size and font, but also by their lettering space, the line height and the transparency. Just choose the “painting brush” you need, your school is your canvas!
What can I do with the customize appearance button?
Let’s check out each of the brilliant options available for customizing your pages through this “customize appearance” window!
Formatting Elements and Text
Whenever you choose to add some templates with text to your pages, you have the ability to format each written element to the detail. Apart from deciding whether your text will be bold, in italics, underlined or how the form of the paragraph will be,
1you can change the font,
2the size and the colour of the letters!
3adjust the letter spacing, the line height and the transparency.
Your element must already look prettier but what about making it more captivating? With the “Assign Animation” button you can make your text, box, title or photo animated when appeared on the page.
Slide it from left to right and vice versa; make it just fade in or fade in from the bottom to the top; scale, give it a pulse, or make it bouncy! These animations are triggered whenever the page is scrolled by the user.
Border and Elements in a Box
Do you think the beautifying procedure for your elements is over? There is more you can do even with the box that contains your element.
Visible Only to Logged-in/out
Knowledge is for everyone but sometimes you might need specific elements with a limited group of your students. That is why we decided to give you the ability to select what level of your users will be permitted to see your well-designed material.
So, you can easily decide whether any part of your pages will be visible to all of your learners or only to the logged in or logged out ones.
For your Courses, you have also the additional option to decide whether some of your material will be visible only to the enrolled or to the unenrolled users.
Maybe you want to offer some sections of your course only to the enrolled learners and also prepare some free samples to attract unenrolled users. This feature can also be handy in case you want to demonstrate a new offer that will lure only new learners that haven’t purchased any course yet, or you might be interested in guiding your fresh started students, sharing some links or other material only with the enrolled ones. Never before had anyone such control over their teaching practices! 🙂
Inline CSS code
In case you are more familiar with web development, we also give you the opportunity to control your pages using css code. Just go to the “Inline Css code”window and insert the commands you wish in order to adjust the selected element in the most suitable form for your school.
So, you have edited your element, you have changed font, colours, size and you even inserted your css code, but along the way you might have changed your heart too and want to do everything from scratch. Worry not, by going to the last button of your Css Properties” window, you can click on the “Remove Formatting” button and your element will turn to its default state.
See how much simpler it is to have the control of your pages? “CSS properties” window is just the tool you needed to give your school the most captivating appearance according to your preferences!
After Css Properties Editing
What are you waiting? Give it a go then! 🙂