Magento Forums
Help
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

Move the product information to the below of product images

‎07-09-2018 03:31 AM
‎07-09-2018 03:31 AM

Move the product information to the below of product images

I am using Magento 2.2.4 and I need to move the product details which resides in the right side of the product to the below of product images. I have tried something like this. But it doesn't work. 

Inside catalog_product_view.xml,

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="product.info.main" destination="action-skip-wrapper" after="product.info.media"/>
    </body>
</page>

I need to do as follows. How can I do this ?You_Made_Me_a_Mother_-_2018-07-09_15.54.33.png

 

 

 

8 REPLIES 8
‎07-09-2018 08:43 PM
‎07-09-2018 08:43 PM

Re: Move the product information to the below of product images

Hi @senani_m,

 

Maybe you could check here if you've applied the right changes on your theme?

 

https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/layouts/xml-manage.html#layout_markup_rea...

 

 Can you check if the other blocks are present too? Maybe some reference is missing?

0 Kudos
‎07-09-2018 08:46 PM
‎07-09-2018 08:46 PM

Re: Move the product information to the below of product images

I have followed this one and made modifications. But now the details are not showing in the page. Do you have any idea to fix this?

0 Kudos
‎07-10-2018 09:22 AM
‎07-10-2018 09:22 AM

Re: Move the product information to the below of product images

Hi @senani_m,

 

Are you using Luma or a custom made theme?

0 Kudos
‎07-11-2018 09:16 PM
‎07-11-2018 09:16 PM

Re: Move the product information to the below of product images

I am using a custom theme extended from luma theme

0 Kudos
‎07-12-2018 04:01 PM
‎07-12-2018 04:01 PM

Re: Move the product information to the below of product images

Hi @senani_m,

 

I guess you should check the customization on Luma to be sure isn't a problem with your current theme.

 

 

0 Kudos
‎11-20-2018 02:05 AM
‎11-20-2018 02:05 AM

Re: Move the product information to the below of product images

Hello

 

Just do like this:-

 

<move element="product.info.main" destination="content" after="product.info.media"/>

0 Kudos
‎08-13-2019 02:54 PM
‎08-13-2019 02:54 PM

Re: Move the product information to the below of product images

This is a pure CSS thing. 
You need to set to the containers .product.media and .product-info-main

width: 100%;

instead of the current

width: 50%;

 

0 Kudos
‎08-13-2019 10:56 PM
‎08-13-2019 10:56 PM

Re: Move the product information to the below of product images

Hello @senani_m ,

I have checked that you are trying to move "​product.info.main" element in "action-skip-wrapper" but if we see the default catalog_product_view.xml of Magento_Catalog module, the "action-skip-wrapper" is just a class not any block or container name. So when magento tries to move the product.main.info in action-skip-wrapper it failed as it didn't get action-skip-wrapper element so it moved the product.main.info in random position.

Please check the default catalog_product_view.xml of Magento_Catalog module you get that the "​product.info.main" and "product.info.media" both are in content container. Now you need to move product.info.main in 'content' container after product.info.media by below code:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="product.info.main" destination="content" after="product.info.media"/>
    </body>
</page>

It will actually move your 'info' div after 'media' but it's visibility on the front end is still in it's older position it is just because the blank theme apply a css property of "float: right" to .product-info-main. Please check the file: 

https://github.com/magento/magento2/blob/2.3-develop/app/design/frontend/Magento/blank/Magento_Catal...

Please change this css property in your custom theme or module and then it is visible after gallery.

If this helps you then please give kudos and accept it as solution.

 

0 Kudos