Customized different Portfolio Page - Home Page and Project Page

Hi Shapely Team,

I’ve created the website

I’ve figured out how to make different portfolios pages, however after updating to the new version I ran into some problems.

Could you please help me:

1- The Portfolio section in the Homepage, I have use your plugin colorlib-divilab-plugin.php as per other thread, to modify this widget on the homepage separately from the Projects Portfolio page However I want to display only the project type of “Commercial” and “Residental” only, at the moment it including “Custom Design” project type. I’ve try to modify the plugin with the testing php code of array and taxonomy but it gives me fatal error. Must be the way I put them in was wrong.

The php code is below, could you please show me which part to modify so I can make the portfolio widget section to show only “Commercial” and “Residental” project type/tags ? (there will be Custom Design and Video project types but I only want to show the other 2)

Plugin Name: Colorlib Plugin
Description: Quick Custom Solution Plugin for Implementing Custom Solution.
Version: 1.0.0
Author: Movin
Author URI:
License: GNU General Public License (Version 2 - GPLv2)

 * Homepage parralax section Widget
 * Shapely Theme
class custom_shapely_home_portfolio extends WP_Widget
    function __construct(){

        $widget_ops = array('classname' => 'shapely_home_portfolio','description' => esc_html__( "Shapely Porfolio for Home Widget Section" ,'shapely') );
        parent::__construct('custom_shapely_home_portfolio', esc_html__('[Shapely] Porfolio for Home Widget Section','shapely'), $widget_ops);

    function widget($args , $instance) {
        $title = isset($instance['title']) ? $instance['title'] : '';
        $body_content = isset($instance['body_content']) ? $instance['body_content'] : '';

        if (post_type_exists( 'jetpack-portfolio' ) ) {

        echo $before_widget;

     * Widget Content
        <section class="projects bg-dark pb0">

              $portfolio_args = array(
                  'post_type' => 'jetpack-portfolio',
                  'posts_per_page' => 8,
                  'ignore_sticky_posts' => 1

              $portfolio_query = new WP_Query($portfolio_args);

              if ( $portfolio_query->have_posts() ) : ?>

                have_posts()) : $portfolio_query->the_post();

                  if( has_post_thumbnail() ){ ?>
                          <a>" title="">

                              $project_types = wp_get_post_terms(get_the_ID(), 'jetpack-portfolio-type', array("fields" => "names"));
                              if( !empty( $project_types ) ){
                                echo ''.implode(' / ',$project_types).'';
                  endwhile; ?>
              wp_reset_postdata(); ?>


    echo $after_widget;


    function form($instance) {
        if(!isset($instance['title']) ) $instance['title']='';
        if(!isset($instance['body_content'])) $instance['body_content']='';

      <p><label for="<?php echo $this->get_field_id('title'); ?>"><?php esc_html_e('Title ','shapely') ?></label>

      <input type="text" value="<?php echo esc_attr($instance['title']); ?>"
                          name="<?php echo $this->get_field_name('title'); ?>"
                          id="<?php $this->get_field_id('title'); ?>"
                          class="widefat" />

      <p><label for="<?php echo $this->get_field_id('body_content'); ?>"><?php esc_html_e('Content ','shapely') ?></label>

      <textarea name="<?php echo $this->get_field_name('body_content'); ?>"
                          id="<?php $this->get_field_id('body_content'); ?>"
                          class="widefat"><?php echo esc_attr($instance['body_content']); ?></textarea>

   * Sanitize widget form values as they are saved.
   * @see WP_Widget::update()
   * @param array $new_instance Values just sent to be saved.
   * @param array $old_instance Previously saved values from database.
   * @return array Updated safe values to be saved.
  public function update( $new_instance, $old_instance ) {
    $instance = array();
    $instance['title'] = ( ! empty( $new_instance['title'] ) ) ? esc_html( $new_instance['title'] ) : '';
    $instance['body_content'] = ( ! empty( $new_instance['body_content'] ) ) ? esc_html( $new_instance['body_content'] ) : '';

    return $instance;


function custom_shapely_widgets_init(){

    unregister_widget( 'shapely_home_portfolio' );
    register_widget( 'custom_shapely_home_portfolio' );
add_action( 'widgets_init', 'custom_shapely_widgets_init', 99 );

2- The Project Page used to look like the one in Shapely Demo, now after updating to the new version, the hover gradient and title text disappear, and there are 2 wierd posts of project 1 and project 2 below, which I didn’t set up and didn’t know how they get there.

Could you please show me how to reverse them back with the normal hovering and text as shown in Shapely Portfolio Demo Page , and could you show me the code to make this page to have the same function as the Home Widget, only show “Commercial” and “Residental” Projects?

Thank you and looking forward to your reply!