The Your Web Department platform includes all the style sheets you need to build great websites.
In addition you have completele freedom to override YWD’s default classes, as well as add your own. There are many places and options for you do that, which we will discuss here.
Adding custom CSS globally via YW Designer
If you would like to add custom CSS that will be loaded by all pages, click Designer on the main toolbar to launch YWD Designer, and then go to Apps > Custom CSS. YWD offers several fields where you can either type or paste your CSS code. You can also enter CSS specifically for mobile to override a generic setting.
Custom CSS fields in YWD Designer
Applying classes to individual content blocks
You can also apply custom CSS to specific content blocks. You can either write your own styles and add them to the Design settings as described above, or use one or more predefined styles. For instance, you could add a new CSS class called homepage-hero that you would only like to apply to one content block – the Home page hero. To do so, after adding the CSS code to YWD Designer all you need to do is edit the content block, and in the Advanced options of the content block enter the name of that class:
Assigning a class to a content block
That’s it. The class will be applied to the content block when the page is displayed.
Applying styles to elements within the Word Processor
You can also apply stylesheet classes to certain elements within a Word Processor content block, directly from the editor. You can do that for links, images and tables. Simply enter the class(es) that you would like to apply into the Stylesheet Classes field of the element’s Advanced tab. You can combine custom CSS classes that you create and add to YWD Designer with one ore more of YWD’s predefined styles. If using more than one class, separate them with a space. In the example below, one of YWD’s predefined classes (button) is being combined with a custom class (animated) written by the website’s designer.
Assigning classes to a link
Applying inline styles
In some very special cases, you may want to apply a style to a specific element. You can use the Style field of the element for that. Try to avoid that practice though, as it may make your website difficult to maintain.
Adding inline CSS to a specific element