Custom template for Portfolio archive page

[lijndiensten]

Hi Themeco,

Is it possible to create a (custom) archive template for the portfolio archives. We are looking to achieve a custom design for the portfolio pages that is different from the standard X-designs for (blog and portfolio) archive pages.

The current archive page
The desired design

Normally I would add a template like archive-template.php, which should be picked up in WP’s template hierarchy, but I am not sure how that works in X.

Thanks already!
Ivan

[rad]

Hi Ivan,

Thanks for reaching out.

Sure, it’s possible. Please check this https://theme.co/apex/forum/t/how-to-upload-xtheme-to-child-theme/43246/2 first as a starting point of how it’s normally done in X theme. More importanty, this one https://theme.co/apex/forum/t/customizations-best-practices/205

With that, you’ll have to create your own archive template within your child theme,

1. First duplicate the /x/index.php to /x-child/taxonomy-portfolio-category.php.

Then your taxonomy-portfolio-category.php should have this content

<?php

// =============================================================================
// PORTFOLIO-CATEGORY.PHP
// -----------------------------------------------------------------------------
// Handles output of pages and posts if a more specific template file isn't
// present. Must be present for theme to function properly.
//
// Content is output based on which Stack has been selected in the Customizer.
// To view and/or edit the markup of your Stack's index, first go to "views"
// inside the "framework" subdirectory. Once inside, find your Stack's folder
// and look for a file called "wp-index.php," where you'll be able to find the
// appropriate output.
// =============================================================================

x_get_view( x_get_stack(), 'wp', 'portfolio-category' );

2. Duplicate the /x/framework/views/{YOUR SELECTED STACK}/wp-index.php to /x-child/framework/views/{YOUR SELECTED STACK}/wp-portfolio-category.php

Then your wp-portfolio-category.php should contain this code along with your custom portfolio layout.

<?php

// =============================================================================
// VIEWS/INTEGRITY/WP-PORTFOLIO-CATEGORY.PHP
// -----------------------------------------------------------------------------
// Index page output for Integrity.
// =============================================================================

get_header();

?>

  <div class="x-container max width offset">
    <div class="<?php x_main_content_class(); ?>" role="main">

    <?php if ( have_posts() ) : ?>
    <?php while ( have_posts() ) : the_post(); ?>
    
<!--- YOUR CUSTOM CODE FOR PORTFOLIO HERE -->

    <?php endwhile; ?>
  <?php else : ?>
    <?php x_get_view( 'global', '_content-none' ); ?>
  <?php endif; ?>

    </div>

    <?php get_sidebar(); ?>

  </div>

<?php get_footer(); ?>

You can split your custom code to multiple templates which then you can place to any stack or global folder and just call them with x_get_view(). Unfortunately, I can’t provide further instruction on how your custom code will be, I recommend contacting a web developer to implement it.

Thanks!

[lijndiensten]

Hi Rad, thanks for the quick and clear response, work perfectly!

[rad]

You’re most welcome!