Sridhar Katakam

Genesis and WordPress Tutorials

Filterable Portfolio in Digital Pro

by 6 Comments

In the comments section of Filterable Portfolio in Altitude Pro using Isotope tutorial, a user asked:

I’ve used this code to add a portfolio on the Digital Pro theme. What would I need to edit to add the Title on hover?

Thanks!

In this article I share the steps for setting up filterable portfolio archive page in Digital Pro with entry titles appearing on hover. We shall use Isotope jQuery script for filtering.

Screencast:

Screenshots:

Desktop:

digital-pro-filterable-portfolio-desktop

When hovered:

digital-pro-filterable-portfolio-hover

iPad Portrait:

digital-pro-filterable-portfolio-iPad-portrait

iPhone Portrait:

digital-pro-filterable-portfolio-iPhone-portrait

Step 1

Install and activate Portfolio Post Type plugin.

Step 2

Go to Portfolio > Add New Item and add your Portfolio items. Set a Featured image for each.

We are going to set a placeholder image from the images directory to be used in case an entry does not have a featured or attached image.

Step 3

Add the following in Digital Pro's functions.php:

To view the full content, please sign up for the membership.

Already a member? Log in below or here.

  • Whoot! We are on the same wavelength. I JUST asked this question in the Facebook genesis group. It’s like Chinese food delivery in NYC. Food delivered before you hang up the phone. THANKS!!

    Reply

  • Thank you for this. I’m having one small issue. I added a background color to .portfolio-content .entry .item-hover so the rollover is on a solid colored background. However, there is a small strip (about 5px) on the bottom of each thumbnail that doesn’t get covered and the original photo shows through. Any ideas on how I’d fix this? TIA.

    Reply

  • Hi Sridhar,
    I have just setup a site with this Tutorial, worked fine… or almost, I have some small problems, so I maybe you can help me out?
    I would like to link to single categories on this site http://genesis.lindebjerg.de/en/portfolio_category/print/
    How can I setup a single category template to show single Portfolio categories too. The Headline and Intro text are behind the content, how can I move this to above the portfolio category content?

    Best Regards,
    Jesper

    Reply

    • Thanks for your fast feedback on Slack. After this small Update; the Tutorial works fine with single Portfolio categories too:-)

      Reply
    • >