ninetydegrees: Drawing: a girl's face, with a yellow and green stripe over one eye (Default)
Ninety Degrees (90d) 🌻 ([personal profile] ninetydegrees) wrote in [community profile] getting_started2010-09-13 12:10 am
Entry tags:

Getting Started: Styles

Important: I don't update this on a regular basis. Some styles are very likely missing from the lists and we probably have more themes and styles to choose from now.

Also this post used to list more cats such as color and number of columns but the great Dreamwidth Style Browser integrated this so it's become redundant.


This is for LiveJournal users who would like to use Dreamwidth styles but are a little lost when it comes to finding one or customizing it. I hope you'll find it useful. Suggestions and corrections are welcome.

SELECTION

Dreamwidth currently has over 1000 themes and 40 different styles live on the site. Unfortunately, there are no categories for you to browse through yet so it may not be easy to find one you like. What you can do is browse through base styles first (category's in the sidebar) to find something you like then pick a theme and a page setup. To see all themes from a style, click on its name like on LJ. You can also type the name of a color in the Search bar. If you see a color theme you like but would like to see if it exists in other styles type its name in the Search bar.

-- Simpler styles (i.e. which make you think there's less styling, clean lines, fewer boxes and borders): Brittle, Corinthian, EasyRead, Five AM, Marginless, Paletteable, Refried Tablet, Stepping Stones, Tabula Rasa, Tranquility III.

-- Fancier styles (i.e. styles which make you think there's a lot of styling, lots of images and textures, unusual tricks and effects): Abstractia, Database, Drifting, Fantaisie, Fluid Measure, Funky Circles, Nouveau Oleanders, Summertime, Skittlish Dreams, Wide Open.

This is all very subjective, of course and some of these have more or less than what meet the eye at first glance. Other styles generally fall in the middle part of the spectrum: not 100% simple but not 100% fancy either.

-- Styles with decorative images: Bannering, Boxes and Borders, ColorSide (some themes), Drifting (some themes), Fantaisie, Funky Circles, Heads Up, Hibiscus, Modish (some themes), Modular (some themes), Nouveau Oleanders, Skittlish Dreams, Summertime, Sunday Morning, Wide Open.

-- Styles with transparent boxes: Abstractia, Paper Me, Summertime.

-- Styles with round corners: Ciel, Database, Fluid Measure, For the Bold, Modular, Summertime.

-- Style where the Navigation module is always displayed: Blanket.

-- Styles where the Navigation module can be put in the header area: Bannering, Bases, Basic Boxes, Boxes and Borders, Crossroads, Database, Dusty Foot, Fantaisie, Five AM, Hibiscus, Modular, Negatives, Nouveau Oleanders, Practicality, Skittlish Dreams, Strata, Summertime, Sunday Morning, Transmogrified, Wide Open.


CUSTOMIZATION

Terminology

Layouts -> styles
Friends page -> Reading page
Sidebar, Component, Boxes, etc. -> Modules

Page Setup

The layout shown on the preview is just one example of what the style can look like. By changing the page setup and module placement it's easy to turn a style you like because of the colors or because of some detail into a style you love because things are exactly where you want them to be. Don't dismiss a style just because the preview shows you two-columns right. You can generally change that.

There are seven different page setups. They're not all available for every style although one column and two columns are standard options for most of them.
-- One column: classic (all modules at the bottom) and split (modules at the top and/or at the bottom).
-- Two columns: left sidebar, right sidebar.
-- Three columns: two left sidebars, two right sidebars, one sidebar on each side.

Categories & Options

All options are sorted into nine main categories: Display, Presentation, Colors, Images, Fonts, Modules, Text, Links List, Custom CSS.

All styles basically have the same options. Some might have extra ones but they all have the same base ones. If you feel something is missing, check [site community profile] dw_suggestions. If it hasn't been suggested yet, make a suggestion here.


Display

Display is for Mood Themes and Navigation Strip colors.

Note that the options to select when and where you want to display the Navigation Strip have been moved to Account Settings whereas colors are still in Customize.


Presentation

Presentation is for general presentation options for journal, pages, sidebar and entries. Everything which has to do with presentation is here except for modules which have their own category.

Nothing really new here besides options which used to be available in a few selected layouts on LiveJournal or via advanced customization such as sidebar width, icon on the left or right, date format, etc. Here they're usable in all styles.


Colors, Images, Fonts

Again, nothing new besides many more options, again usable in all styles. You can set your journal base font there.


Modules

Modules is for choosing which boxes to display, where to place them and how to display their content (for example you can select the way you want to display your tags or your calendar).

To hide a module, simply uncheck the box. Change the numbers to change the ordering (make sure two modules don't have the same one).

Depending on the style you've chosen you will have more or less placement options available to you. In most styles, you'll see Main Module Section and Second Module Section. The Main Module Section is the first bottom section in One Column, the top section in One Column Split, the sidebar in Two Columns.

Dreamwidth has three new modules: Cut Tag Controls (to open or close of the cuts on the page), Style Credit and, for paid users, Active Entries (i.e. entries where new comments have been posted). All the modules are available in all styles. Note that you can set the privacy settings for Content Search at http://www.dreamwidth.org/manage/settings/?cat=privacy to control who can search your journal and what they can search.


Text

Text is for the text of Module headings, the Custom Text module, Navigation links and Entry links.

The rest, you know from LJ.


EMs?

You'll see that EMs are the preferred unit. You may be used to pixels. EMs are better because they're related to font size meaning the style will adapt to the size chosen by the viewer: larger sidebar for bigger font size, narrower one for smaller font size, bigger entry title, smaller entry title, etc. It makes sure everybody can comfortably view your journal and that no content overlaps.

However, it may make some things look huge to you. That's because Dreamwidth, unlike many other sites, has chosen not to override users' preferences. If you've never set your browser's font size then you'll suddenly see everything with it, instead of whatever the site has chosen for you (usually something very small like 10 or 12 pixels). Just check your browser preferences to set your base font to something you like.

CSS?

If you have CSS knowledge, you'll see that most styles use the same structure and that all elements have classes or IDs.

To help you with it, there's a guide on the Dreamwidth Wikipedia: http://wiki.dwscoalition.org/notes/S2_CSS

I've also made a guide which should be relevant to most styles: http://layoutmakers.dreamwidth.org/4463.html

If you've made a new style or theme and would like it to become official, have a look at [site community profile] dreamscapes.


More display options?

Several display options, which are not style-dependent, can be found at http://www.dreamwidth.org/manage/settings/?cat=display. To name a few: the ability to have a sticky post at the top of your journal, the ability to view any entry or any journal in your own style, the site style or the light style, 12H or 24H time display, hover pop-ups settings,...


Need Help?

[community profile] style_system is the place to ask questions.
(screened comment)
(screened comment)
(screened comment)

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 00:32 (UTC) - Expand
(screened comment)

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 00:43 (UTC) - Expand
(screened comment)

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 01:11 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] thejeopardymaze - 2010-09-13 01:33 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 01:44 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] stormy - 2010-09-13 02:46 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 03:02 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] stormy - 2010-09-13 03:04 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 03:09 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] matgb - 2010-09-13 01:43 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 03:20 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] holyschist - 2010-09-13 03:26 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 03:35 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] syntheid - 2010-09-13 04:20 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 04:26 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] syntheid - 2010-09-13 04:49 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 04:57 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] holyschist - 2010-09-13 04:32 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] foxfirefey - 2010-09-13 03:37 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] syntheid - 2010-09-13 04:56 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] cesy - 2010-09-13 12:51 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] syntheid - 2010-09-13 17:46 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] cesy - 2010-09-13 18:07 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] baggyeyes - 2010-09-13 04:58 (UTC) - Expand
holyschist: Image of a medieval crocodile from Herodotus, eating a person, with the caption "om nom nom" (Default)

(frozen comment) Re: I'm going to have to send some suggestions

[personal profile] holyschist 2010-09-13 03:20 am (UTC)(link)
Sometimes I think I'm the only person who actively hates all of LJ's free default styles (I'm not jazzed about most of the paid ones, either). DW's aren't amazing, but I find most of them a lot more readable.

*outlier*

It would be nice to have a wider variety of options, though.

(frozen comment) Re: I'm going to have to send some suggestions

[personal profile] foxfirefey - 2010-09-13 05:02 (UTC) - Expand

(frozen comment) Re: I'm going to have to send some suggestions

[personal profile] noracharles - 2010-09-13 06:53 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] noracharles - 2010-09-13 16:56 (UTC) - Expand

(frozen comment) (no subject)

[personal profile] valiha - 2010-09-16 15:37 (UTC) - Expand
stormy: βͺ ππŽπ“πˆπ‚π„ ❫ 𝑫𝑢 𝑡𝑢𝑻 𝑻𝑨𝑲𝑬 𝑴𝒀 𝑰π‘ͺ𝑢𝑡𝑺 ⊘ (Default)

[personal profile] stormy 2010-09-12 10:57 pm (UTC)(link)
Regarding EMs:

You might want to add for Livejournal users that they could go to:

http://www.dreamwidth.org/customize/options?group=style

And under Fonts, set the size of the base font for the journal.

If they've never changed their browser font size, they'll find all the rest of their pages much smaller or larger than they're used to. This gives an alternate way to make the page fonts smaller on Dreamwidth.

(no subject)

[personal profile] stormy - 2010-09-13 04:39 (UTC) - Expand
sophinisba: Gwen looking sexy from Merlin season 2 promo pics (gwen by infinitesunrise)

[personal profile] sophinisba 2010-09-12 11:20 pm (UTC)(link)
Thanks for putting this together!
zaluzianskya: (Default)

[personal profile] zaluzianskya 2010-09-13 12:52 am (UTC)(link)
Thanks! This is really helpful.

One option I haven't been able to find for any of the layouts I've looked at is the option to not display your userpic next to entries. There are only options for putting them on the left or the right. Do you know if this option is available (without fussing around with custom CSS)?
matgb: Artwork of 19th century upper class anarchist, text: MatGB (Default)

[personal profile] matgb 2010-09-13 01:44 am (UTC)(link)
If you don't select a userpic, then none displays, make sure you haven't got a default set. Beyond that, you'd probably need to have a custom layer.
foxfirefey: Fox stealing an egg. (Default)

[personal profile] foxfirefey 2010-09-13 03:38 am (UTC)(link)
It'd be REALLY easy to fix with custom CSS if you want, but other than that, we might have to consider adding a property.

I assume you don't want icons on your recent entries, is that it?

(no subject)

[personal profile] zaluzianskya - 2010-09-13 03:42 (UTC) - Expand

(no subject)

[personal profile] foxfirefey - 2010-09-13 03:45 (UTC) - Expand

(no subject)

[personal profile] zaluzianskya - 2010-09-13 03:47 (UTC) - Expand

(no subject)

[personal profile] foxfirefey - 2010-09-13 03:48 (UTC) - Expand
matgb: Artwork of 19th century upper class anarchist, text: MatGB (Default)

[personal profile] matgb 2010-09-13 01:49 am (UTC)(link)
suggestion submitted today

Will you stop reading my mind on suggestion ideas? Honestly, this is the third time you've done this ;-)

Saves me the effort of figuring out how to write it up, anyway.

And thanks for writing this as well, some of the complaints I've seen about the place about the styles read like they were written over a year ago. Then, I liked just having Core2testing, concentrated the mind a little...
sophinisba: Gwen looking sexy from Merlin season 2 promo pics (gwen by infinitesunrise)

[personal profile] sophinisba 2010-09-13 05:59 am (UTC)(link)
Could someone tell me which styles allow you to add an image to the header and have it centered (just using the option on the customization page and without CSS)?
noracharles: (Default)

[personal profile] noracharles 2010-09-13 06:59 am (UTC)(link)
I know that modular does, at least.

(no subject)

[personal profile] sophinisba - 2010-09-18 13:23 (UTC) - Expand

(no subject)

[personal profile] sophinisba - 2010-09-18 14:17 (UTC) - Expand
zdashamber: painting - a frog wearing a bandanna (Default)

[personal profile] zdashamber 2010-09-13 07:16 am (UTC)(link)
The classification of styles (simpler, doesn't support 1 column, etc) is a great thing to have done, and a lot of work. Thanks!
ironed_orchid: pin up girl reading kant (Default)

[personal profile] ironed_orchid 2010-09-13 07:17 am (UTC)(link)
Thank you
jana: [Naruto] Sakura (Default)

[personal profile] jana 2010-09-13 07:28 am (UTC)(link)
[community profile] style_system is the place to ask questions.

I think you/we should 'advertise' this community over at support; a lot of questions there are style-related questions, and I think users can get better and faster answers at [community profile] style_system. I know it isn't an official community, but maybe it should be?

It'd also be easier for people with some knowledge about the style system (like me...) to fulfill their desire to help others ;) For instance, there is a (style) support request that hasn't been answered for a week now, but I didn't feel like I'd answer the questions 100% correctly since I'm not completely familiar with Dreamwidth's style system yet. And since I didn't want to say anything incorrect over at support, all I did offer was "Go to style_system, you probably get better and faster answers there"... (and even this comment must be approved first)

Anyway, once my real life gets somewhat settled, which hopefully happens soon, I'd love to get more involved (writing documentation, maybe submit a style of my own, etc.)


(no subject)

[personal profile] foxfirefey - 2010-09-13 17:10 (UTC) - Expand

(no subject)

[personal profile] jana - 2010-09-14 06:53 (UTC) - Expand

(no subject)

[personal profile] cesy - 2010-09-14 07:31 (UTC) - Expand

(no subject)

[personal profile] foxfirefey - 2010-09-16 17:48 (UTC) - Expand
moem: A computer drawing that looks like me. (Default)

[personal profile] moem 2010-09-13 11:02 am (UTC)(link)
Great explanation, thank you. Very helpful.
yvi: (Dreamwidth - Badass Dreamwidth dev)

[personal profile] yvi 2010-09-13 04:50 pm (UTC)(link)
I don't much care about any style (as in, I really couldn't care less what my journal looks like as long as it's readable), but wstill, thanks for writing this *hugs*
timeasmymeasure:  a picture of chandra wilson (bailey: shout out)

[personal profile] timeasmymeasure 2010-09-13 06:48 pm (UTC)(link)
This is a great post. Very helpful.
I'm up for helping out with the color stuff "Blue, Green, Red, Purple, Orange, Brown, Gray, Black, White, Yellow", if you need it :)

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 19:13 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 19:17 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 21:39 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 19:22 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 21:18 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-14 01:56 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 22:05 (UTC) - Expand
turlough: Frank Iero asking a question, art by theopteryx ((mcr art) excuse me?)

[personal profile] turlough 2010-09-13 08:29 pm (UTC)(link)
I've been wondering, do you think it would it be any use to make a suggestion that all styles should support having the user name either under the icon or under the subject/date? As it is all DW styles except Drifting have it placed under the subject/date and many people really dislike this placement.
cesy: "Cesy" - An old-fashioned quill and ink (Default)

[personal profile] cesy 2010-09-13 08:42 pm (UTC)(link)
Yeah, make the suggestion and see what happens.

(no subject)

[personal profile] turlough - 2010-09-13 21:41 (UTC) - Expand

(no subject)

[personal profile] turlough - 2010-09-14 17:27 (UTC) - Expand

(no subject)

[personal profile] timeasmymeasure - 2010-09-13 21:32 (UTC) - Expand
fu: Close-up of Fu, bringing a scoop of water to her mouth (Default)

[personal profile] fu 2010-09-16 05:49 pm (UTC)(link)
Hm, you know I think the colors would work fantastic as categories in the actual style browser too. Do you mind if we take the list that you all come up with? :-)

(Also, this post is awesome -- you rock, thank you!)

[personal profile] 2d 2010-09-26 01:37 pm (UTC)(link)
Thank you so much for this information. I have had to customise my page to monochrome, to make it safe for work. If I knew anything at all about creating more such styles, that would be fun and I could contribute. I'll continue to rely on other people's genius.
silverflight8: bee on rose  (Default)

[personal profile] silverflight8 2010-12-30 03:43 am (UTC)(link)
This is sooo late, but thanks for putting it up - there's lots of useful stuff here!
trifarashi: (Default)

[personal profile] trifarashi 2011-04-07 06:01 am (UTC)(link)
i would to ask...
in Lj...u ca put pics at the sidebar...
how to do it at DW??
and...
can DW also do the same thing like Lj...
where u can put ur customized header...

(no subject)

[personal profile] trifarashi - 2011-04-07 11:55 (UTC) - Expand
editornia: (Default)

Help! Please?

[personal profile] editornia 2011-04-07 01:39 pm (UTC)(link)
Hi, I'm an LJ-er with a question for you, since you seem to know about LJ styles & things: how on earth do I make an LJ-cut without the LJ? What code do I use?

(I've only had a DW account for 2 days, but I've been on LJ for almost 5 years). I feel a little lost and clueless!

Re: Help! Please?

[personal profile] editornia - 2011-04-07 13:53 (UTC) - Expand
vkryukov: (Default)

[personal profile] vkryukov 2012-10-31 07:03 pm (UTC)(link)
How to import "Notepad" style (see http://vkryukov.livejournal.com/) to DW from lj?