Add a DIV in Woocommerce Shop Page only - php

I'd like to add a DIV under the title of my Shop page, but ONLY my main shop page.
I added some code in " archive-product.php " but then it display the code on every shop page.
In fact i just need a DIV saying " choose a category below " on the main Shop Page.
Thnaks a lot for your help!
Vince

Instead of overriding archive-product.php template, You can use the following custom hooked function, that will add a custom <div> below the title in shop page only:
add_action( 'woocommerce_archive_description', 'additional_div_in_shop', 5 );
function additional_div_in_shop() {
// Only on "shop" archives pages
if( ! is_shop() ) return;
// Output the div
?>
<div class="shop-below-title"><?php _e( "Choose a category below", "woocommerce" ); ?></div>
<?php
}
Code goes in function.php file of your active child theme (or active theme).
Tested and works.
Related Docs: woocommerce conditional tags

You can add that div conditionally like the following and then the div will be shown only on shop page
if ( is_shop() ) {
echo '<div>Choose a category below</div>';
}

I know this is an old post but, there is a page selected as the shop page for woocommerce. U can simply switch back to classic editor and add a div in the text section of the page u selected in the woocommerce settings. That way u don't need child theme or anything.

Related

How to override the default wordpress search template and use woocommerce archive-product.php template

I have a woocommerce site and for some reason the product search is displaying results using the wordpress search.php.
How can I override the default wordpress search template and use woocommerce archive-product.php template as normal. Using woocommerce product search widget.
I have woocommerce folder inside my theme and contains the archive-product.php, product-searchform.php
The shop page is using archive.php and I want the same template for search results.
Code in my header for the form
<div class="woo-search">
<?php if(is_active_sidebar('woo-search')){
dynamic_sidebar('woo-search');
} ?>
</div>
How can I make the search results to display using archive-product.php?
You've to use template_include filter. You have to add following code into your active theme's functions.php file.
The call back function checks the post type being searched. If it's the products it choose your desire template to list out search results.
function template_chooser($template) {
global $wp_query;
$post_type = get_query_var('post_type');
if( $wp_query->is_search && $post_type == 'products' )
{
return locate_template('archive-product.php'); // redirect to archive-product.php
}
return $template;
}
add_filter('template_include', 'template_chooser');
Let me know your feedback.

Remove a sub heading text under products page title in OceanWP theme

I am trying to figure out how to change/remove the text under "Products (Varer)" on my Wordpress woocommerce website like in this screenshot:
Any help is appreciated.
According to OceanWP's docs, you can add this function to your functions.php file of the child theme to remove the subheading:
// Remove the Shop page subheading
function my_remove_shop_page_header_subheading( $subheading ) {
if ( is_shop() ) {
$subheading = false;
}
// Return the subheading
return $subheading;
}
add_filter( 'ocean_post_subheading', 'my_remove_shop_page_header_subheading' );
Alternatively, you can add one line of extra css to your website (tested and worked):
.clr .page-subheading {display: none}
Follow this steps to edit/remove sub heading.
Go to Pages > select shop page > Edit.
Under Ocean WP settings choose Title.
Enter your desired subheading or a single space in case you want to remove that altogether.
Note: A single space would remove that line altogether, won't create an empty line as of now.
I am not sure if that would change with theme/plugin updates, but is a good option if you have not created child theme. In case you have created a child theme have a look here: https://docs.oceanwp.org/article/500-remove-the-shop-page-subheading

Is it possible to insert shortcode inside Header menu or top-bar menu in wordpress?

I have made a simple shortcode for my wordpress theme. I'm trying to align it on right-side above the corner of my page. Is it possible to insert shortcode function.php?
I want to place my Short-code in the top-bar (right side above the corner) so that it will work for each pages. Means if i click on any menu then the shortcode should have to work on that menu also.
Actually i'm new in web development. Please suggest me what shall i have to do so it will align where i want and should have work for each module.
You can use wordpress function for that. Please open the file on which you have to place shortcode. Like if you want to place it on header open header.php and add
<?php echo do_shortcode('[your_shortcode]'); ?>
where you want your shortcode content to appear
The best way is to find the top bar menu hook of your theme and then add this code (adapted for your needs) in your function.php child theme :
function my_shotcode_inside_top_bar ( $items, $args ) {
if (is_page() && $args->theme_location == 'secondary') {
$items .= '<li class="my-class">' . do_shortcode( "[my_shortcode]" ) . '</li>';
}
return $items;
}
add_filter( 'wp_nav_menu_items', 'my_shotcode_inside_top_bar', 10, 2 );
is_page displays the shortcode in pages only but you can choose another condition or no condition at all.
secondary is the hook and it depends on your theme. You can normally find it in your theme header.php file.
A menu location selector should be added - that way some themes support multiple menus, and some are called "top" or custom added.
The shortcode could then contain a call to whatever a menu position is:
EG: [myshortcode menu="secondary"]
Didn't have enough points to add this as a comment.

Insert short description after YITH Wishlist button

I'm using YITH WooCommerce Wishlist plugin and in my WooCommerce single product pages, I'm trying to insert the "Short description" block after the YITH Wishlist button.
My wishlist html element is:
<div class="yith-wcwl-add-to-wishlist add-to-wishlist-48">
label
<div class="yith-wcwl-wishlistaddresponse"></div>
</div>
What is the tag to add action so that description goes after the element wish list?
My example code:
add_action('woocommerce_...','woocommerce_template_single_excerpt' );
Thanks.
That is possible easily and instead of moving the short description, you can place this Wishlist button before the short description. You will have first to change in the General settings of YITH WooCommerce Wishlist plugin, for "Position" you will choose "Use shortcode" and you will save that setting:
Then you will add a custom function hooked in woocommerce_single_product_summary action hook with a priority of 15 (between the product price (10) and the short description (20)):
add_action( 'woocommerce_single_product_summary', 'custom_yith_wcwl_add_to_wishlist', 15 );
function custom_yith_wcwl_add_to_wishlist(){
echo do_shortcode('[yith_wcwl_add_to_wishlist]');
}
The Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
Related WooCommerce template: content-single-product.php
PHP Snippet: Display YITH Wishlist Buttons # Shop Page – WooCommerce YITH WooCommerce Wishlist Add code in your theme fuctions.php file
Then create a page for example (whislist) and [yith_wcwl_wishlist] paste short code there and update page and then go to YITH Plugin Settings then Select Wishlist Page (page name wishlist which you created).
add_action( 'woocommerce_after_shop_loop_item', 'bbloomer_display_yith_wishlist_loop', 97 );
function bbloomer_display_yith_wishlist_loop() {
echo do_shortcode( "[yith_wcwl_add_to_wishlist]" );
}

Woocommerce shop page custom template

As I understand by default Woocommerce shop page uses product archive template. What I am looking for, is to use a custom template for shop page.
Here is what I did:
Create template "my-shop"
Create page "My shop" -> choose template "my-shop"
Choose "My shop" as Woocommerce shop page
But none of the changes I made to "my-shop" template are present on the shop page.
What am I missing here? I would not like to change product archive itself, just the shop page.
Is there a way to disable product archive from being a default for shop page?
Thanks
I know it's too late and you may have figured it out by now. In any case, the changes that you would like to make to the WooCommerce Shop Page need to be done in the archive-product.php and it would be safer to create a child theme and do these changes. Making enhancements and customizations in a Child theme is best practice so that you can update the parent theme at any time and it won't affect your store.
I hope this helps, for more information on how you can use WooCommerce short-codes to customize your store can be found here.
To add to Silver Ringvee's answer - he used is_page but that only works on wordpress pages. For woocommerce you need to use something like is_woocommerce() . See Woocommerce conditional tags page.
My example code uses the is_shop conditional tag as that was the page you wanted to change. the code get_template_part( 'content', 'shop' ); will call the file content-shop.php in your theme root folder. This code is to be added at the top of wp-content\themes\*theme*\woocommerce\archive-product.php that you can copy from wp-content\plugins\woocommerce\templates\archive-product.php
You can add it just before get_header( 'shop' ); line 23 in my file - and the entire page will be drawn from your template. If you want to keep the header of the shop page, then put this code after the get_header code. Remember to include a footer in your file as well
if (is_shop()) {
get_template_part( 'content', 'shop' );
} else {
#normal archive-product code here
}
The solution (not perfect) that I figured to work best, until someone finds a way to actually change the template from dashboard:
Adding:
<?php
if (is_page( 'Page Title' ) ):
# Do your stuff
endif;
?>
to content-product.php in my theme's woocommerce folder.
If you prefer to go with code, you can create a redirect from the original shop page to your page via wp_redirect.
add_action('template_redirect', 'bc_010101_redirect_woo_pages');
function bc_010101_redirect_woo_pages()
{
if (is_shop())
{
wp_redirect('your_shop_url_here');
exit;
}
}
More detailed tutorial can be found here
This is not possible to create custom template for shop page , just copy and paste woocommerce Templates into you theme folder and Try to work in content-product.php template .

Categories