Where to add content and customize page title in woocommerce - php

I am trying to add content after the page title and customize the style of page where all products are listed in woocommerce, but I have no idea where is the file that I can copy to my custom theme, I have been able to customize the products in the loop but don't know where to customize this?
On inspect element it is the h1 element with a class page-title:
<h1 class="page-title">Nettbutikk</h1>

woocommerce/templates/single-product/title.php is the file you are looking for. You can copy single-product/title.php to yourchildthemefolder/woocommerce/single-product/title.php
Here is a link to their github of that file so you can see it for yourself. Let me know if this helped! :)
https://github.com/woocommerce/woocommerce/blob/master/templates/single-product/title.php

To edit the woocommerce product list page, the file woocommerce/archive-product.php needs to be edited.

Woocommerce Listing products page add content after product title using given hook.
add_action( 'woocommerce_after_shop_loop_item_title', 'after_shop_loop_item_title', 1 );
Add this code in functions.php of current active theme.
add_action( 'woocommerce_after_shop_loop_item_title', 'after_shop_loop_item_title', 1 );
function after_shop_loop_item_title() {
global $post;
$terms = get_the_terms( $post->ID, 'product_cat' );
$text = "<p> (";
foreach ($terms as $term) {
$text .= $term->name;
}
$text .= ") </p>";
echo $text;
}
Reference by: https://businessbloomer.com/woocommerce-visual-hook-guide-archiveshopcat-page/

Related

Displaying main product image from Woocommerce with a custom plugin

Hi I'm trying to create a custom plugin that will display the main product image from Woocommerce plugin. I want to use shortcode. How do I go about doing this? This is what I had and it didn't work. I've also found different suggestions. I will share everything below
add_shortcode( 'product_image', 'bbloomer_product_image_shortcode' );
function bbloomer_product_reviews_shortcode() {
return woocommerce_get_product_thumbnail();
}
<?php
$gallery_shortcode = '[gallery id="' .intval($post->$post_parent).'"]';
print apply_filters('the_content', $gallery_shortcode);
?>
These are what I found/were suggested to me before
try this:
$featured_image = wp_get_attachment_url( get_post_thumbnail_id($product_id));

How to hook an ACF field into the bottom of the "after_shop_loop" section of a Woocommerce category page after pagination

I found the correct hook of where I want the field to show which is below
add_action( 'woocommerce_after_shop_loop', 'after_shop_loop', 1 );
This code works exactly how'd I'd like mine to work but with an ACF text area field. Ideally, I'd like it to show under the pagination. This hook is currently showing above the pagination.
add_action( 'woocommerce_after_shop_loop', 'after_shop_loop', 1 );
function after_shop_loop() {
echo "<div class='best-seller'>
<h3>If you need help or have a question for Customer Service, please visit the <a href='#'>Help Section.</a></h3>
</div";
}
I'd like to create a function to bring in an ACF text area that I've added to the backend for all brands that are coming from WooCommerce taxonomy pages "Brand".
This is what I have so far with no luck. Is there something I'm doing wrong or something special you have to do to get ACF to show on Taxonomy pages? Any help is appreciated. Thanks in advance...
add_action( 'woocommerce_after_shop_loop', 'after_shop_loop', 1 );
function custom_after_shop_loop() {
$brand_content = get_field('brand_bottom');
if( !empty($brand_content) ) {
echo '<div class="brandbottom">' . $brand_content . '</div>';
}
}
Screenshots from my custom field.
Missing "custom_" in the name of your function and you have to get the current taxonomy term. Tested and works
add_action( 'woocommerce_after_shop_loop', 'custom_after_shop_loop', 1 );
function custom_after_shop_loop() {
$term = get_queried_object();
$brand_content = get_field('brand_bottom', $term);
if( !empty($brand_content) ) {
echo '<div class="brandbottom">' . $brand_content . '</div>';
}
}

Adding an image page banner to shop page

I am using WordPress 4.9.6.
I have set the shop page to be the home-page.
How do I add a page banner to the shop page. I would like to add it just above the breadcrumb trail.
I have tried adding this to the following page archive-product.php
if (is_shop()) {
$args = array('taxonomy' => 'product_cat');
$product_categories = get_categories( $args );
$term_id = $product_categories[0]->term_id;
$content = get_term_meta($term_id, 'cat_meta');
if(isset($content[0]['cat_header'])){
echo do_shortcode($content[0]['cat_header']);
}
}
Unfortunately, not able to add any image to the page.
You can achieve using 2 methods.
1) Add your static image directly at the beginning of archive-product.php
echo "<img src='{YOUR_IMAGE_PATH}'>";
2) Add filter in your theme's functions.php file.
add_action ('woocommerce_archive_description' , 'shop_banner',99);
function shop_banner() {
echo '<img src="{YOUR_IMAGE_PATH}" >';
}
I'm not so sure if I understand exactly what you want. But this is what I understand so far.
If you want to display an Static image banner above the breadcrumbs in your Shop Page.
You could use the woocommerce_before_main_content action.
function BannerShop(){
if(is_shop()){
echo '<img src="https://localhost/demosite/wp-content/uploads/2015/06/512x356.png" >';
}
}
add_action( 'woocommerce_before_main_content', 'BannerShop', 10 );
Here i show the before and after. BTW I don't know what theme are you using so it may be displayed different.
Before
https://i.stack.imgur.com/Mv2YK.jpg
After https://i.stack.imgur.com/nTfCa.jpg

Add text in this PHP code?

function woocommerce_template_product_description() {
wc_get_template( 'single-product/tabs/description.php' );
}
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_product_description', 20 );
This code prints a product description, but I'd like to add the text "Description:" before the description itself without having it on a separate line. How do I go about that? I am a total beginner when it comes to coding. Thanks!
In WordPress/WooCommerce Product are nothing but a Post. So the the product
description is treated as the_content of a post.
If you just want to add custom text/content before the Product Description then just use the_content filter.
Here is the code.
function theme_slug_filter_the_content($content)
{
//Only for single product page.
if (is_product())
{
$prepend = 'Description';
$content = $prepend . $content;
}
return $content;
}
add_filter('the_content', 'theme_slug_filter_the_content', 9); // <-- Choose some priority <
This code goes in function.php file of your active child theme (or theme) or also in any plugin file.
The code is tested and fully functional.
Reference
the_content
is_product
You have to locate the template file and edit the template file, so that it renders the desired output.
This loads a template file only
You need to edit that specific file "single-product/tabs/description.php"
and add a echo there.
Case-1 : Add "Description" in tab
Path : templates/single-product/tabs/description.php
<?php echo "<b>Description</b>"; the_content(); ?>
Case-2 : Add "Description" in Short description area
Path : templates/single-product/short-description.php
<?php echo "<b>Description</b>"; ?>
<?php echo apply_filters( 'woocommerce_short_description', $post->post_excerpt ) ?>

Woocommerce category page display this custom field before products

The code bellow, is to show a custom field I created to customize Woocommerce product category pages.. This code makes the custom field appear "after" the list of products. I need to make this code appear BEFORE the list of products... any hint on what I have to change in this bit of php code to make the custom field show before?
<?php
// Display details on product category archive pages
add_action( 'woocommerce_after_shop_loop', 'wpm_product_cat_archive_add_meta' );
function wpm_product_cat_archive_add_meta() {
$t_id = get_queried_object()->term_id;
$term_meta = get_option( "taxonomy_$t_id" );
$term_meta_content = $term_meta['custom_term_meta'];
if ( $term_meta_content != '' ) {
echo '<div class="woo-sc-box normal rounded full">';
echo apply_filters( 'the_content', $term_meta_content );
echo '</div>';
}
}
Thank you, I would really like to understand what makes the code appear after and not before, is the filter? in the last lines?
I found this bit of code at http://www.wpmusketeer.com/add-a-wysiwyg-field-to-woocommerce-product-category-page/
use below action to display custom fields before list of products
add_action('woocommerce_before_shop_loop','wpm_product_cat_archive_add_meta');

Categories