We are an online store that sells promotional stuff in the UK. I’m designing our webpage with WordPress + WooCommerce and everything is almost ready, but I need some modifications on WooCommerce product page.
There are 2 types of products:
a) Local product.- It shows simple product images in a nice format.
b) External iFrame product.- It loads an iFrame instead of the product image. This iFrame is used for customizing products through an external API that loads into the iFrame (this is already working fine).
Most products are external products and I have only two local products named ‘Test’ and ‘Rome souvenirs (test)’, created precisely for testing purposes.
1. Move all the product information (title, quantity, add to basket button, etc.) to the left and remove the empty space left by the product image. This should be done for local products, but also for products that load the iFrame instead of the product image. At the moment, it looks weird (see attached images).
2. Re-locate the variation’s selectors to a more appealing place. I tried to relocate them below the product image, but they look horrible right in the middle of the page. Everything looks very cluttered.
3. Show several product’s images for the local products (those that don’t load the iFrame). At the moment, they only allow 1 product image.
• I need everything to be done on the child template, not on the original template.
• I need the PHP or CSS codes at the end of the work, as well as a brief description of the files that were modified to achieve these three activities.