Highlight searched terms

maru
(@marincastro)

4 years, 4 months ago

Hello,

i would like to highlight the searched terms in the title and content without a plugin. I have a child theme, could you guide me please.

Thanks in advance,
Marina Castro

The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)

Theme Author themevision
(@themevision)

4 years, 4 months ago

Hi (@marincastro),

You can easily do this by editing this page:
(Your-Domain.com)/wp-content/themes/agama-pro/framework/blog/list.php

——————————————–
TO HIGHLIGHT THE SEARCHED TERMS IN TITLE.

First open the list.php file above and look for the following code:
<?php the_title(); ?>

Now replace the above code with:
<?php echo $title; ?>

Make sure that you paste this line above the title code:
<?php $title = get_the_title(); $keys= explode(” “,$s); $title = preg_replace(‘/(‘.implode(‘|’, $keys) .’)/iu’, ‘<strong class=”search-excerpt”>\0‘, $title); ?>
——————————————–
——————————————–
ALSO HIGHLIGHT THE SEARCHED TERMS IN EXCERPT.

Look for the following code:
<?php the_excerpt(); ?>

Now replace the above code with:
<?php echo $excerpt; ?>

Make sure that you paste this line above the excerpt code:
<?php $excerpt = get_the_excerpt(); $keys= explode(” “,$s); $excerpt = preg_replace(‘/(‘.implode(‘|’, $keys) .’)/iu’, ‘<strong class=”search-excerpt”>\0‘, $excerpt); ?>
——————————————–

Now open your CSS file and add the styling for the class search-excerpt, and it will highlight the terms. Currently the code is making the search terms bold. You can try this simple CSS in your theme’s style sheet.

strong.search-excerpt {
background-color:yellow;
color:black;
}

That’s it. Enjoy! 🙂

Thanks for contacting.

Thread Starter maru
(@marincastro)

4 years, 4 months ago

thank you!
Thread Starter maru
(@marincastro)

4 years, 4 months ago
Hi i searched for a term and that term is highlighted when it comes from a post but not when it comes from a page.

Unfortunately i tried it in a test page, but i can give you the credentials so you can see it by yourself or i can send you an image but i dont see here a way to upload an image

I can see the title of the page and the excerpt is empty
Am i doing something wrong? i copied this file to my child folder
from /wp-content/themes/agama-pro/framework/blog/list.php
to /wp-content/themes/agama-pro-child/framework/blog/list.php
and did the changes in there

Here is that part of the code
```

	<div class="entry-content">
		<?php $keys = implode('|', array_filter(explode(' ', get_search_query())));
		 	  $title = get_the_title(); 
			  $title = preg_replace('/(' . $keys .')/iu', '<strong class="search-highlight">\0</strong>', $title);?>
		<h1 class="entry-title">
			<a href="<?php the_permalink(); ?>" rel="bookmark"><?php echo $title; ?></a>
		</h1>
		
		<?php Agama::post_meta(); ?>
		
		<?php $excerpt = get_the_excerpt(); 
			  $keys= explode(" ",$s); 
			  $excerpt = preg_replace('/('.implode('|', $keys) .')/iu', '<strong class="search-highlight">\0</strong>', $excerpt);
			  echo $excerpt; ?>
	</div>
	
```
- This reply was modified 4 years, 4 months ago by maru.
Theme Author themevision
(@themevision)

4 years, 4 months ago

Hi @marincastro,

I’m not quite sure where you’re mistaking something. So, maybe it’s better to check by ourself to get it done.

You can send the site credentials to support@theme-vision.com

Regards

Thread Starter maru
(@marincastro)

4 years, 4 months ago

Hello, did you have time to check? i would like to know what i did wrong 🙂
Best,
Marina

Theme Author themevision
(@themevision)

4 years, 4 months ago

Hi,

Just want to know, have you send email to our support?

We haven’t received yet. can you please mention free support link in email.

Regards

Thread Starter maru
(@marincastro)

4 years, 4 months ago

Hi, i think so, i sent it to support@theme-vision.com, is this correct?

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Highlight searched terms’ is closed to new replies.

Tags