6 more themes for my dw layout
9 May 2009 11:50 pm![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
cimorene6 more themes for my original dreamwidth layout, Paper Me, which I posted yesterday here (same instructions, 13 other themes). Despite being a brilliant-colored creature at heart, I added some slightly more dignified/soothing/low-contrast/neutral color schemes (and also some brilliant, one might say neon-colored ones).
ETA: Font downloads now work!
Previews: Click the images to enlarge the screencaptures. Fonts won't show up on the live previews until you have them installed. Note: the fonts are freeware easily findable via Google, but I've uploaded them for convenience. Patterns generated at www.colourlovers.com.
Instructions:
1. Go to the Your Layers page. Under Create Layer - Create a Top-Level Layer, select Type: Layout and Core Version:2 from the drop-down menus. Click Create.
2. When the page reloads, your layer will be listed under Child of layer 550: Dreamwidth S2 Core, v2. Click Edit next to it.
3. Delete the two lines in the box. Copy all the text from here and paste it into the box instead. Click Save & Compile. (If you did it right, the box at the bottom should display "Compiled with no errors.")
4. Go back to the Your Layers page. Under Create Layer - Create a Layout-Specific Layer, select Type: Theme and Layout: Paper Me. Click Create.
5. Your layer will be listed under Child of layer [#]: Paper Me. Click Edit next to it.
6. Delete the two lines in the box. Copy the entire content of your chosen theme layer (below) and paste it into the box.
7. You're done if you don't want custom images for anything and don't want to change the fonts or colors! You can click Save & Compile and skip to step 11.
8. Colors: You can change the colors in the Customization wizard; after you save your style, just go to the Customize Your Journal Style page; the colors are under Style-Colors.
9. Image hosting; switching the wallpapers or replacing them with solid colors: You don't have to host the images you want yourself, but it will ensure that they don't vanish if my webspace goes down. You can also easily replace the wallpapers in the style with images of your own, or with solid colors. To replace the images, scroll down to where it says
and replace the url in parentheses with the url of your chosen images. The top image (body) is the background of the entire page. The bottom image (#primary) is the background of the box containing the entries. In order to replace either of the wallpapers with a solid color, delete the line "background-image: url();" and replace it with "background-color: #ffffff;".
10. Fonts: This layout uses three main fonts: the base font (currently Verdana for all themes), the header font on the entry titles and sidebar headers, and the decorative font at the top of the page (download links for these above with the previews).
11. After you've got it the way you wanted and clicked Save & Compile, assuming you've done it right, you should get "Compiled with no errors". If so, to use your new layout go to the Your Styles page. (If you're a basic user you can only have 1 style, so delete any other ones there.) Under Create Style, type in a name for your new style (for example, "paper me - playfully plummy by cimorene") and click Create.
12. Under Style Layers - Layout, select "Paper Me" from the drop-down menu and click Change. Then select your theme layer from the drop-down menu and click Save Changes.
13. Your new style should appear in the list of styles. Click "Use" next to it and you're done!
ETA: A DW codepush on 18 May rearranged the profile module; a patch to revert to the way it looked before is here, if you don't like it.
Notes:
1. Works at 1024px wide and up
2. Browsers Tested: Firefox 3 & Opera 9.64
3. Does not have custom comment pages
4. The username is under the entry title, not under the icon
5. This layout is based on Dreamwidth's style system core version 2, and will not work on any other sites.
ETA: Font downloads now work!
Previews: Click the images to enlarge the screencaptures. Fonts won't show up on the live previews until you have them installed. Note: the fonts are freeware easily findable via Google, but I've uploaded them for convenience. Patterns generated at www.colourlovers.com.
Crush (FirstCrush in header, lowercase Century Gothic in sidebar)1. New Leaf
live preview2. Teal, Dear
live preview
Curlicue (akaArcade in header, Arial in sidebar)3. Lime Thyme Management
live preview4. Silverquin
live preview
Soothing (Riesling in header, Arial Narrow in sidebar)5. Mon Ami
live preview6. Smoke on the Water
live preview
+ Alternate wallpapers in the Soothing colorschemes (click on thumbnails to enlarge):
There are a variety of extra wallpaper patterns in the stripe, diagonal, wavy, brocade and harlequin patterns (both with and without light versions) in various color schemes here.
Instructions:
1. Go to the Your Layers page. Under Create Layer - Create a Top-Level Layer, select Type: Layout and Core Version:2 from the drop-down menus. Click Create.
2. When the page reloads, your layer will be listed under Child of layer 550: Dreamwidth S2 Core, v2. Click Edit next to it.
3. Delete the two lines in the box. Copy all the text from here and paste it into the box instead. Click Save & Compile. (If you did it right, the box at the bottom should display "Compiled with no errors.")
4. Go back to the Your Layers page. Under Create Layer - Create a Layout-Specific Layer, select Type: Theme and Layout: Paper Me. Click Create.
5. Your layer will be listed under Child of layer [#]: Paper Me. Click Edit next to it.
6. Delete the two lines in the box. Copy the entire content of your chosen theme layer (below) and paste it into the box.
1. Crush - New Leaf 2. Crush - Teal, Dear 3. Curlicue - Lime Thyme Management 4. Curlicue - Silverquin 5. Soothing - Mon Ami 6. Soothing - Smoke on the Water
7. You're done if you don't want custom images for anything and don't want to change the fonts or colors! You can click Save & Compile and skip to step 11.
8. Colors: You can change the colors in the Customization wizard; after you save your style, just go to the Customize Your Journal Style page; the colors are under Style-Colors.
9. Image hosting; switching the wallpapers or replacing them with solid colors: You don't have to host the images you want yourself, but it will ensure that they don't vanish if my webspace goes down. You can also easily replace the wallpapers in the style with images of your own, or with solid colors. To replace the images, scroll down to where it says
body {
background-image: url(http://...);
background-position: top center;
background-attachment: fixed;
background-repeat: repeat;
}
#primary {
background-image: url(http://...);
background-position: top center;
background-attachment: fixed;
background-repeat: repeat;
}
and replace the url in parentheses with the url of your chosen images. The top image (body) is the background of the entire page. The bottom image (#primary) is the background of the box containing the entries. In order to replace either of the wallpapers with a solid color, delete the line "background-image: url();" and replace it with "background-color: #ffffff;".
10. Fonts: This layout uses three main fonts: the base font (currently Verdana for all themes), the header font on the entry titles and sidebar headers, and the decorative font at the top of the page (download links for these above with the previews).
- To change the base font, scroll to where it says
##==============================
## Font
##==============================
set font_base = "Verdana";
set font_fallback = "sans-serif";
and change "Verdana" to the name of the font you prefer. "Font Fallback" should be a font family such as sans-serif or serif. - To change the header or page title fonts, scroll to where it says
/* --------------------- Page header, entry titles, sidebar nav, & sidebar headers -------------------- */
/* Header */
h1, h5 { font-weight: normal; }
/* Journal title */
h1 {
font-family: YOUR FONTS HERE, $*font_fallback;
For the main title, replace YOUR FONTS HERE under "Journal title" with the font you prefer. For the other headers, replace YOUR FONTS HERE under "#secondary .module header..." (2 paragraphs down) with the font you prefer.
11. After you've got it the way you wanted and clicked Save & Compile, assuming you've done it right, you should get "Compiled with no errors". If so, to use your new layout go to the Your Styles page. (If you're a basic user you can only have 1 style, so delete any other ones there.) Under Create Style, type in a name for your new style (for example, "paper me - playfully plummy by cimorene") and click Create.
12. Under Style Layers - Layout, select "Paper Me" from the drop-down menu and click Change. Then select your theme layer from the drop-down menu and click Save Changes.
13. Your new style should appear in the list of styles. Click "Use" next to it and you're done!
ETA: A DW codepush on 18 May rearranged the profile module; a patch to revert to the way it looked before is here, if you don't like it.
