Difference between revisions of "S2 Guide: Customization Area"

From Dreamwidth Notes
Jump to: navigation, search
(The Great Wiki Monster ate some words!)
(Custom CSS)
 
Line 76: Line 76:
 
===[http://www.dreamwidth.org/customize/options?group=customcss Custom CSS]===
 
===[http://www.dreamwidth.org/customize/options?group=customcss Custom CSS]===
  
This section is where you can add custom CSS.  There is an option to use the existing stylesheet of the layout or not, a place to load a custom stylesheet (that is filtered through a proxy for safety), and a textarea you can put in CSS that will also be included in the layoutSimplified CSS and CSS only tracks will be making frequent use of this section!
+
This section is where you can add custom CSS.  Several options are involved:
 +
 
 +
* <b>Use layout's stylesheet(s)</b> -- This lets you include the base stylesheet of the layout.  If you uncheck this box, you'll want to put ALL of the CSS you'll need into a custom stylesheet URL or the "Use embedded CSS" section.
 +
* <b>Custom stylesheet URL</b> -- You can put a URL here that will be used for the style's CSS.  Note that it does not end up used directly: it is filtered through a proxy for safe content.  There's also some caching involved, so don't use this if you're making frequent changes and wanting them to show up immediately.
 +
* <b>Use embedded CSS</b> -- You can directly put CSS into this text areaThe contents will be filtered for safe content.  This option is independent of the "Custom stylesheet URL" option--you can use them both at the same time.
  
 
[[Category: S2 Guide]]
 
[[Category: S2 Guide]]

Latest revision as of 04:37, 21 May 2011

The customization area was made so that people would be able to modify and adjust their style, without knowing about CSS or HTML. It's the responsibility of S2 layout makers to try and give their layout good customization options!

The customization area has two main areas:

Customization Wizard Sections

Page Setup

Page setup selection is available at the bottom of the theme selection and the customization area. The current options (not available in all layouts) are:

  • One column, no sidebars
  • Two columns, right sidebar
  • Two columns, left sidebar
  • Three columns, sidebar on either side
  • Three columns, sidebars on the left
  • Three columns, sidebars on the right

Presentation

Examples of presentation options include:

  • Entry icons on the right or left side of the entry
  • Metadata before or after the entry content
  • Show entry pages in the journal style instead of the site style
  • Use custom reading list colors
  • User interaction links, entry management links, or comment management links as text or icons
  • Entry and comment date/time formats

Colors

This section lets users change the colors of their theme--backgrounds, foregrounds, and borders!

Fonts

This section lets users define what fonts they'll be using and what sizes they are.

Images

This section lets users add custom background images to their layout. This can include page backgrounds, backgrounds to the header (with an option to make sure the header will be high enough for the banner), backgrounds to modules, and backgrounds to entries.

You can specify the way each image tiles and basic positions, like "top right" or "center left".

Modules

Modules can be put into different areas of the layout, which can vary.

They do have a limitation currently in that there's only one of each type--that means there's only one Text Box module.

The modules include:

  • Basic Journal Info -- Lets the user to display their default icon, the display name of the journal, and link to website; can unselect any items as well
  • Navigation -- the navigation links to different pages on the journal
  • Custom Text -- Lets the user put in some custom content to put into their side bar
  • Calendar -- Displays the latest month from the archive, in a table or a horizontal format
  • Page Summary -- On pages displaying entries, lists quick links to each entry on the page
  • Recent active entries -- Displays a list of the entries in the journal that have most recently received comments
  • Tags -- If there are tags, lists them out. User can set the limit for number of tags to show and the display type (multilevel, cloud, or list)
  • Link List -- Displays the links in the journal's link list; only displays if they exist
  • Syndication -- Displays links to the Atom and RSS feeds for the journal, only displays on the recent page
  • Style Credit
  • Search -- A search box for searching a journal or community using the search feature. Only shows if you can use the feature.
  • Time Loaded -- Displays the time the page was loaded
  • Powered By -- Gives a shout out to Dreamwidth

Text

This section lets you change the text label of a lot of things, like the titles to navigation and interaction links and the contents of the text module.

Links List

This section lets you define the links you want to go into the link list module.

Custom CSS

This section is where you can add custom CSS. Several options are involved:

  • Use layout's stylesheet(s) -- This lets you include the base stylesheet of the layout. If you uncheck this box, you'll want to put ALL of the CSS you'll need into a custom stylesheet URL or the "Use embedded CSS" section.
  • Custom stylesheet URL -- You can put a URL here that will be used for the style's CSS. Note that it does not end up used directly: it is filtered through a proxy for safe content. There's also some caching involved, so don't use this if you're making frequent changes and wanting them to show up immediately.
  • Use embedded CSS -- You can directly put CSS into this text area. The contents will be filtered for safe content. This option is independent of the "Custom stylesheet URL" option--you can use them both at the same time.