Ever since I started to focus on Berchman.com I realized that my former “company” website, HamiltonBerchman Design Group, Inc., was no longer maintained, correct, or relevant. However, at the time I was fortunately too busy to even think about doing anything to the site.

Then one day I was doing research on a project and stumbled across a free portfolio template that stood out to me in more than one way. The template is called medifolio, by Dirk Leys who generously posted it online. I was particularly drawn to the “sliding” action when you click on a portfolio thumbnail image, and the return to the main page. There was a simple elegance to the whole thing. I looked at it and thought, “how can I do this type of page in WordPress and Thesis?” The original medifolio is a single, flat html page. How could I generate all the content, in the right order, with the right tags and syntax? I thought about it a while. A long while.

In the time since I first saw medifolio I was working on a client project requiring the listing of individual portfolio pieces, complete with images and text. It required a complete custom solution. By creatively using categories as parents I created blog posts that then occupied specific categories. I could then create custom loops to not only create a listing of the portfolio pieces at the top of the page, but I could have them link to the actual full description and image display further down the page (by using custom generated anchor links). You can see the work in action here on the website ckwrites.com. There are four custom lists generated across the top of the page after introductory text. All done within WordPress and Thesis with categories and custom page templates, and custom loops.

Since I had completed design and development of ckwrites.com I looked back at medifolio and the previous experience lent itself directly to making medifolio a reality. After some long nights tinkering with custom php and css solutions I got the basic page to work as the original static medifolio page. All the content was being dynamically generated from individual posts for each and every portfolio piece. All the tags, divs, etc. were being dynamically generated as well.

Once I had a basic working model the next thing to do was to implement. I’ve done this right now in two places where it lives, live on the Internet. The first implementation was at HamiltonBerchman Design Group, Inc.

I set out to rework, or basically remove, all the non-relevant content from the website and was left with a stripped down, single web page that tells what the current state of affairs is, and shows a sample of work that I completed in my time operating HamiltonBerchman Design Group, Inc.

Once I had this complete, I wanted to take it to another place and that was on the Dennison+Wolfe Internet Group website where I am a partner. This implementation allowed me to refine and rethink some things to how the portfolio is implemented.

I think both of these came out looking quite nice.

It will be a part of the new, upcoming Berchman.com redesign.

My next step, I think, is to clean this up, write a tutorial on how to implement this, and release it on an “as-is” basis. What does that mean? It means if you want it, download it, and figure it out.

That is what I had to do.

Let me know what you think.

I have been busy on many projects recently. What is great is I am ready to share them and the new things I’ve learned with Thesis and WordPress. My two most recent projects made me push my personal envelope of what I thought was possible within the WordPress/Thesis environment. Not that I’ve ever had any doubts, rather just plain figuring out “how the h*ll are you going to do this?“—and then doing it. So much fun.

Over the next few weeks I am going to share the projects, their scope, the questions presented, and their solutions. Not every project will go into minute detail, but I will give you enough info to maybe help you figure out how to do your own solutions to your own WordPress/Thesis challenges. I’ve noticed in the time that I’ve been using Thesis there are more and more people trying it out, and trying to do-it-yourself, which is great. I have found that its not a perfect fit for everyone but if you’re like me the fit is great and learning never ends. So stay tuned to see the projects.

Also, I’ll let the cat out of the bag and now state that I have a new website design for berchman.com coming soon (design is done and now in CSS) along with a custom portfolio solution rolled right into WordPress/Thesis. There is a fair amount of setup and labor in this process (basing things off an open-source solution), but I think the end result is clean and attractive. Thinking about doing a detailed tutorial and maybe releasing everything into the open. We’ll see what my time looks like. I’ve had very little time to write tutorials, or anything for that matter. But believe me there is lots to share and I’m hoping time will cooperate with me.

That’s it for now. Summer is here and I hope yours is going well.

In today’s information overloaded, fast paced, digital lifestyle there can be little opportunity to pause and reflect. The mindset of “just have to keep up” can dominate one’s thinking if your are not careful. Every once and a while I get present to the fact that I spend too little time “reflecting” on things be they family, work, and life in general.

I’m soaking in it.

Like the image above, (I am showing my age and if you know ‘Madge’ you are too), sometimes you may find yourself “soaking in it” and not knowing what is going on, or the benefits of what you are in the middle of doing. Being a married, father of  3 boys, self employed business owner/pixel pusher can impose virtual blinders that, if I let it, will limit what I know, see, and what is possible.

So why am I rambling on about this? Recently I became aware of just how much I am soaking in it. My ‘inner Madge‘ woke up and reminded me of what was going on. And sharing this with others might remind them to stop, look around, and take stock.

I set some measurable goals at the end of 2009. These were goals I mentally planned on completing by the end of  the first quarter of 2010. Well guess what? Today is the start of the second quarter of 2010. And those three goals? Not met. I went through piles of paperwork over the weekend and found them written down. I got them out of my head not just as ideas and things to do, but completely out of my head. I was soaking in it so completely that I lost track of these goals.

What are, or were, the goals?

• Publish new WordPress/Thesis tutorials based on recently completed projects
• Design, develop, and publish a visual overhaul to berchman.com
• Release a free Thesis portfolio theme

I had planned on these three things to be completed yesterday.

So what’s the lesson in all this?

Two things:

1. Use your systems. These three goals were never put into project tracking systems I use and broken down into smaller, manageable tasks (basic productivity, duh). I am remedying that THIS quarter.
2. Reflect more often. I failed to check in with myself on personal projects. All things in the client and family world are moving along quite well. I dropped the ball on myself.

Reflection time is over. I will now return to my regularly scheduled program.

Get back to work.

You always experience feelings when you return to work after being away for a week. Whether anxiety, dread, excitement, clarity, fatigue, surprise, etc. you are feeling something. Typically I feel anxious and the feeling of overwhelm can be gigantic–but not this time. I feel different than usual in a way that I have yet to fully understand. It’s not anxiety, it’s a calm. What I do know is that something is different and I need to get back to work.

You always have a good vacation when you actually vacate. This means not working over vacation. No checking email. No replying to text messages and voicemails. I took this to heart for the first time in a long while.

I spent a week away from routine, a week away from ruts.

• I stayed offline
• I ignored my cellphone (except non-work)
• I slept
• I ate and drank well
• I hiked
• I went sledding
• I built a snowman
• I spent time with my wife
• I went skiing with my kids
• I had a snowball fight with them too
• I cooked
• I read and listened to audio books
• I watched the beginning of “March Madness”

Now I’ll be honest. I did have my moments during the week where I was in a psychological slump, but I would attribute that to my brain unwinding from the routine. On the day of my actual return back home I drove the whole way. Gave me time to listen to an audiobook called Rework that caused me to reconsider many things that I have been brooding over for quite some time.

• I can’t make every web idea I have come to life
• It’s OK to stop working at 5 o’clock
• People will not die if I don’t get a task done right away
• Things can wait
• Everything is not very important
• Worrying solves nothing
• There is enough time to get it done, but I need to prioritize
• Turn off distractions (yes that means you Twitter, Facebook, iPhone)
• Rest and time away from working is essential
• Be grateful

I’m happy to say that I am more relaxed returning  to work this week, and for that fact alone I am extremely grateful. Needless to say I am changing a few things.

I came across something while working with WordPress and Thesis that I know will help at least one person and possibly save them hours of frustration. So here is the tutorial.

I was working on a revision to a visual layout of a website I previously helped develop on the Thesis theme framework. I spent more time than I should trying to find out where the extra space between webpage elements was coming from. Was it the CSS? It had to be.

I checked the CSS using my editing tools. No extra margin, no extra padding, yet I still could not get page elements aligned the way I wanted. There was a mysterious “gap” between page elements. No matter what I tried with my CSS (other than negative margins—no bueno in this case) the gap would not go away.

I finally got smart and looked as source code—the html. Typically I get to the source code earlier in the process, but this time I thought all my issues were in CSS but they were not. The key to the solution lie inside the HTML.

I recorded the video tutorial below in hopes that it might help you. If it does, let me know in the comments.

Be sure to click on the small, 4-arrow button in the bottom right corner of the video (as shown in the graphic below) to see the video at full size. Hope this helps.

Click here to view the embedded video.

I knew about this video a while back when it was in production. I had read about it somewhere in an RSS feed, or was it Twitter?, or Facebook?, or LinkedIn?… anyhow I did know that this video was being created. Day before yesterday Seth Godin brought it to back to my attention. I took some time to watch the entire video and was really struck by these people who were handed the “pink slip” and in turn made something come of it. Each person has their own story, and you have the power to write the ending.

Watch this. If anything it will get you thinking.