• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2784

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Consultation
  • Full Access
  • Log in

How To Add A Second Portfolio Page To Genesis

Some StudioPress themes already include a portfolio page built into the child theme. Most use a custom post type however it can only be used to create one portfolio.

If you want more than one portfolio, then this tutorial is for you.

In this exercise, we’ll be duplicating the existing portfolio page used in the Minimum child theme.

Duplicating Existing Portfolio Page

Here’s a summary of the steps you’ll need to take:

  • Copy & rename both archive-portfolio.php and single-portfolio.php files
  • Copy & rename portfolio custom post type in functions.php file
  • Copy & rename add new image size in functions.php file
  • Copy & rename CSS code for portfolio classes in style.css file

You can either manually rename the code or use a text editor like Notepad++.

I used Notepad++ to search and find all code with the name ‘portfolio’ and replaced it using the name ‘second’.

Note: Please copy all code using the view raw link and paste it using a code editor.

Update: Here’s an easier way to convert category archive pages into portfolio style archive pages using the Balance child theme

Second Portfolio Archive Template

Here’s the code which needs to be pasted in a new PHP file named archive-second.php

Second Portfolio Single Template

Here’s the code which needs to be pasted in a new PHP file named single-second.php

Rename Portfolio Custom Post Type

This code also includes the new support for CPT archive pages included in Genesis 2.0

Second Portfolio Image Size

This code needs to be pasted in your child themes functions.php file.

Display Number Of Portfolio Items

Add this code in your child themes functions.php file to determine exactly how many items to display on your portfolio archives page.

Duplicate Second Portfolio CSS Code

Paste this code at the end of your child themes style.css file.

You could simply duplicate each CSS rule underneath the original rule and rename it using the second selector rather than paste all the code at the end of the file. This is the method i used to test it worked properly.

Themes Which Are 960px Wide

You will need to make changes to the CSS code if you want to use the code in this tutorial on a theme which is 960px wide.

Here’s the code you need to add to replace in your child themes style.css file.

Conclusion

I successfully completed the duplication of existing Portfolio custom post type without any problems however you may have to spend some time adjusting the CSS code for themes other than the Minimum theme.

Reader Interactions

Comments

  1. Supat Sutti says

    October 11, 2013 at 8:34 am

    This is what I want.. Now I become a big fan of your site.. Great tutorial..

    Supat

    From Thailand

    Log in to Reply
  2. Sandee says

    September 7, 2013 at 6:04 pm

    Hi, I’d love to change the URL for portfolio. Is there a way to force change the URL from mydomain.com/portfolio to mydomain.com/mybooks?

    Log in to Reply
    • Brad Dalton says

      September 7, 2013 at 6:34 pm

      Yeah. Change all instances of portfolio with mybooks in the PHP code in the functions file, template names and files as well as the CSS code and then resave your permalinks.

      Log in to Reply
      • Woohoo says

        September 19, 2013 at 1:15 pm

        Brad and Sandee,

        This can be done very easily.
        Change the rewrite in the functions.php to this:
        ‘rewrite’ => array( ‘slug’ => ‘mybooks’ )
        And now go to ‘Settings/Permalinks’ in wordpress and save the permalinks.
        Done!

        Log in to Reply
        • Brad Dalton says

          September 19, 2013 at 2:06 pm

          Thanks Woohoo.

          Log in to Reply
  3. Kendall says

    September 2, 2013 at 9:56 pm

    Copy & rename portfolio custom post type in functions.php file

    Your second step could use a little more detail. You say Copy and rename. Are you saying that the code should replace what is already in functions.php. Should it be added to what is already in functions.php? Thanks

    Log in to Reply
    • Brad Dalton says

      September 3, 2013 at 3:03 am

      Hi Kendall

      You don’t replace the code for the existing portfolio otherwise it will not work.

      You copy all the existing code and rename where needed so it creates a second portfolio page using unique i.d’s.

      So its added to the existing code.

      Log in to Reply
  4. Brendan Baker says

    June 22, 2013 at 10:54 am

    Hi Brad,

    Is there a way of adding the portfolio to a section of a homepage and not just a page by itself?

    Using the Minimum theme, I’m trying to add a portfolio section (3×7) underneath the 4 home-featured widgets and above the blog posts?

    Not sure how easy this is though…

    Log in to Reply
    • Brad Dalton says

      June 22, 2013 at 5:51 pm

      Brendan

      You could easily add a gallery of images which look the same as a portfolio and link each image to any custom links.

      Or you could add a new widget area in any hook position and use content columns for your portfolio images and titles.

      Another option is a custom grid loop.

      Some PHP coding knowledge will be needed in any case.

      Log in to Reply

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for Genesis, WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
  • Tags