Customizing Write.as

The Editor

What light fits your words? The editor gives you a simple choice in how you write.

Your Blog

To customize your blog, as a registered user go to your Blogs page and click customize under the blog you want to change. You can change your blog's:

• Title (e.g. Jane Doe's Blog)
• Description / tagline (e.g. A blog about my life)
• URL. This is how readers and search engines find your blog.
  • Path (e.g. write.as/jane)
  • Subdomain (e.g. jane.writeas.com)
  • Your own domain (e.g. janedoe.com)
• Publicity level. This makes your blog more private or public.
  • Unlisted - public, available to anyone with the link to it
  • Private - only you can see it
  • Password-protected - only those with the password can see it
  • Public - shown and promoted on read.write.as (learn more)
• Display format. This changes how your blog is laid out.
  • Blog - dates are shown, with most recent posts listed first.
  • Novel - no dates are shown, with oldest posts listed first.
  • Notebook - no dates are shown, with most recent posts listed first.
• Custom CSS. This gives you full control over the style of your blog.

Custom CSS

If you can write CSS, you can customize the appearance of your Write.as blog.

The following stylesheet shows a few basic selectors you'll need in order to customize certain elements. In the BASICS section, just grab the selectors (e.g. #blog-title a:hover) for your stylesheet — the properties are only there to illustrate what you can do.

You should copy entire sections in the RECIPES section verbatim, as each is a complete customization you might want to make, like centering an image.

/* 

    BASICS
    Use the following CSS rules to change the elements you're trying to customize.

*/

body {
    background-color: #efefef;
}

/* Blog header on index and post pages */
#blog-title a { 
    color: #fff;
    background-color: #7a629d;
}
#blog-title a:hover { 
    color: #eee;
    background-color: #7a629d;
}

/* Blog header on post pages ONLY */
body#post #blog-title a {
    padding: 4px 8px;
}

/* Blog description (underneath title) on index page */
header p.description {
    font-style: italic;
}

/* Post titles on blog index */
.post-title {
    font-weight: normal;
}
.post-title a.u-url:link, .post-title a.u-url:visited {
    color: blue;
}

/* "Read more..." links */
body#collection a.read-more {
    text-decoration: underline;
}

/* Links inside blog posts */
article p a {
    color: #444;
    text-decoration: none;
    border-bottom: 2px solid orangered;
}
article p a:hover {
    background-color: orangered;
    color: white;
    text-decoration: none;
}

/*

    RECIPES
    These are common patterns you may want to use on your blog.

*/

/* Center images */
img {
    display: block;
    margin: 0 auto;
}

/* Disable post header fade effect */
body#post header
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
}

/* Hide post views */
header nav .views {
    display: none;
}

Static pages

Create static pages, like for an "About me" or "Contact" page, by pinning any existing post on your blog. It'll be added to your blog's navigation bar, like this:

To make a page back into a regular post, simply navigate to that post and press the Unpin button at the top of the page.