Customise wordpress theme search.php to include product image - php

I want my search results to show an image of the product. Currently the search results only show a text link. My wordpress theme is Intuition Pro and the website is https://heritagecountrypottery.com. I am also using the Ivory search wordpress plugin
<?php get_header(); ?>
<div id="main" class="main">
<div class="container">
<section id="content" class="content">
<?php do_action('cpotheme_before_content'); ?>
<?php if(have_posts()): while(have_posts()): the_post(); ?>
<article class="search-result" id="post-<?php the_ID(); ?>">
<h4 class="search-title heading">
<?php the_title(); ?>
</h4>
<div class="search-byline">
<?php the_permalink(); ?>
</div>
</article>
<?php endwhile; ?>
<?php cpotheme_numbered_pagination(); ?>
<?php endif; ?>
<?php do_action('cpotheme_after_content'); ?>
</section>
<?php get_sidebar(); ?>
</div>
</div>
<?php get_footer(); ?>
I have searched online for a solution but have not found one that works with my theme

You can get the post thumbnail like this
<?php if ( has_post_thumbnail() ): ?>
<div class="search-thumbnail">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail(); ?>
</a>
</div>
<?php endif; ?>
You can add it before the heading, but you need to figure out the CSS rules you have to apply to make it looks good.

Related

link to archive.php in wordpress

I have the following code in my single.php which outputs the following links
<div class="dt"><?php echo get_the_date();?></div>
<div class="cat">
<?php the_category(', ');?>
</div>
<div class="tag">
<?php the_tags();?>
</div>
<div class="arc">
Archives
</div>
both links to category and tag are working producing output via category.php and tag.php, however, I can't figure it out how to link to archive.php where I plan to show post archive
Just to let you know there is no full archive page like you describe created by default.
Refer to this link: https://codex.wordpress.org/Creating_an_Archive_Index
<?php
/*
Template Name: Archives
*/
get_header(); ?>
<div id="container">
<div id="content" role="main">
<?php the_post(); ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php get_search_form(); ?>
<h2>Archives by Month:</h2>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
<h2>Archives by Subject:</h2>
<ul>
<?php wp_list_categories(); ?>
</ul>
</div><!-- #content -->
</div><!-- #container -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Access the archives like this:
<?php wp_get_archives('type=yearly'); ?>

Paginate a category page of posts in Wordpress

Is it possible to add next and previous post links to a page that is querying posts from one category and displaying one post of that category per page?
This is what I currently have:
<?php query_posts('cat=2&posts_per_page=1'); ?>
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<!-- article -->
<article class="overlay" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="inner">
<div class="gallery" style="background-image: url(<?php the_field('image'); ?>);">
<div class="close" data-home="<?php echo home_url(); ?>">
<span class="oi" data-glyph="x"></span>
</div>
</div>
<div class="copy">
<h2><?php the_title(); ?></h2>
<?php the_field('news_content'); ?>
Next
</div>
</div>
</article>
<!-- /article -->
<?php endwhile; ?>
You can try with next_post_link()
<?php next_posts_link(); ?>
This seemed to be the only solution that worked for me, if anyone needs a template:
<?php get_header(); ?>
<main role="main">
<!-- section -->
<section>
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<!-- article -->
<article class="overlay" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="inner">
<div class="copy">
<h2><?php the_title(); ?></h2>
<?php the_field('news_content'); ?>
<?php the_field('copy'); ?>
<br>
<br>
<?php next_post_link( '%link', 'Next', TRUE, 'post_format' ); ?> | <?php previous_post_link( '%link', 'Previous', TRUE, 'post_format' ); ?>
</div>
</div>
</article>
<!-- /article -->
<?php endwhile; ?>
<?php else: ?>
<!-- article -->
<article>
<h1><?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?></h1>
</article>
<!-- /article -->
<?php endif; ?>
</section>
<!-- /section -->
</main>
<?php get_footer(); ?>

Multiple custom fields causing double posts on page

I am using Magic Fields to create categorized image galleries. I have created 3 different custom fields (port_thumb, illustration_thumb, photo_thumb) so that I can post my thumbnail image to one of 3 different sections. Is there something I can do to keep each post separate to its designated field? Essentially what happens when I create a post for say 'port_thumb,' the thumbnail image loads up and everything is fine in that section. But then lower on the page in both of the other 2 sections an invisible link for the port_thumb shows up as well as loading in the css for that section. Is there some code I can add to prevent each post from showing up 3 times on the page?
<?php get_header();
/*Template Name: Portfolio*/
?>
<div id="main">
<!--TYPOGRAPHY-->
<div class="typography">
<div class="title1">
</div>
<ul>
<?php query_posts( 'category_name=portfolio' ); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>" rel="bookmark"
title="Permanent Link to <?php //the_title_attribute(); ?>">
<li><?php echo get_image('port_thumb');?></li>
</a>
<?php endwhile; ?>
<?php //next_posts_link('Older Entries') ?>
<?php //previous_posts_link('Newer Entries') ?>
<?php else : ?>
<?php endif; ?>
</ul>
<!--end typography-->
</div>
<!------ BEGIN ILLUSTRATION-->
<div class="illustration">
<div class="title2">
</div>
<ul>
<?php query_posts( 'category_name=portfolio' ); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>" rel="bookmark"
title="Permanent Link to <?php the_title_attribute(); ?>">
<li><?php echo get_image('illustration_thumb');?></li>
</a>
<?php endwhile; ?>
<?php //next_posts_link('Older Entries') ?>
<?php //previous_posts_link('Newer Entries') ?>
<?php else : ?>
<?php endif; ?>
</ul>
<!--end ILLUSTRATION-->
</div>
<!--- PHOTOGRAPHY--->
<div class="photography">
<div class="title3">
</div>
<ul>
<?php query_posts( 'category_name=portfolio' ); ?>
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<a href="<?php the_permalink() ?>" rel="bookmark"
title="Permanent Link to <?php the_title_attribute(); ?>">
<li><?php echo get_image('photo_thumb');?></li>
</a>
<?php endwhile; ?>
<?php //next_posts_link('Older Entries') ?>
<?php //previous_posts_link('Newer Entries') ?>
<?php else : ?>
<?php endif; ?>
</ul>
<!--end image-->
</div>
<!--end main-->
</div>
<!--content end-->
I am not sure what you are asking, and I am not even good at this (PHP).
But if I look at you question, you are trying to post a thumnail image into three different divs/wrappers/files, and then your problem is that the thumnail image you post into that three different "things" are not as how you expect. I think the solution is to have a look to each class or id of them then solve their CSS style.

Wordpress - Why calling the_post_thumbnail() AFTER get_sidebar() doesn't show anything on my template

I'm actually trying to display the post thumbnail inside the loop just before the content by using the_post_thumbnail(); function.
It works like a charm in anywhere in my page before I call the function
<?php get_sidebar(); ?>
After that impossible to show the post thumbnail.
I've tried with
<?php the_post_thumbnail(); ?>
and also
<?php echo get_the_post_thumbnail(); ?> but nothing happens.
Here is my whole code :
<?php
/**
* The Template for displaying all single posts
*
* #package WordPress
*/
get_header(); ?>
<div id="pageHeader" >
<div id="pageHeader-inner"> <span class="shadow"></span><img src="<?php bloginfo('template_url'); ?>/images/header_01.jpg" /></div>
</div>
<div class="container" id="pageTitle">
<h1><?php the_title(); ?></h1>
</div>
<!--Begin of content-->
<div class="grey-bg">
<div class="container">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="row">
<div class="col-sm-3 sidebar">
<!-- Sub Nav -->
<?php if ( is_page() ) { ?>
<?php
if($post->post_parent)
$children = wp_list_pages('title_li=&child_of='.$post->post_parent.'&echo=0'); else
$children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0');
if ($children) { ?>
<div class="sidebar-module sub-menu">
<ul>
<?php echo $children; ?>
</ul>
</div>
<?php } } ?>
<!--Works perfectly till here -->
<?php get_sidebar(); ?>
<!--Broken till here-->
</div> <!-- /.sidebar -->
<div class="col-sm-9">
<div class="content-main">
<div class="content white-bg left-stroke <?php echo $post->post_name; ?>">
<?php if ( has_post_thumbnail() ) the_post_thumbnail(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
<?php else : ?>
<div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
<h1>Not Found</h1>
</div>
<?php endif; ?>
</div> <!-- /.content -->
</div><!-- /.content-main -->
</div>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</div>
<?php get_footer(); ?>
Thank's a lot for your responses.
You are trying to use function the_post_thumbnail() outside WordPress loop. To use this function outside loop you have to specify "post ID". Documentation for this function http://codex.wordpress.org/Function_Reference/get_the_post_thumbnail
For example to get thumbnail for post ID 4 you have to use function with parameter 4 like the_post_thumbnail(4) or store ID in variable.

wordpress get posts from a category

Hi Im trying to make my first wordpress website. i have been trying to bring bat posts from two different categories and display them on the same page. I have it bring the posts back but it keeps putting them in a random order. im wanting a with posts from one categorie and a underneath with posts from another category.
heres what i have got so far
<?php get_head(); ?>
<div id="container">
<?php get_header(); ?>
<?php get_banner(); ?>
<div class=" center content" role="main">
<div id="posts">
<div class="news">
<?php query_posts('catname=news&showposts=3'); while (have_posts()) : the_post(); the_title(); the_content();
endwhile;?>
<div class="clear"></div>
</div>
<div class="msghead">
<?php query_posts('catname=msghead&showposts=1'); while (have_posts()) : the_post(); the_title(); the_content();
endwhile;?>
</div>
</div>
</div>
<div class="sidebardiv">
<?php get_sidebar(); ?>
<div class="clear">
</div>
</div>
</div>
<?php get_footer(); ?>
</div>
Have you tried the order and orderby query parameters?
http://codex.wordpress.org/Class_Reference/WP_Query#Order_.26_Orderby_Parameters
Your code might go something like this which orders by date, descending:
<?php query_posts('cat=news&showposts=3&orderby=date'); while (have_posts()) : the_post(); the_title(); the_content();
endwhile;?>

Categories