Small Steps

In the right direction

Setting Up Octopress

| Comments

This post will try to explain step by step the installation of octopress, how to deploy the result to dropbox and finally host it with kissr.

Since I use a MacBook, all my steps will be based on OS X as operating system, but my guess is that with some small adjustments you’ll do fine with whatever you use. Also I’ll be reusing current installation guides (why reinvent the wheel!?) as much as possible only adding adjustments needed to make it run.

1. Install

Time to install needed software and create accounts.

1.1. Octopress

Octopress has a nice short installation guide that explains what you need. One small thing is that if you like to be able to use the current ruby version (as of writing this it’s: 1.9.3p194), you should run:

(It also fixed a problem i had of running the current version of bundler with 1.9.2p290).

Using rvm:

1
rvm install 1.9.3-p194 && rvm use 1.9.3-p194

Now that you got the latest version of ruby let’s make sure to use it.

1
2
3
cd \path\to\your\octopress\directory\
echo 'rvm use 1.9.3-p194' > .rvmrc
source .rvmrc

Using rbenv:

1
2
rbenv install 1.9.3-p194
rbenv global 1.9.3-p194

To verify that everything went okey with the install of ruby, run:

1
ruby -v

It should respond with: ruby 1.9.3p194 (2012-04-20 revision 35410)

1.2. Dropbox

Just go to the dropbox site, download and start/follow the installation. Don’t forget to create an account!..

1.3. Kissr.co

Go to kissr. Check if the domain your want is available, if so click try it and follow the instructions.

If everything goes as it should you now have everything needed to deploy your own free site on kissr.

2. Configuration

Some config is needed before you can create your first blog post.

2.1. Octopress

Before you can make the first blog post you need to configure the site. Some social media applications are supported as addons/plugins and it shouldn’t be too hard to add support for others if needed (someone might have done it already).

3. Create content

Now that you have everything running, it’s time to change the default page kissr created for you during install and create our own first blog post.

3.1. Octopress

Blogging explains blogging basics. I highly recommend you to use POW to preview your site.

One thing I found out is that if you use zsh as your shell you will run into some trouble with some of the rake tasks. Read more about it at Travis Jeffery’s site for solutions.

Make a new post:

1
rake new_post["hello"]

Edit the generated markdown file with your favorit editor and add some content to it.

1
2
3
4
5
6
7
8
9
10
11
---
layout: post
title: "hello"
date: 2012-06-12 15:03
comments: true
categories:
---

Hello!

Welcome to my new blog.

Now let’s generate the page.

1
rake generate

Preview it with POW or the local built-in preview.

3.2. Dropbox/Kissr

Great you now got a local version of your blog, but what now? Well it’s time to deploy it to Dropbox/Kissr.

While creating a Kissr account/domain it added a folder structure in your dropbox folder.

1
\path\to\dropbox\Apps\KISSr\<your domain>.kissr.co\

You’ll find that Kissr have auto generated some content here for you. Since you want to use octopress, you don’t need anything kissr has generated for you. So let’s remove it! (make sure that you’re at the right path!)

1
rm -rf *

Time to copy the generated content in \public to your kissr domain.

1
2
cd \path\to\your\octopress\directory\
cp -r public \path\to\dropbox\Apps\KISSr\<your domain>.kissr.co\

Since humans are lazy we don’t like to repeat manual work, so why not automate it a bit.

You could make a script file:

1
2
echo 'cp -r public \path\to\dropbox\Apps\KISSr\<your domain>.kissr.co\' > deploy.sh
chmod +x deploy.sh

Or even better add a rake task to your Octopress Rakefile:

Rakefile
1
2
3
4
5
6
7
8
9
10
desc "Deploy website to kissr"
task :kissr, :destination_path do |t, args|
  if args.destination_path
    path = args.destination_path
  else
    path = get_stdin("Enter the full path for your local dropbox/kissr directory: ")
  end
  puts "\n## copying #{public_dir} to #{path}"
  cp_r "#{public_dir}/.", path
end

To use it:

1
rake kissr[\path\to\dropbox\Apps\KISSr\<your domain>.kissr.co\]

4. Conclusion

Making a simple but fully functional nice looking static blog is fairly easy to do with Octopress/Dropbox/Kissr. I hope this post will help you creating your own without too much work. Best of luck and see you soon.

Final note, you might want to check out Theming & Customization to read about how to customaize your blog. For premade themes checkout: List Of Octopress Themes.

Comments