Saturday, April 08, 2006

Maintaining the template offline

For some of you this really will be obvious ... for some it will not ...

BLOGGER:

For template maintenance Blogger provides a Template Editor:

Blogger Dashboard > Template > Edit current

You can use this window to change the template and hit the Preview button to view the results.
Apart from the fact that the result isn't 100% reliable, this is a good feature.

A faster and easier way is to bring this process to your kitchen table: OFFLINE!

The Workspace:

  1. copy the template code and save it in a file, like
    My Documents/My eBooks/blog.html

  2. Open blog.html in your browser
    File > Open file > blog.html (= Ctrl+O)

  3. Open blog.html in Notepad
    Right Mouse click > Open with > Notepad

  4. Arrange both windows side-by-side on your desktop!

The Edit process:
  1. Edit your blog.html in Notepad and save with Ctrl+S

  2. reload the page in the browser - use the Reload current page icon or Ctrl+R

  3. and again ... and again ... and again ... (you can instantly view every small change in a split-second!)

  4. Copy and Paste the final code in the Blogger Template Editor and Republish the blog
Advantages:
  1. Using shorthand keys makes the preview process really fast;

  2. You are working offline, so there's no worry about accidently shattering the real thing :-)
    And, as stated above, this is fast, safe and easy "trial-and-error"!

  3. You are not depending on Blogger here ... less waiting, I mean.

  4. When you only want to change your styling you can work with the code of a generated page (like in the example image above).
    Looking at a real flesh&blood page may help you to get the wanted result faster!


  5. open your blog

  6. Right Mouse click > View page source > Copy and Paste source code to blog.html

  7. Make your changes in the STYLE section of blog.html and view the results

  8. When done, copy the STYLE section
    (that is <style type="text/css"> ... </style>)
    to your template

  9. Republish the blog ...

OTHER BLOG MANAGEMENT SYSTEMS:

When using WordPress, Serendipity, etc. or a real CMS (like Exponent, Joomla, whatnot) working offline is even more essential.
A very easy-to-use and reliable way to get yourself a working APACHE + PHP + MySQL environment is installing XAMPP on your very own local machine!
I suppose people who are able to work in an environment like this know what they are doing ... so here's just a few notes:
  1. WordPress provides a tutorial for Installing XAMPP and WordPress!

  2. The XAMPP Lite version will do!

  3. Easy as Breathing

XAMPP Lite is a very reduced version of XAMPP with Apache 2.2.0 + PHP 5.1.1 (without PEAR) + MySQL 4.1.18 + PHPMyAdmin 2.7.0-pl1 + Openssl 0.9.8 + SQLite 2.8.15 + eAccelerator 0.9.4. For lovers! For the lite versions exist no upgrades or addons. XAMPP Lite is an only "Take-Run-Delete-Forget-it" package.

5 comments:

daveojeda said...

First of all thank you for all the great info on your blog and in the blogger forum. I used your Minima_original_3col template copied it directly into my test blog named below. The first post title is correct in the middle but the text is far down. I tried it on other computers but it still looks the same. If you have the time please let me know what I may have done wrong on the copy of the template.

http://testblack.blogspot.com/

Bonnie Calhoun said...

Thanks for the great advice on maintaining templates!

I've been using one of your templates tb_b_20050917_tan.dwt for quite a few months now. I just love, love, love it!

I played with it, ever so slightly and i find your code very easy to work with. Visit my blog when you have time!

vin said...

Great templates

Three columns templates occupying full screen cause the middle column to be quite wide. Is there a way of adding one more column of 200px so as to reduce width of main column to look like that main column in standard blogger templates?

How to use the full real estate of the screen but keep the main postings column to its standard width?

Carl Galloway said...

Great article, in fact I use Xampp to test my Serendipity templates, I recommend it to anyone who wants a test server on their own PC.

With Blogger templates I've been doing the same as you suggest, and it works really well.

Anonymous said...

This is such a simple but excellent bit of advice. I am still new to web design and computers generally, only starting in June 2006, so most of what I do is through trial and error. Especially when it comes to changing style settings. This will save me a lot of time hopefully!

Cheers,

Jon.