woocommerce add information after price WordPress
- SOLVED
Hello
I am using woocommerce on a website with Mystile woo theme.
I would like to add a short note after the price which the user can add to the product
(E.G - this product grants you 30 stars credit...)
and also pass it onto the checkout page as a small note and also include it in the email sent to the client after he purchased the product (service in my case)
letting him know how much he paid and how many credits he get (in my case it goes with how many stars..)
I was thinking about going with simple custom field and succeeded
but I also need to show this note in the checkout page and include it in the email sent to the user
when purchasing the package.
that I don't know how to accomplish.
Thanks
Gil
Answers (1)
Giri answers:
create a file like this in your theme folder
mystile/woocommerce/single-product/price.php
Paste the following content there..
<?php
/**
* Single Product Price, including microdata for SEO
*
* @author WooThemes
* @package WooCommerce/Templates
* @version 1.6.4
*/
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
global $post, $product;
?>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<p itemprop="price" class="price"><?php echo $product->get_price_html(); ?></p>
<meta itemprop="priceCurrency" content="<?php echo get_woocommerce_currency(); ?>" />
<link itemprop="availability" href="http://schema.org/<?php echo $product->is_in_stock() ? 'InStock' : 'OutOfStock'; ?>" />
</div>
<div class="starsinfo">
<p>This package will grant you 30 stars.. Star images goes here</p>
</div>
Giri comments:
As for the checkout check the following templates..
[[LINK href="https://github.com/woothemes/woocommerce/tree/master/templates/checkout"]]https://github.com/woothemes/woocommerce/tree/master/templates/checkout[[/LINK]]
Copy the required template in your folder.
For example
copy the following template
https://github.com/woothemes/woocommerce/blob/master/templates/checkout/review-order.php
to your
mystile/woocommerce/single-product/checkout/review-order.php
Modify the code where you need.
hamergil comments:
Hi
I copied the file like you suggested:
mystile/woocommerce/single-product/price.php
as a first step.
nothing is hapenning.. I don't see anything.
also you put the note:
<div class="starsinfo">
<p>This package will grant you 30 stars.. Star images goes here</p>
</div>
I dont see how it is dynamic. I think we should use a custom field or something.
let me know what I am missing...
Giri comments:
@hamergil
Ofcourse that starsinfo div is not dynamic for now. Before we jump into dynamic content, lets just make sure we are editing the correct file.
According to woocommerce docs we can override the template like I said.
check this page..
[[LINK href="http://docs.woothemes.com/document/template-structure/"]]http://docs.woothemes.com/document/template-structure/[[/LINK]]
Are you sure you have done all the steps correctly?
hamergil comments:
yeah.
created a file called: price.php, pasted the content you put above
and uploaded to my theme folder here:
wooshop/woocommerce/single-product/price.php
(I renamed my theme name to "wooshop")
where do I need to see the "starsinfo" div? in the checkout page?
if so, I dont see it there..
Giri comments:
No I've given the code only for single product page.
Do one thing. Just restore all the changes you have made.
Add the following code in your functions.php file
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_startsinfo', 11 );
function woocommerce_template_single_startsinfo() { ?>
echo '<div class="starsinfo">
<p>This package will grant you 30 stars.. Star images goes here</p>
</div>';
<?php }
If you see "This package will grant you 30 stars.. Star images goes here" text under your single product page price. Then we are on the right track.
If that works let me know. We will make it dynamic
Giri comments:
If the above code output correctly, then lets move on to dynamic.. Copy the following code and paste it in your functions.php file.
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_startsinfo', 11 );
function woocommerce_template_single_startsinfo() { ?>
global $post;
$postid = $post->ID;
$starscount = get_post_meta( $postid, '_stars_count', true );
echo '<div class="starsinfo">
<p>This package will grant you '.$starscount.' stars.. Star images goes here</p>
</div>';
<?php }
/* Add custom meta box for 'stars' */
add_action( 'add_meta_boxes', 'stars_info_create_meta_boxes' );
/* Save metabox data. */
add_action( 'save_post', 'stars_info_save_meta_boxes', 10, 2 );
/**
* Add stars Info Meta Box.
*
* @since 0.1
*/
function stars_info_create_meta_boxes() {
add_meta_box( 'stars_info_metabox', esc_html__( 'stars Info', 'stars-info' ), 'stars_info_class_meta_box', 'product', 'side', 'core' );
}
/**
* Display the stars info meta box.
*
* @since 0.1
*/
function stars_info_class_meta_box( $object, $box ) { ?>
<?php wp_nonce_field( basename( __FILE__ ), 'stars_info_meta_box_nonce' ); ?>
<?php do_action( 'stars_info_before_fields', $object->ID ); // Add action hook before output. ?>
<p>
<label for="stars_count"><?php _e( "Starts Value.", 'stars-info' ); ?></label>
<br />
<input class="widefat" type="text" name="stars_count" id="stars_count" value="<?php echo esc_attr( get_post_meta( $object->ID, '_stars_count', true ) ); ?>" size="30" />
</p>
<?php do_action( 'stars_info_after_fields', $object->ID ); // Add action hook after output. ?>
<?php
}
/**
* Save data from stars info meta box.
*
* @since 0.1
*/
function stars_info_save_meta_boxes( $post_id, $post ) {
/* Verify the nonce before proceeding. */
if ( !isset( $_POST['stars_info_meta_box_nonce'] ) || !wp_verify_nonce( $_POST['stars_info_meta_box_nonce'], basename( __FILE__ ) ) )
return $post_id;
/* Check autosave. */
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
return $post_id;
/* Get the post type object. */
$post_type = get_post_type_object( $post->post_type );
/* Check if the current user has permission to edit the post. */
if ( !current_user_can( $post_type->cap->edit_post, $post_id ) )
return $post_id;
/* Get meta keys links in an array and save. */
$stars_meta_info_all = apply_filters( 'stars_info_metabox_fields_save', array(
'stars_count',
)
);
/* Loop through all the links. */
foreach ( $stars_meta_info_all as $stars_meta_info ) {
/* Get the posted data and sanitize it for use as an link. */
$new_meta_value = ( isset( $_POST[ $stars_meta_info ] ) ? $_POST[ $stars_meta_info ] : '' );
/* Get the meta key like this: _stars_count. */
$meta_key = '_' . $stars_meta_info;
/* Get the meta value of the custom field key. */
$meta_value = get_post_meta( $post_id, $meta_key, true );
/* If a new meta value was added and there was no previous value, add it. */
if ( $new_meta_value && '' == $meta_value )
add_post_meta( $post_id, $meta_key, $new_meta_value, true );
/* If the new meta value does not match the old value, update it. */
elseif ( $new_meta_value && $new_meta_value != $meta_value )
update_post_meta( $post_id, $meta_key, $new_meta_value );
/* If there is no new meta value but an old value exists, delete it. */
elseif ( '' == $new_meta_value && $meta_value )
delete_post_meta( $post_id, $meta_key, $meta_value );
}
/* Save updated date. */
/* Get the posted data and sanitize it for use as an date. */
$new_meta_value = ( isset( $_POST['stars_count'] ) ? $_POST['stars_count'] : '' );
/* Get the meta key like this: _stars_count. */
$meta_key = '_stars_count';
/* Get the meta value of the custom field key. */
$meta_value = get_post_meta( $post_id, $meta_key, true );
/* If a new meta value was added and there was no previous value, add it. */
if ( $new_meta_value && '' == $meta_value )
add_post_meta( $post_id, $meta_key, $new_meta_value, true );
/* If the new meta value does not match the old value, update it. */
elseif ( $new_meta_value && $new_meta_value != $meta_value )
update_post_meta( $post_id, $meta_key, $new_meta_value );
/* If there is no new meta value but an old value exists, delete it. */
elseif ( '' == $new_meta_value && $meta_value )
delete_post_meta( $post_id, $meta_key, $meta_value );
}
hamergil comments:
Hi
The first code worked but without the "echo"
like so:
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_startsinfo', 11 );
function woocommerce_template_single_startsinfo() { ?>
<div class="starsinfo">
<p>This package will grant you 30 stars.. Star images goes here</p>
</div>
<?php }
the second long code gave me an error. can you please check?
Thanks
hamergil comments:
This is my function.php
see if you can add the code to that file and send it back
there is a place there with comment:
/*-----------------------------------------------------------------------------------*/
/* You can add custom functions below */
/*-----------------------------------------------------------------------------------*/
I think it will be faster
Thanks
hamergil comments:
Not sure I attached the file.
here it is again
Giri comments:
I couldn't see your functions.php file.
Here I created a gist for you. Copy and paste.
[[LINK href="https://gist.github.com/mistergiri/5748061"]]https://gist.github.com/mistergiri/5748061[[/LINK]]
Let me know.
hamergil comments:
I attached it but the upload here is probably not working
please download the file from here:
https://dl.dropboxusercontent.com/u/4405634/functions.zip
it's a custom woothemes function.php file, therefore your code needs to have some adjustments
because the way I put it gives me this error:
https://dl.dropboxusercontent.com/u/4405634/shop-error.jpg
it looks like we are in the right way but some syntax issues are delaying the completion
of this job.
Thanks
Giri comments:
Here is the modified file..
https://www.dropbox.com/s/g6xct8j8nb32nm5/functions.zip
Giri comments:
Please note one thing... You will see a meta box names "stars info" in every products (admin side). Try editing a product. You have to enter the value and click update button..
hamergil comments:
ok
now it is showing
<strong>This package will grant you stars.. Star images goes here</strong>
what's the next step? how do I change the stars value? (e.g- 30, 35, 40 etc etc)
I saw that the function added new meta box on the right called:
"Stars Info" with the parameter: Starts Value.
tried add number and it didn't work on the site.
is that what I had to do?
Giri comments:
Here this one fixes that value bug.
https://www.dropbox.com/s/g6xct8j8nb32nm5/functions.zip
hamergil comments:
OK
it is now working!
we are almost there..
1. Remember that I need to show this in the checkout page
under the "Order Notes" like this:
[[LINK href="https://dl.dropboxusercontent.com/u/4405634/checkout.jpg"]]https://dl.dropboxusercontent.com/u/4405634/checkout.jpg[[/LINK]]
<strong>(mentioned above)</strong>
2. This short information has to be sent via email to the client <strong>(mentioned above)</strong>
3. Is it possible to show the custom field with all the text: "This package will grant you 85 stars.."
Only if there is a value in it?
Thanks
Giri comments:
I've added some codes.
Here is the file.
https://www.dropbox.com/s/g6xct8j8nb32nm5/functions.zip
Please note:
Your 3rd point has been fixed. Current fix adds messages in both checkout form and email. However the value will not work in checkout and email. Its because single product page holds only one value. So its easy to display. Checkout page actually calculates total. So I think its not possible to display without additional effort. I kind of feel like i'm overworking for 10 bucks. Would you like to increase the prize money?
hamergil comments:
Hi
First of all you are doing a great job and I am willing to increase the prize money.
I didn't do it in the beginning because I thought it would be easier.
so for now, I checked and I don't see the value in the checkout page as I wanted.
if I increase the prize money would everything work perfectly?
I can double the prize money if that's OK with you
let me know
Giri comments:
Yes increase the prize money. I'll make it work. Thanks
hamergil comments:
Done
please make sure I see the "stars" field in the checkout under "special notes"
as well as sent to the client.
let me know when it's ready
Thanks a lot.
Giri comments:
I have one more question..
Lets say you have two products
product 1
product 2
product 1 grant 25 stars.
product 2 grant 35 stars.
Question 1 :
If the user adds both products,
then the checkout page and email should display message like
This package will grant you 60 stars right?
Question 2:
What if the user increase the quantity of same product? Will the stars also increase or it should be the same?
hamergil comments:
I'll get you answers soon
please do not proceed until I get an answer
thanks
Giri comments:
Ok I have made both.
https://www.dropbox.com/s/g6xct8j8nb32nm5/functions.zip
https://www.dropbox.com/s/hqohfbn5dygsifx/quantity.zip
First one is item based. I mean
product 1 grant 25 stars.
product 2 grant 35 stars.
If the user adds both products,
then the checkout page and email will display message like
This package will grant you 60 stars. (its not quantity based)
Second file is quantity based.
Try them and let me know.
Also note: I have not test email template. So test it and let me know
hamergil comments:
Hey Viruthagiri
Great Job
I might need you for more tweaks
like adding the same info also to the cart page etc etc
but that will be later.
I will contact you later regarding more stuff
I will go ahead and reward the prize for you
Thanks a lot!
GIl