Boundless Theme logo size in slideshow\header

Solved
SGR1
Tourist
6 0 2

Hi, I need to increase the size of my transparent logo in the boundless theme so it appears better within the slide show as shown below but the theme will not allow me to do so. 

Or alternatively, decrease the size of the slide show so it shows as part of the header.

Does anyone know how to do either of the above?

link to page - https://sunglassesrepublic.ie/

Screen Shot 2021-06-14 at 4.42.22 PM.png

KetanKumar
Shopify Partner
20634 2141 7813

@SGR1 

sorry for that issue 

i have checked bt i can't see any logo can you please upload so i will check and let you know

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
SGR1
Tourist
6 0 2

Thanks for getting back, I just uploaded it, it's quite small but its there within slideshow.

0 Likes
bdowling
Explorer
66 13 39

Hi, I have a couple solutions that should help make your logo more visible.

Option A: Try making the source file for your logo have wider height/width ratio and then in the site editor play around with larger numbers for "custom logo width". That should help increase the size of the logo.

Option B: You can also add a background color to your header which could make the logo more visible without getting lost in the slide show images.

Find this chunk of code near line 3377 in "theme.scss.liquid" of the assets folder:

 

 

 

.site-header__inner {
  position: relative;
  height: $height-site-header;
  padding: 0 ($gutter-site / 2);
  background-color: $color-navigation-bg;
  z-index: $z-index-site-header;

  .template-index & {
    background-color: transparent;
  }
}

 

 

 

and change the "background-color: transparent;" to another color like "background-color: #000000"  (for a black header background).

I hope these options help. Good luck



0 Likes
SGR1
Tourist
6 0 2

The custom logo width setting doesn't do anything when increasing the size of the logo, it must be locked within some of the code, do you know where we can change that?

Thanks

0 Likes
bdowling
Explorer
66 13 39

Did you change the dimensions of the height to width ratio for the source file first? That step is important. 

0 Likes
SGR1
Tourist
6 0 2

logo_transparent.png

0 Likes
SGR1
Tourist
6 0 2

that's the logo above, this won't let me attach it as a file as png is not supported. It looks like it's of size. What should I resize it to and what program could I use on a MAC?

0 Likes
bdowling
Explorer
66 13 39

The "Custom logo Width" will not change anything after a certain cutoff, based on the size of the logo file. My guess is your transparent logo file has a lot of extra transparent space -- it looks like the top and bottom have a lot of room to cut off. If you could crop out most of that extra space, it should become responsive to larger custom logo width values.

As far as which program to use, I do not know since I don't have a mac. I usually use inkscape which I think is cross platform. There may even be some custom image croppers online too. Good luck 

0 Likes
SGR1
Tourist
6 0 2

That worked by cropping it, thanks! A separate question, do you know a way to remove the slide show dots and pause button for each image? It doesn't look very clean. 

https://sunglassesrepublic.ie/