Tagged: WooCommerce Single Product Page
-
AuthorPosts
-
October 23, 2015 at 6:57 pm #524065
Hello! We were wondering if you could possibly give us an advice on the following: we currently have our single product page displaying like this
https://aquaquestonline.com/product/best-waterproof-kayak-boating-canoe-backpack-bag-aqua-quest-mariner-20-litres/We would like the product image to be
1) larger and
2) display in the very center of the page above description etc, something like this (the general idea): http://www.patagonia.com/ca/product/black-hole-duffel-60-liters?p=49341-0Is that possible within our Enfold theme and if yes would you be able to advise how we could do that?
Addition: actually, we did figure out how to make the image large via CSS (.single-product-main-image { width: 50%!important; } ) so now we’d just like to find out how to make the product description to be under the product image and the Add to cart button and tabs (featured, specs etc) to be on the right the way it is now. Would you be able to advise?
Thank you,
Gear Out Here- This topic was modified 9 years, 1 month ago by gearouthere.
October 26, 2015 at 7:56 am #524685Hi gearouthere!
Thank you for using Enfold.
Set the width to 100% then modify the product summary:
.single-product-main-image { width: 100%; } .single-product-summary { overflow: visible; }
Since the sidebar is inside the image container, it will go below the main image, above the summary.
Best regards,
IsmaelOctober 26, 2015 at 11:26 pm #525231Hi Ismael,
thank you! sorry, could I just clarify a little? We’d want to leave the description up on top on the left, beside the image, but place the product features (the part in the tabs – down below the product. Another question here is – is it possible to take all the features info that is in the tabs and display it without tabs, just as text? I illustrated this idea on this screenshot:
https://aquaquestonline.com/wp-content/uploads/2015/10/single_prod_layout.jpg
And another question: is it possible to have a big fullscreen image on top of every product page above all the product info (featuring a big shot with that product) – perhaps via layer slider or wp slider? Or just an image, perhaps hard-coded?
Thank you,
Gear Out Here
October 29, 2015 at 7:48 am #526562Hi!
If you want to move the tabs under the image, add this in the functions.php file:
add_action('init', 'avf_move_product_output'); function avf_move_product_output() { remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 10 ); remove_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 1 ); add_action( 'woocommerce_after_single_product_summary', 'woocommerce_output_product_data_tabs', 5 ); }
I’m sorry but I don’t think it’s possible to turn the tabs into a simple description or text. This will require major modification in the config-woocommerce > config.php file. You can contact codeable for further modifications: http://kriesi.at/contact/customization
Best regards,
IsmaelOctober 31, 2015 at 1:38 am #527790Hi Ismael, thank you!
Another question we had: is it possible to have a big fullscreen image on top of every product page above all the product info (featuring a big shot with that product) – perhaps via layer slider or wp slider? Or just an image, perhaps hard-coded?
Thank you,
Gear Out Here
November 2, 2015 at 6:12 pm #528719Hi!
could be possible and would require a huge amount of customization of the theme. You can hire a freelancer for this job here. Maybe there is a plugin with such a function. You could try to ask WooCommerce support about such a function as well, maybe they have an idea for your.
Best regards,
AndyNovember 2, 2015 at 7:43 pm #528766Thank you Andy, we will look at our options!
November 2, 2015 at 8:37 pm #528781Just one more question on this topic: is Enfold compatible with Visual Composer? We found a plugin that could do what we need, but it uses visual composer…
November 3, 2015 at 8:22 am #529033Hi!
I’m sorry but the two builders (ALB and visual composer) don’t work well with each other. Please use the theme’s default builder. If you want to add a slider on top of the product page, switch to the advance layout builder. Note that third party extensions is not going to work properly if you use the ALB for products.
Regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.