After a long and recursive search on the web, I didn't find a solution for my needs.
I need to display, in home page, not only product name and price, but also some custom attribute I already have set in all my products. Let's say 'year' and 'author'.
All snippets found are single product or shop page related only, nothing for home page (or any other page anyway).
Tried also with woocommerce shortcodes, but they are not applicable for that purpose.
I already use:
[recent_products per_page="6" columns="6" orderby="year" order="desc"]
to display recent products ordered by "year" att (I found a snippet to add 'orderby' custom att).
Any help will be really appreciated.
Here's the code that you can use for displaying products from a specific category with meta data on the home page:
<ul class="products">
<?php
$args = array( 'post_type' => 'product', 'posts_per_page' => 10, 'product_cat' => 'categoryNAme', 'orderby' => 'rand' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<li class="product">
<a href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
<?php woocommerce_show_product_sale_flash( $post, $product ); ?>
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="300px" height="300px" />'; ?>
<h3>Title: <?php the_title(); ?></h3>
<h3>Content: <?php the_content(); ?></h3>
<h3>Date: <?php the_date(); ?></h3>
<h3>Author: <?php the_author(); ?></h3>
<span class="price"><?php echo $product->get_price_html(); ?></span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul><!--/.products-->
Related
I am in need of a function that prints out categories from top to bottom with best selling to worst selling. I've only managed to get this to work with products. Can someone assist me in how to do so or maybe already have that function stored somewhere? Thanks in advance :)
The products are a subscription btw. Don't know if that matters.
Here's the frontend part (which is hardcoded) to give an example of final results that I'm going for:
This is the code for single best selling item. If we can modify this to get the best selling products then that would be awesome!
<?php
$args = array(
'post_type' => 'product',
'meta_key' => 'total_sales',
'orderby' => 'meta_value_num',
'posts_per_page' => 1,
);
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
global $product; ?>
<div>
<a href="<?php the_permalink(); ?>" id="id-<?php the_id(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID ))
echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog');
else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="product placeholder Image" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
</a>
</div>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
I have created a 'Latest Products' loop by inserting the following code into my 'index.php' file:
<section id="recent">
<h1>Recently Added</h1>
<ul class="row-fluid">
<?php
$args = array( 'post_type' => 'product', 'stock' => 1, 'posts_per_page' => 4, 'orderby' =>'date','order' => 'DESC' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product;
?>
<li class="span3">
<a id="id-<?php the_id(); ?>" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price">
<?php echo $product->get_price_html(); ?>
</span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul>
</section>
I now wish to be able to apply an arrow on the left and right of this row, where upon selecting the arrow, it will scroll through the images.
I am aware of the following codes:
<?php previous_post_link(); ?>
<?php next_post_link(); ?>
However, upon selection of their links, the user is taken to its dedicated page rather than being able to 'scroll' through the products.
Any suggestions on how I can achieve this?
Maybe you are looking for a carousel? There are a lot of jQuery plugins, i have used this one.
If you choose this solution, you should get the script, put it in your theme, add it, preferably in functions.php (more info here) and then add the carousel itself.
$('.row-fluid').owlCarousel({})
But insteal of all this maybe using a plugin like "WooCommerce Product Slider" or similar will be better. It provides shorcode and widget implementation which should work with most themes and can be used directly in the control panel withouth coding. One more note - if you still prefer to use your own code - maybe it'll be better to put it in a template file instead in index.php
I am making a custom loop for my site using Woocommerce, I am using sub categories as a additional text field for the products but I can't find a function to just show sub categories, all are showing main and sub categories.
Can anyone help ?
<?php echo $product->get_categories(); ?>
Much appreciated :)
Here is the full code
<ul class="row-fluid">
<?php
$args = array ( 'post_type' => 'product', 'stock' => 1, 'posts_per_page' => 4, 'product_cat' => 'news', 'orderby' => 'date','order' => 'DESC' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<li class="span">
<a id="id-<?php the_id(); ?>" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
<?php echo $product->get_categories(); ?>
<p class="price"><?php echo $product->get_price_html();?></p>
<a class="button add_to_cart_button product_type_simple"href="<?php the_permalink(); ?>">More...</a>
</a>
<div class="wer"><?php the_excerpt(); ?></div>
<span class="Cart"><?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?></span>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul>
I'm using WooCommerce to build a webshop.
I made a custom homepage. On this homepage, I want to display the products per category in a carousel like structure(3 per view). But how do I get the data(products per category) into my own custom homepage? To be clear, this homepage comes before the product overview(or: 'archive-product.php').
Thanks!
Modified slightly from source: https://wordpress.stackexchange.com/a/67266/16086
You'll want to use something like this:
<ul class="products">
<?php
// Change product_cat to the slug of the category you want
$args = array( 'post_type' => 'product', 'posts_per_page' => 1, 'product_cat' => 'shoes', 'orderby' => 'rand' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<h2>Shoes</h2>
<li class="product">
<a href="<?php echo get_permalink( $loop->post->ID ) ?>" title="<?php echo esc_attr($loop->post->post_title ? $loop->post->post_title : $loop->post->ID); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" width="300px" height="300px" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price"><?php echo $product->get_price_html(); ?></span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</li>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</ul><!--/.products-->
You can just change the product_cat item to the category you want and set posts_per_page to 3.
I was make custom template for my WordPress site. So I need to show my product in my custom template dynamically. How can i do that?
This is my html code-->
<div class="all_content_shop">
<div class="col-md-3 single_all_c_s">
<div class="shop_product_inner">
<a href="<?php echo get_permalink( $loop->post->ID ) ?>">
<img src="http://jetsetbabies.com/wp-content/uploads/2006/07/100Juice_Organic_Apple_MAIN_v2.jpg" alt="Prduct Image" />
<div class="shop_product_inner_caption">
<h2>Product Title</h2>
<p>$200</p>
Add to Cart
</div>
</a>
</div>
</div>
</div>
================================================
Also i was make simple query but i did not found add to cart button dynamic code???
This is my query code---->
<div class="all_content_shop">
<?php $new_posts = new WP_Query(array(
'post_type' => 'product', //post of page of my post type
'cat' => 0, // category id, 0 for all categories.
'posts_per_page' => 12,
'offset' => 0, //how many posts you want to eliminate from the query
'orderby' => '', // order by title or date ?
'order' => 'DESC') // order as ASC or DESC
); ?>
<?php if ($new_posts->have_posts()) :
while ($new_posts->have_posts()) :
$new_posts->the_post(); ?>
<div class="col-md-3 single_all_c_s">
<div class="shop_product_inner">
<a href="<?php echo get_permalink( $loop->post->ID ) ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_single'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="Placeholder" />'; ?>
<div class="shop_product_inner_caption">
<h2><?php the_title(); ?></h2>
<p><?php if ( ! defined( 'ABSPATH' ) ) exit; global $post, $product; ?> <?php echo $product->get_price_html(); ?></p>
Add to Cart
</div>
</a>
</div>
</div>
<?php endwhile;//Possibility to add else statement ?>
<?php wp_reset_postdata(); ?>
<?php else:?>
<p class="not_found">Sorry, The post you are looking is unavailable!</p>
<?php endif; wp_reset_query(); ?>
</div>
So my question is--->
My query is right or wrong?? if my query is wrong, please give me right query... Also if my query is almost right so please give me just "Add to cart" (http://prntscr.com/439lxj) button dynamic Ajax code...
Please help me...
Please help me...
Thanks !!!
I have made the necessary changes for the code to work. Make sure woocommerce add-to-cart.js or add-to-cart.min.js is enqueued in the page.
<div class="all_content_shop">
<?php wc_print_notices(); ?>
<?php $new_posts = new WP_Query( array(
'post_type' => 'product', //post of page of my post type
'cat' => 0, // category id, 0 for all categories.
'posts_per_page' => 12,
'offset' => 0, //how many posts you want to eliminate from the query
'orderby' => '', // order by title or date ?
'order' => 'DESC'
) // order as ASC or DESC
); ?>
<?php if ( $new_posts->have_posts() ) :
while ( $new_posts->have_posts() ) :
$new_posts->the_post();
global $product;
$product = get_product( get_the_ID() ); //set the global product object?>
<div class="col-md-3 single_all_c_s">
<div class="shop_product_inner">
<a href="<?php the_permalink() ?>">
<?php if ( has_post_thumbnail( get_the_ID() ) ) {
echo get_the_post_thumbnail( get_the_ID(), 'shop_single' );
} else {
echo '<img src="' . woocommerce_placeholder_img_src() . '" alt="Placeholder" />';
} ?>
<div class="shop_product_inner_caption">
<h2><?php the_title(); ?></h2>
<p><?php echo $product->get_price_html(); ?></p>
<?php woocommerce_template_loop_add_to_cart(); //ouptput the woocommerce loop add to cart button ?>
</div>
</a>
</div>
</div>
<?php endwhile;//Possibility to add else statement ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<p class="not_found">Sorry, The post you are looking is unavailable!</p>
<?php endif;
wp_reset_query(); ?>