Developer Journal: Making ShopIsle Theme Search Page Display Excerpts Instead of Full Content [without plugin] – Pt. 01

This is part of a new series I’m starting called Developer Journal. Posts in this series discuss my challenges — various programming and design topics I’m trying to figure out. I take you on my journey of learning and discovery. You get to experience my process for problem-solving and troubleshooting technical issues.

While these are not meant to be “how-to” articles, many of you may find value in following my successes and failures. In this series, I also discuss the steps I took (even wrong ones) to get to the right solution and my thoughts along the way.

Developer Journal posts may also deal with my ideas, concepts, hunches, and experiments. Some topics will be split among multiple posts, especially when an easy solution cannot be found quickly. These will have the word “part” in the title (e.g., Part 3, Part 5).

I welcome your comments — especially advice on best practices, efficiency, workflows, and the business of being a web developer, web designer, or graphic designer — on these posts.

The Challenge

The ShopIsle Theme (Version: 1.1.46) search results page displays full content for each result in the list, by default. I want each result to display with post excerpts instead. This will allow me to scroll through and scan results easier.

Starting Presumptions & Givens

• I know there are WordPress functions called the_content() and the_excerpt()
• I think if I can find the “the_content()” function somewhere in the search page, all I will have to do is replace it with “the_excerpt()”
• Based on my previous experiences with troubleshooting and customizing WordPress backend code, it likely is not as intuitive and simple as editing one file
• The main file that controls the search results page probably isn’t named with something obvious like “search.php” or “search-results.php”

Requirements & Parameters

• Learn what code controls the search page
• Modify the code that controls the search page
• Do NOT use plugins

My Process

Step 1: Google for long-tail search terms.

My first step was to google for long-tail search terms.

I tried this search:

One of the results was this WordPress Stack Exchange post: changing search result from only excerpt to full content. Exactly what I was looking for! Or so I thought.

In the first few lines of the post, the OP explains that his question is about a specific WordPress theme (canvas). He mentions two files: content-search.php and search.php. An answer confirmed my presumption that all you need to do is replace “the_content()” with “the_excerpt()”. The answer date was a little over a year ago (May 2017), and looks very promising.

Step 2: Examine my theme’s content-search.php and search.php files

Search for the_content() or the_excerpt() in content-search.php

Unfortunately, upon examining my Shop Isle parent theme files (in folder shop-isle) I found there is no content-search.php file.

Search for the_content() or the_excerpt() in search.php

I then examined the search.php file:

<?php
/**
 * The template for displaying search results pages.
 *
 * @package WordPress
 * @subpackage Shop Isle
 */

get_header(); ?>

<!-- Wrapper start -->
<div class="main">
	<!-- Post single start -->
	<?php
	$shop_isle_header_image = get_header_image();
	if ( ! empty( $shop_isle_header_image ) ) :
		echo '<section class="page-header-module module bg-dark" data-background="' . esc_url( $shop_isle_header_image ) . '">';
	else :
		echo '<section class="page-header-module module bg-dark">';
	endif;
	?>
	<div class="container">
		<div class="row">
			<div class="col-sm-6 col-sm-offset-3">
				<h1 class="module-title font-alt">
					<?php
					printf(
						/* translators: s: Search term. */
						__( 'Search Results for: %s', 'shop-isle' ),
						'<span>' . get_search_query() . '</span>'
					);
					?>
				</h1>
			</div>
		</div>
	</div><!-- .container -->
	<?php
	echo '</section>';

	echo '<section class="module">';
	?>
	<div class="container">

		<div class="row">

			<!-- Content column start -->
			<div class="col-sm-8 shop-isle-page-content">

				<?php if ( have_posts() ) : ?>

					<?php get_template_part( 'loop' ); ?>

				<?php else : ?>

					<?php get_template_part( 'content', 'none' ); ?>

				<?php endif; ?>

			</div><!-- Content column end -->
			<!-- Sidebar column start -->
			<div class="col-sm-4 col-md-3 col-md-offset-1 sidebar">

				<?php do_action( 'shop_isle_sidebar' ); ?>

			</div>
			<!-- Sidebar column end -->
		</div><!-- .row -->

	</div>
	</section>
	<!-- Post single end -->


<?php get_footer(); ?>

Notice there is no “the_content()” in there. I considered that it was possible that maybe the_content() was the default and so I searched the file to see if the_excerpt() was commented out somewhere. It was not. Neither function was in the search file.

Determine which files search.php is importing or calling

Next, I examined search.php to determine what other files it might be pulling in, in hopes that would lead to the file(s) I needed to modify.

This section of code was probably where the answers lay:

			<!-- Content column start -->
			<div class="col-sm-8 shop-isle-page-content">
 
				<?php if ( have_posts() ) : ?>
 
					<?php get_template_part( 'loop' ); ?>
 
				<?php else : ?>
 
					<?php get_template_part( 'content', 'none' ); ?>
 
				<?php endif; ?>
 
			</div><!-- Content column end -->

I figured the get_template_part(‘content’, ‘none’) was the most likely candidate because ‘loop’ didn’t look like it had anything to do with content — I thought it was a loop to continue trying a search.

So, I looked for, found, and examined content.php.

<?php
/**
 * Template part for displaying posts.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package WordPress
 * @subpackage Shop Isle
 */
?>

<div <?php post_class( 'post' ); ?> id="post-<?php the_ID(); ?>">

	<?php

	/*
	 * @hooked shop_isle_post_header() - 10
	 * @hooked shop_isle_post_meta() - 20
	 * @hooked shop_isle_post_content() - 30
	 */
	do_action( 'shop_isle_loop_post' );
	?>

</div><!-- #post-## -->

Huh — ‘shop_isle_loop_post’? What does that have to do with anything?

NOTHING in here looks useful in any way!!

Now, keep in mind. I don’t understand hooks and queuing, though I’ve bumped into those concepts a few times, I have not mastered them in any way. But, I have been able to use hooks and queuing (e.g., in functions.php) by following good step-by-step tutorials.

I was at a DEAD END. Now What?

Step 3: Refine long-tail search

I decided the next step would be to refine my long-tail search to only get results mentioning “theme isle”:

That turned up this article on improving internal search in WordPress. But, internal search (seaching in the back end) is not what I needed, though they did mention some interesting plugins (e.g., Relvanssi, Better Search, and Search Everything).

Step 4: Search the theme creator’s knowledgebase website

From past experience I realized that often Theme Isle, the creators of the Shop Isle theme, already have posts answering css and php customizing questions.

One of the results from my first

So, the next thing I did was to search ThemeIsle.com for this query string:

Which yielded this article: How to display full content instead of the excerpt on Post Archive page in ShopIsle Lite?

But, again, this wasn’t applicable to my situation, because I’m not concerned with the archives.php page.

Wrap-Up

Well, we ran out of time folks.

Tune in next week when I continue describing the steps I am taking — as I still haven’t solved it — to figure this issue out. We will discuss these items and more:

• Exploring WordPress function reference (Codex)
• get_template_part() function
• content-none.php

Until next time, have a great week!