0

How can i set thumbnail images to the left side? I set thumbnail image to vertical in view.xml but it displays a thumbnail image right side.

5

If you want to set the slider on the right side: -

1) Find the file
"app/design/frontend/[Your_Theme]/[Your_Theme]/etc/view.xml"
and look for these lines:

<vars module="Magento_Catalog">

<!- Gallery and magnifier theme settings. Start ->
        <var name="gallery">

Edit the line:

<var name="navdir">horizontal</var>

For:

<var name="navdir">vertical</var>

If you want to set slider on Left side:-

Step 1. Find the file "app/design/frontend/[Your_Theme]/[Your_Theme]/etc/view.xml" and look for these lines:

<vars module="Magento_Catalog">

<!- Gallery and magnifier theme settings. Start ->
        <var name="gallery">

Edit the line:

<var name="navdir">horizontal</var>

For:

<var name="navdir">vertical</var>

Step 2.

Put below code in custom.css

app/design/frontend/[Your_Theme]/[Your_Theme]/web/css

To see Immidiate changes put this code in pub's custom.css

pub/static/frontend/[Your_Theme]/[Your_Theme]/en_US/css

Add this line at the end of your css

.product.media .gallery-placeholder .fotorama__stage{ left: 0 !important; }
.product.media .gallery-placeholder .fotorama__nav-wrap--vertical.fotorama__nav-wrap{ right: 0; text-align: right;}
.product.media .gallery-placeholder .fotorama__nav--thumbs{float: right;}
1
  • Thank you @Jaimin for this code.this code is working but How can i customize .less css file for this?
    – Kushal
    Dec 20 '17 at 6:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.