I have tried all of that. Nothing works, except using the CSS and listing all products without using any other pagination (and the standard pagination just loads the same first page if it shows up at all).

This particular issue is urgent so I would appreciate your quick reply. Thanks.

• This reply was modified 1 year, 6 months ago by Illingco.

Thank you!

submenu background did not seem to work, maybe other CSS is overriding, or this is just not quite the right code?

One more thing. Thanks for CSS btw. Any way to get an image behind the submenu instead of a solid color? Perhaps a font that is different from the other menus? I assume with some more CSS? Thanks.

Thank you. But, I should mention I only want this submenu on a specific set of single product pages, not all across the site. Any way to simply use the shortcode to insert on those pages as we build those products? THanks.

Thank you for this, but it’s not quite what I am after. Not sure i’ll use either button format, or just the word menu as on the last one, “DIY Garage”. How do I control the black stripe going through that? Thanks for your help!

Odd, but I think I got it working. I had “Enfold Theme Options ▸ Performance ▸ Delete old CSS and JS files” enabled prior to installing child theme. I had to toggle that off, save, then toggle on, and clear cache for it to “catch”. The top small menu seems bolded more than the previous, and I had to redo a column in footer widgets, but otherwise looks pretty good on staging. You may verify between the two if you want to see if there are any differences that may cause issues or site failure. Thanks.

Yes, unless there is a way to convert a site from a main install of enfold to a child install of it?

I modified loop-search.php as such, and seems to work on staging and live site as I had hoped. Is this correct?

$searchthumb = get_the_post_thumbnail( $the_id, ‘large’ );
echo “<span class=’search-result-counter {$counterclass}’>{$searchthumb}</span>“;

Also, these have a child theme, so simpler. How might I implement this in our other Enfold site that does NOT use a child theme? Thanks!

That works for making them square, thanks! Any way to make the image linked as the titles are? Thanks for your support.

So I did the below, and like this look best, but is there any way to make the image linked to the same as the title next to it? Thanks!

Replace it with:

$searchthumb = get_the_post_thumbnail( $the_id, ‘large’ );
echo “<span class=’search-result-counter {$counterclass}’>{$searchthumb}</span>”;

Add this on Quick CSS or custom.css:

.search-result-counter {
padding: 0;
width: 75px;
height: 75px;
}

.search-result-counter img {
width: 100%;
height: 100%;
border-radius: 100px;
}

#top.search-results .entry-content,
#top.search-results .post-title {
margin-left: 45px;
}

• This reply was modified 2 years ago by Illingco.
• This reply was modified 2 years ago by Illingco.
• This reply was modified 2 years ago by Illingco.

So to be clear, I should stick with this CSS?

.search-result-image {
display: block;
}
.search-result-image img {
width: 200px;
border: 1px solid #e1e1e1
}
a.slide-image.search_image {
overflow: visible !important;
}
a.search_image .image-overlay.overlay-type-extern {
left: 0 !important
}

Update: used PHP above and just this CSS, seems the best I can do, and I cannot get pictures left of text tables, so please lmk what you think.

.search-result-image {
display: block;
}
.search-result-image img {
width: 120px;
border: 1px solid #e1e1e1
}
a.slide-image.search_image {
overflow: visible !important;
}
a.search_image .image-overlay.overlay-type-extern {
left: 0 !important
}

OK, i followed all that with the following PHP code and CSS, but my results are not ideal. The text tables get jumbled together as linked in private content. Please advise.

PHP
$searchthumb = get_the_post_thumbnail( $the_id, ‘square’ );
if( ! empty( $searchthumb ) ) {
echo “<span class=’search-result-image’>{$searchthumb}</span>“;

CSS
#top.search-results .search-result-counter {
padding: 0;
}
#top.search-results .search-result-counter img {
border-radius: 0;
height: 100%;
}
#top.search-results .search-result-counter {
height: 215px;
width: 215px;
background: transparent;
}
#top.search-results .template-search.content .entry-content-wrapper {
height: 215px;
}
#top.search-results #main .post-meta-infos {
display: none;
}
#top.search-results .entry-content,
#top.search-results .post-title {
margin-left: 150px;
}
#top.search-results .post-entry {
padding-bottom: 20px;
}

.search-result-image {
display: block;
}
.search-result-image img {
width: 120px;
border: 1px solid #e1e1e1
}
a.slide-image.search_image {
overflow: visible !important;
}
a.search_image .image-overlay.overlay-type-extern {
left: 0 !important
}