Heal Your Church WebSite


Teaching, rebuking, correcting & training in righteous web design.

Working with the WordPress theme Vigilance 1.16

I’ve been a bit dissatisfied with the HealYourChurchWebsite look-n-feel since early this summer. After a lengthy search of various WordPress themes, I’ve settled on Vigilance 1.16. Here are some of the reasons why along with some of the things I discovered and/or did to make it more suitable to my tastes.

What I was looking for:

I was looking for a 3 column theme that had a clean look, was configurable, and wouldn’t put be behind the 8-ball with later versions of WordPress.

I also wanted to avoid one of these themes offered by various and emerging “clubs” as they tend to focus more on ad revenue generation than providing one’s users with the ability to get things done.

In my case, my users want to get these things done:

  • aggregate my posts with ease
  • find stuff to help with and/or addresses specific issues
  • quickly and easily link and/or copy the title or content on their blogs
  • print my posts and read them offline and/or nail them to the door of their church

Some other themes I considered were:

Ashford
I had a hard time NOT using this theme. Under the hood, it is very well thought out and implemented. That said, it is suited to a slightly different audience than mine – that is small organizations or businesses and not so much individual webmasters and developers. That said, don’t be surprised if I make the switch to it one day – or at least implement it immediately on other projects.
DarkZen
From the folks at Daily Blog Tips, this theme had many elements I liked, but there were just too many sacrifices of semantic markup for SEO and/or layout to make me want to use this long term.
Copyblogger
Another theme that had many elements I enjoyed, but to me had too many ‘highly styled’ element treatments that to me, made implementation of any custom CSS a bit more hassle than I wanted.
LivingOS UPSILON
Similar to Ashford, this theme was better suited towards church and charity websites. That, and while it did have several SEO-centric elements, there was enough there that I wanted to re-code or customize that made me look elsewhere.
Fresh Editorial
Again, an attractive theme that while nice, would have locked me into some renderings that would just drive me a bit bananas.

There were other themes but the above list themes I might use for other projects – and just what type of stuff I want to get into or avoid for a personal blog such as HYCW; including:

  • Has a good WordPress Admin/Configuration screen or screens
  • Is easily modified via CSS and through the Vigilance Child Theme
  • Does not sacrifice usability for SEO visibility
  • Is coded clean and clearly enough in PHP that I can confidently make modifications
  • Shows a history of active updates, participation, and interest
  • offers easy upgrades

Oh yeah, one other big thing I was looking for:  easily allow my users execute on the actions and/or activities they desire, need, and seek.

Oh yeah, one other big thing I was NOT looking for:  force me to sell my first born child into some SEO club.

How I made it work:

Having some time over this past holiday weekend, I figured it was time to bite the bullet and make it happen. Here are some steps you may find useful:

Install the theme

cd wp-content/themes
wget http://themes.jestro.com/vigilance/vigilance.1.16.zip
unzip vigilance.1.16.zip
wget http://themes.jestro.com/vigilance/wp-content/uploads/2008/09/myvigilance.zip
unzip myvigilance.zip
cd myvigilance
nano style.css
nano vdean.css

As you can see, ‘myviligance’ is the name for the basic child theme for Vigilance – which I immediately took advantage of that by adding the following to the file /wp-content/themes/myviligance/style.css:
@import url("vdean.css");Oh Sure, I could have just added all my code into style.css directly, but I just felt more comfortable working this way – and was glad myviligance was set-up in such as way that I could.

Configuring the Theme

First stop was the vigilance options panel, which is immediately available after you select the “myvigilance” child theme as your default:

With it, I was able to modify things such as:

  • Layout and Colors
  • Top Banner Image
  • Alert Box
  • Sidebar Image
  • Sidebar Feed Box
  • Footer

Then using Chris Pederick.com’s Web Developer extension for FireFox, I got busy with the CSS:

What I did was make test changes I previewed in the “Edit CSS” panel of the Web Developer extension – then once satisfied, physically modified vdean.css either through the command-line editor on the actual Linux platform … or the CSS “Theme Editor” link provided via the WordPress “Design” tab.

Hacking the Theme

Hey, what red-blooded coder with 25 year’s experience isn’t going to make some code changes here-n-there?

  1. I moved the tags to the bottom of the post. I know it’s less SEO friendly, but it is ALOT friendlier to my readers whom use tags as a way of finding related articles. I also added the CSS class “post-tags” to the markup for easier modification: <p class=”post-tags”>
    … Said changes needed to be made in index.php, page.php and single.php. Perhaps the use of an include file can consolidate this in future iterations of the program?
  2. Downloaded and modified some of the colors of some of the icon images.
  3. Uploaded a number of header images to rotate.
  4. I moved the admin edit link to the top of the post, which is generally where I need it and look for it. I also gave it the class “edit-this” for easier management later:  <?php edit_post_link(‘Edit This’,'<p class=”edit-this”>’,'</p>’); ?> … Likewise, changes were required in index.php, page.php and single.php.
  5. In sidebar-feedbox.php, I added the class ‘rss-feed-title’ to the header tag.
  6. install the Social Bookmarking RELOADED plugin in place of the Gregarious social bookmarking plug-in that stopped working after v2.3 of WordPress.
  7. in search-form.php, I added the class ‘search-form’ to the header tag.
  8. Then in sidebar.php, searchform.php, and sidebar-feedbox.php – I changed all instances of<h2> to <h3> because semantically, I just believe that’s the way God intended it.

While these hacks mean I’ll have to do the same for future releases, I’m at least hoping that the good folks over at Jestro.com will at least consider adding some additional classes to the header tags I cited above to make for easier CSS management of various elements.

Conclusion

There’s enough available out-of-the-box with Vigilance 1.16 that most webmasters of church and/or charity websites could use it out-of-the box. And whle the same can be said for worth themes such as Tim Bednar’s Ashford, I’m hoping my choice – when finally tweaked to perfection – will provide my particular user-base the best interface needed for their required activities.

Until then, I’ve still got ALOT of modifications I need to finalize. For example, I’m not pleased with my treatment of hyperlinks, image/caption boxes and/or a few other elements associated with the post layout.

Still, this is all managable through the CSS file at this point – so suggest away.

7 Comments

  1. Okay my whole goal in Ashford development will be to make you switch. Blessings.

  2. I dunno yet, right now I think I like the old look better.

    BTW – Here at work with a fiber optic connection, the page loads are pretty long using FF 3.

  3. Hi Tim – I still have a test-bed/proof-of-concept site I’m going to employ soon … Ashford is already slated as the driving theme.

    Hi Doug – I’m tired of the old theme, but no excuse for me forgetting to turn back on caching. Apologies for that one. Speed should now be … um … back up to speed.

  4. Pingback: Liturgical Wordpress, part deux | Ted Carnahan

  5. Pingback: Viola! New Theme! | Ted Carnahan

  6. Pingback: New Theme | Andy Regan

  7. Anyone where I can start my own blog.