Tagged: enfold, layout architect, price, woocommerce
-
AuthorPosts
-
January 5, 2016 at 5:12 pm #560024
Happy New Year!
There have been a couple of requests in the last year about the price display if you use the avia layout architect to build your product pages for WooCommerce. As for now the answer always was you have to manually put the price into the content or use the standard WooCommerce shortcode. However both solutions are only workarounds and Enfold users seem not be satisfied. Because I had the same issue now with a customer I had to find a better solution I would like to contribute to Enfold for free. Maybe Kriesi will implement it.
Please use the following diff (/enfold/config-templatebuilder/avia-shortcodes/product_snippet_button.php) :
+++ product_snippet_button.php 2016-01-05 15:44:05.100039389 +0100 @@ -64,6 +64,10 @@ if(!is_object($woocommerce) || !is_object($woocommerce->query) || empty($product)) return; // $product = wc_get_product(); + $price = $product->get_price(); + $html_price = '<p class="price">' . $product->get_price_html() . '</p>'; + $output .= apply_filters( 'avia_purchase_button_html_price', $html_price, $price, $product ); + $output .= "<div class='av-woo-purchase-button ".$meta['el_class']."'>"; ob_start(); wc_clear_notices();
This will output the price as you know it from WooCommerce above the purchase button by default using the standard css classes from WooCommerce. In addition you can modify the output by using the newly introduced filter ‘avia_purchase_button_html_price’ by putting the following lines into the functions.php of your child theme:
add_filter( 'avia_purchase_button_html_price', 'mmx_change_html_price', 10, 3 ); function mmx_change_html_price( $html, $price, $product ){ // build your new html code here e.g. $new_html = '<h1>' . $product->get_price_html() . '</h1>'; return $new_html; }
This will allow you to display the price from the purchase button in any way you want.
And for those wondering why the prices for variations got only displayed in the purchase button if at least one variation had a different price I have one more solution. Simply put the following code to your functions.php (dont forget to create a child theme):
add_filter( 'woocommerce_show_variation_price', 'mmx_always_display_variation_price', 10, 3 ); function mmx_always_display_variation_price( $bool, $product, $variation) { return 1; }
I hope you find this enhancement useful and we will see it in a future update of Enfold.
January 5, 2016 at 5:55 pm #560058I have added one more enhancement to the purchase button. Now you can select from the template builder element whether the price should be displayed or not. See the following diff containing the changes from the first diff as well.
+++ product_snippet_button.php 2016-01-05 16:48:15.570861449 +0100 @@ -27,6 +27,21 @@ $this->config['posttype'] = array('product',__('This element can only be used on single product pages','avia_framework')); } + function popup_elements() { + $this->elements = array( + array( + "name" => __("Display price", 'avia_framework' ), + "desc" => __("Should price be displayed?", 'avia_framework' ), + "id" => "display_price", + "type" => "select", + "std" => "yes", + "subtype" => array( + __('yes', 'avia_framework' ) =>'yes', + __('no', 'avia_framework' ) =>'no' + ) + ) + ); + } /** * Editor Element - this function defines the visual appearance of an element on the AviaBuilder Canvas @@ -57,6 +72,12 @@ */ function shortcode_handler($atts, $content = "", $shortcodename = "", $meta = "") { + + $atts = shortcode_atts( array( + 'display_price' => 'yes', + ), $atts, $this->config['shortcode']); + extract($atts); + $output = ""; $meta['el_class']; @@ -64,6 +85,12 @@ if(!is_object($woocommerce) || !is_object($woocommerce->query) || empty($product)) return; // $product = wc_get_product(); + if ( $display_price == "yes") { + $price = $product->get_price(); + $html_price = '<p class="price">' . $product->get_price_html() . '</p>'; + $output .= apply_filters( 'avia_purchase_button_html_price', $html_price, $price, $product ); + } + $output .= "<div class='av-woo-purchase-button ".$meta['el_class']."'>"; ob_start(); wc_clear_notices();
January 6, 2016 at 5:23 pm #560646Hi!
happy new year for you as well and thanks so much for sharing your solution with us! I think the community will profit from it a lot!
Regards,
AndyMay 9, 2016 at 12:49 am #628936@mensmaximus – Thanks for sharing. Adding the code to the child theme’s functions.php is no problem. However, I’m not familiar with how to add your other code snippets.
Do we create a new product_snippet_button.php file with your snippet code? Do we just add your snippet code to the existing product_snippet_button.php?
Why does your snippet code have “+” in it? It looks nothing like the existing code in the product_snippet_button.php.
Thank you,
RyanMay 9, 2016 at 7:13 am #629038Yes you create a new product_snippet_button.php by copying the original one into a child theme and applying the diff I provided (ask your developer, he knows about using the patch command in linux) to the copy. You have to load the modified shortcode and the other functions from the childs functions.php file.
A ready to download example can be found at https://mensmaximus.de/dokumente/enfold/woocommerce/purchase-button/enfold-child.zip. It has everything in it you need to get this running. If you already have a childtheme you have to “merge” both functions.php files.
Disclaimer: The code and zip file is provided as is. You should use it only if you understand how it is working. I am not liable to any damage caused by you not being able to implement this probably. Be advised I will not provide any support through this forum and I am not affiliated to kriesi.at.
May 9, 2016 at 2:44 pm #629247Appreciate the reply. I’m the “developer”, so I will have to teach myself this. My strength is design, but I really enjoy learning this stuff as I go along.
I’ll see if I can get this going in my dev environment.
May 9, 2016 at 3:50 pm #629297As already written the zip file contains a child theme ready to use including all functions and the modified shortcode.
May 10, 2016 at 6:05 pm #630159May 19, 2016 at 2:42 pm #635213Hi, also would like to use Woocommece short codes to show one product in in the Avia Layout. I install the the child theme from @mensmaximus .but it does not work.
May 20, 2016 at 4:57 am #635682Hi @someco,
Could you try to be a bit more specific as to what problems you are having please?
Best regards,
RikardJune 21, 2016 at 1:04 pm #651444Awesome thanks, can’t believe this is default!
June 22, 2016 at 7:24 am #651947October 24, 2016 at 12:26 pm #703222Hallo,
danke für den Workaround! Leider funktioniert das anscheinend (noch) nicht mit Varianten. Hat jemand eine Idee, wie ich den Variantenpreis bei Selektion mit ausgeben kann?
Beste Grüße,
ElmarOctober 27, 2016 at 5:14 am #704648Hi,
Did you use the last filter?
add_filter( 'woocommerce_show_variation_price', 'mmx_always_display_variation_price', 10, 3 ); function mmx_always_display_variation_price( $bool, $product, $variation) { return 1; }
Best regards,
IsmaelOctober 28, 2016 at 3:36 pm #705339Hi Ismael,
of course. It just shows the range and that range does not change if a variant is selected. We now created a custom javascript hack that extracts the variant prices but it is quite a hassle.
Best
ElmarNovember 1, 2016 at 2:45 pm #706723Hi,
glad you could find a solutin for it using a custom javascript hack.
Please let us know in a new ticket if you have some more question about the theme.Best regards,
Andy -
AuthorPosts
- The topic ‘WooCommerce products price display when using avia layout architect’ is closed to new replies.