To create custom styles go to Website/CSS in the HoolaHoop menu
Enter the style name and click on the green plus icon to enter the details
1. The type is depended on where on the page the text will display.
If it is a header select the header number based off of where on the page it will be. If it will the at the top of the page select header one, if it will come after an existing header seelct header 2
If the text is for text body then select Text (Range of Text) this will allow multiple styles to be applied per paragraph as opposed to paragraph (blocks of text) type
2. Text colour has multiple selection methods. A colour can be selected from the colour wheel, a list of other colours in the stylesheet, or the href can be entered into the text box
3. The 'Text Style' should be set to normal, unless the text will always be italicized
4. 'Text Size' is of course how large the text is. Using pixels is standard
5. 'Text Weight' determines the boldness of the text. If choosing a number value the higher the number the bolder the text will be
6. 'Text Font' The text font is a limited selection to ensure that the text remains consistent throughout the website. check an existing style to make sure that the correct font is used.
7. 'Text Decoration' should generally be left unchecked and if there are things that should be underlined, or struck out use the rich text editor to do so when entering the content.
If a link is being created this should be checked. click here for instructions on how to set up a link
8. Text line height: Do not apply Text Line Height settings to the Body style in the CSS manager, this applies a line-height to every single element and causes a lot of problems. Also avoid using Pixels for the units, and instead select (x browser size) from the drop down option, using values like 1.1 or 1.2; what this says is that the line-height of elements using this style will be 1.1 times the font size of the element. So if a line of text that is 12px high and you set the line height to 1.2 the line height works out to 14.4px.
9. Margin controls the width and height of the margins around the text based on the numerical value entered
10. Padding: adds extra space around the text content based on the numeral value entered
11. Border Width: If border width is selected it will create a solid border around the entered text the border width is how thick the border will be.
12. Border Style: allows borders to have different styles such as dotted, solid, or dashed.
13. Border Colour: determines the colour of the border around the text.
14. Custom Setting: used for making all text uppercase, lowercase, and adjusting the letter spacing.
Example: text-transform - uppercase