ReadyMade is getting in on 30 Days of Creativity—which means we’re making something every day during the month of June! Read more about the initiative here. And check out what we made today:

"I have an online portfolio which serves as what I hope are 'highlights' of my writing and editing experience (there's the homepage, above). Which is great, though I felt using this site to catalog all of my work in total would be too overwhelming. Still, I wanted a place where I could log everything I’ve written, and keep it up to date, so I don’t have to keep spamming people with links.

The solution: Tumblr!

Tumblr is so so so easy to make look decent, and it’s the easiest self-publishing web platform I’ve encountered yet. On top of that, it’s pretty simple—though time consuming, so be patient—if you want to add personal design touches. First, sign up. To customize your Tumblr, first search for a theme you like (I Googled 'tumblr + minimalist + best + 2011 + free'), and then implement it as your page. If it’s still not quite right, go to your home page and hold Control + click (or right click for PC) and select 'View Source.' Here is the CSS style guide to everything that goes into making your page look the way it does.

Copy all of this. Go into your Tumblr dashboard, select 'Customize,' and click 'Advanced.' Paste all of your code into the box that says 'Add Custom CSS.'

You don’t have to be a programmer or a designer to start to make sense of all the code you’re looking at; you just have to have a mind for logic and patience. Start poking through, and make one small change at a time, making sure you have some sort of clipboard where you're saving original code. I start with text colors, as that's the easiest way to find out where 'sections' of code are designated on your page. You change the color with a hexadecimal code (that's a fancy way of saying 'six numbers/letters that determine a color'), which you'll know because you'll see something like this:

#Header h1 a { color:#4C6DA6; }

That's nerd code for 'The headline will be blue-gray.' Change that color# using a hex color code generator, hit 'Save,' and see what happened.

The more you poke around, the more you'll notice where certain images are saved that make up the design element, and if you have your own image hosting site, you can substitute in your own image URLs to take the place of what's in the template. Again, it's not difficult if you're not a computer whiz--you have to just keep doing one small thing at a time, making note of what happened, and not getting scared if it looks all crazy. Some people use web development clipboards like Firebug, and I have a feeling that might make life a lot easier, but I like to just jump right in there and treat the experience like a puzzle.

Here's what the template for my page looked like to start with:

 

And here's what it looks like now:


Anyone else have tips? Or links to Tumblr pages they've customized?" -Online Director Liz Armstrong

Jump on the 30 Days program with ReadyMade by sending a tweet to @createstuff on Twitter. And don't forget to follow ReadyMade on Twitter for a daily stream of DIY projects and ideas! 


6 Comments