Question
How do I add my own custom CSS styles?
Answer
Big Medium offers several methods for customizing the CSS styles of your site.
All of these methods require an account with webmaster or administrator
privileges at the site.
The style editor
Big Medium's style editor offers a WYSIWYG ("what you see is what you get")
method of adjusting the CSS styles of the HTML generated by Big Medium's
widgets. To go there, click "Styles" in the control panel's main menu.
Select the name of the element whose style you want to adjust using the
dropdown menu just below the preview pane. For CSS savants, this is also
a useful way to find out what CSS selector controls a certain element:
when you choose an element to style, the legend above the dropdown menu
updates to display the name of the CSS selector.
From there, you can use the form controls below to change the font, colors,
padding, box styles and more. When you're satisfied that the preview
shows the results you want, click "save" to apply your changes to the
live site.
The styles set here supplement, but take precedence over, styles set in the
theme style sheet.
The theme style sheet
While the style editor is a good way to finetune the HTML snippets that
Big Medium produces, the theme style sheet is where power users can
get their hands dirty. The theme style sheet controls the overall
layout, look and feel of the site's design theme.
To go there, select "Edit Theme Style Sheet" from the "Layout" menu.
From there, you can edit a theme's styles, or clear it out entirely and
use the space to make your own custom style sheet.
External style sheets
If you prefer not to edit your CSS through the browser interface, you can
also add your own external style sheets to the site. This CSS style sheet
will supplement, but take precedence over, any styles in the theme style
sheet and the style editor.
To add a link to your external style sheet:
Go to "Settings > HTML Preferences."
Click "Document and page header."
In the panel marked "Widget: htmlhead," go to the "Additional HTML to
include in header" field and add a <link> tag. For example:
<link href="http://example.com/styles.css" rel="stylesheet" type="text/css">
