A new portfolio solution in more than one place.

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.

Do you need help with your website?

If you are a web designer or web developer needing help, or a 'do-it-yourselfer' looking for a professional Internet presence I can help. If you need help with a specific WordPress issue or a complete website, I offer consultation, complete web design, and web development services. Get in touch and we can talk about your needs and start the process.

, , , , ,

Do you need a WordPress consultant? Someone with experience?

I specialize in making WordPress work for people.

If you need help with a specific WordPress issue, I offer consultation, complete web design, and web development services.

Get in touch and we can talk about your needs and start the process.

  • Pingback: Tweets that mention New WordPress and Thesis Portfolio based on open-source design — berchman.com -- Topsy.com()

  • Bassscape

    Pretty impressive doing the medifolio with WordPress. I'd be interested to see how you achieved it. My only issue is that I haven't worked with Thesis very much – I should get with the times and embrace the world of child themes.

  • Richard Barratt

    That would be 'sweeeet'!

    You are far too generous (and far too far away for me to buy you a beer)

    🙂

    Thanks

  • Justin

    Yeah you totally know your sh!t.

  • Justin

    Yeah you totally know your sh!t.

  • Robert

    Hi there – thanks for the informative site!

    I'm trying to read some other posts and they all display a blank page (in FF3.6.6 and IE8):

    This is one I was trying to access:
    http://www.berchman.com/wordpressthesis-tutoria

  • tonyfleming

    I'm trying to access your tutorial on custom page templates, at http://www.berchman.com/thesis-tutorial-multipl…, but the page is coming up blank. Same for your Contact page, which is why I'm writing here. The source view also shows a blank page. Any other way to access it?

  • Hi Robert, Thanks for letting me know. Looks like I had a plugin issue come up for some reason. I was able to narrow it down and get the site running again. Take a look and let me know what you think.
    Thanks,
    Bert

  • Hi Tony, I was having a plugin issue. Was able to address it. Everything should be accessible again. Let me know if you have any questions.
    Thanks,
    Bert

  • Robert

    Yep, thanks Bert – its all good now, glad the issue was resolved for you … looking forward to some comprehensive reading … tnx for the great info.

  • Monique

    Thanks for the great website! It's an inspiration to see what you can do with Thesis and WordPress. Really appreciate your willingness to share your knowledge and ideas. I still have a lot to wrap my mind around to become better at developing these sites, but keeping my nose to the grindstone! Best! 🙂

  • Dougrek

    Agreed – love the very simple yet elegant slider effect. Looking forward to seeing how you did it. For those venturing into the Thesis waters, you are a gold mine.

  • Pingback: Personalized Hard Hat()