Place product image navigation menu on top of image

Store Design
1

Hello everyone,

Is there a way to place the product image navigation menu on top of the image instead of below or beside? See image for what i mean by navigation menu.

IMG_3633.jpg
IMG_3633.jpg1170×1412 40.5 KB

2

@rb18

Hello,
Can You Please Share Your Store URL…

3

here it is!

https://d40128.myshopify.com/

password is piblan

4

@rb18
Hello,

@media only screen and (max-width: 767px){
.Product__SlideshowMobileNav.hidden-lap-and-up {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

Like This

oscprofessional_0-1666094271510.png
oscprofessional_0-1666094271510.png390×689 49.9 KB

5

Awesome sir, but can you also place it on the bottom of the image? sorry for the miscommunication when i said on top i meant on the image but on the bottom of the image. sorry again!

6

@rb18
Hello,

@media only screen and (max-width: 767px){
.Product__SlideshowMobileNav.hidden-lap-and-up {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}}

replace this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

Like This

oscprofessional_0-1666100799982.png
oscprofessional_0-1666100799982.png451×729 40 KB

7

thank u sir i tried that already but now the menu is sitting too low on the image. i would like the menu to be a little more to the top, just a small bit.

8

@rb18
Hello,

bottom : 0 

replace 

bottom : 10px;

replace code

This post is useful so please like and accept the post

9

thank u so much!

10

Do you also know how i can change the height of the header on my homespage? :blush: