Uploaded logo won't show up on password page

Alphatype
Tourist
6 0 2

Hello, I am trying to upload my store logo onto my password page and whenever I do it simply does not show up. It just turns blank without the logo or store name. Ive added the same logo to my other pages but for some reason just wont work on the password page.

Replies 151 (151)

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @Alphatype 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

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
Alphatype
Tourist
6 0 2

Hello Ketan,

Thanks for helping me with this. My website is www.alphatypeclothing.com. I currently have the image uploaded but as you can see its not showing up.

 

Thanks.

KetanKumar
Shopify Partner
36839 3635 11972

Thanks.

I need your store login details. Yes, I know your login details are confidential. For this second option, I have added your store to my Shopify partner account so I will check your code easily and manage what you think about it?
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
Alphatype
Tourist
6 0 2

Ok, is there a way to private message you the login info?

Alphatype
Tourist
6 0 2

Now I am trying to login my website and it seems to be down for some reason. It says theres a problem loading the website. Do you know what the issue is?

KetanKumar
Shopify Partner
36839 3635 11972

@Alphatype 

Thanks, i will check.

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
Alphatype
Tourist
6 0 2

@KetanKumar were you able to find out the issue yet? 

marapp
Visitor
1 0 1

I'm having the same issue on a store I just started. Any update?

KetanKumar
Shopify Partner
36839 3635 11972

@marapp @Alphatype 

i haven't received any PM

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
Alphatype
Tourist
6 0 2

@KetanKumar 

I sent you it on 7/29. Im trying to send it again and it says I reached the limit to send private messages. Please send me a PM so I can reply back to you with the info.

OJ2020
Visitor
1 0 0

Any update on this?  We're having the same problem here 😞

AndrewBarton
Visitor
1 0 0

Me too having the same issue.

DMasters
Tourist
4 0 4

I am having the same problem, new site, Debut liquid theme. Added logo under header for the password page, doesn't show up. In searching the threads there are a bunch of users recently replying to years old posts about the same issue. Has anyone here resolved this yet?

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @DMasters 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

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
MissArdour
Visitor
2 0 4
Missardour.com

I needed help to in regards the logo not showing up
DMasters
Tourist
4 0 4

@KetanKumar PM'd you.

Eric203
Visitor
2 0 2

Hi Ketan,

I'm having the same issue with my debut theme. Is this a theme issue or user error? My url is nozou.com

KetanKumar
Shopify Partner
36839 3635 11972

@Eric203 

Welcome to the Shopify community!
and Thanks for your Good question.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.password-main__inner .site-header__logo-image img {display: inline-block !important;}

 

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
Eric203
Visitor
2 0 2

Awesome that worked,

thank you very much!

KetanKumar
Shopify Partner
36839 3635 11972

@Eric203 

Thanks for the update and your compliments 

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
DMasters
Tourist
4 0 4

@KetanKumar Your solution also fixed my issue. Thanks!

KetanKumar
Shopify Partner
36839 3635 11972

@DMasters 

Thanks for update.

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
ernestosf
Visitor
1 0 1

Hello Ketan, how are you?

 

I tried following your instructions but didn't work, it now appears as a broken image link: https://d.pr/i/MECve6

 

Could you please advise? if it helps, here a video of the instructions I followed. https://d.pr/v/plqs8S

 

I appreciate your assistance! Thank you.

 

Ernesto

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @ernestosf 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

 

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
Hakeem74
Visitor
2 0 1

Hello 

After attempting the same solution, I get the same result.

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @Hakeem74 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

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
Hakeem74
Visitor
2 0 1
KetanKumar
Shopify Partner
36839 3635 11972

all please share your password page header code so i will update here

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
fohnhome
Visitor
2 0 0

Hi Ketan,

I am also experiencing the same issue as some. Entered code but image showing as broken. Account fohn-home.myshopify.com

Thanks

KetanKumar
Shopify Partner
36839 3635 11972

@fohnhome 

Welcome to the Shopify community!
and Thanks for your question.

please share password page header code so i will update code.

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
fohnhome
Visitor
2 0 0

How do I locate my password page header code? 

Woobear
Visitor
1 0 0

Hi Ketan,

I am also experiencing the same issue! Entered code but image showing as broken. Account https://woobear-co.myshopify.com

Thanks

Woobear

ElviraMtl
Visitor
2 0 1

Same issue.

Please fix it on Shopify end. I am not a code expert.

The logo or image are supposed to show just like they do on all other pages.

I tried pasting the code you provided, and it just show an image icon or worse- the name of the image.

Also, I'd like an option of not showing "enter your password".

www.elfa.ca

Bobokrae
Visitor
1 0 0

@KetanKumar

I have the same issue, can you also help me with this?

My page is www.nimbuspcgaming.com

Prodeusor
Visitor
2 0 0

Hi @KetanKumar

I'm getting the same results as some others. Can you please help? https://deusmagazine.com/password

KetanKumar
Shopify Partner
36839 3635 11972

@Prodeusor 

can you please share password header section code

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
Prodeusor
Visitor
2 0 0

@KetanKumaris this correct?

2666

.password-header {
height: 85px;
display: table-row; }

KetanKumar
Shopify Partner
36839 3635 11972

no sorry wrong 

if possible to this way 

I need your store login details. Yes, I know your login details are confidential. For this second option, I have added your store to my Shopify partner account so I will check your code easily and manage what you think about it?

so i will fix less than 10 min

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
Magpie2212
Excursionist
15 0 6

Hi Ketan,

I am having the same issue. I added the code that you put in this thread earlier and it is now coming up as a broken image.

My website is https://magpieandmama.com/

Thanks!

ElviraMtl
Visitor
2 0 1

The issue is with the theme.

I had to put the password page on another theme and it's fine.

Please fix the issue with the Debut theme and let me know, as I'd prefer everything to be on one theme.

www.elfa.ca

KetanKumar
Shopify Partner
36839 3635 11972

Hello, @ElviraMtl 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your password header code,
So I will check and provide a solution here.

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
KetanKumar
Shopify Partner
36839 3635 11972

@Magpie2212 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your password header code,
So I will check and provide a solution here.

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
Magpie2212
Excursionist
15 0 6

Where can I find my password header code?

Magpie2212
Excursionist
15 0 6

Is this the password header code?:

<div class="password-content">
{% if section.settings.logo %}
{%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
<a href="{{ routes.root_url }}" itemprop="url" class="site-header__logo-image" data-image-loading-animation>
{% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
<img class="lazyload js"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
data-sizes="auto"
alt="{{ logo_alt | escape }}"
style="max-width: {{ section.settings.logo_max_width }}px">
<noscript>
{% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
<img src="{{ section.settings.logo | img_url: image_size }}"
srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x"
alt="{{ section.settings.logo.alt | default: shop.name }}"
itemprop="logo"
style="max-width: {{ section.settings.logo_max_width }}px;">
</noscript>
</a>
{% else %}
<h1 class="site-header__logo-link">
<span class="logo">{{ shop.name }}</span>
</h1>
{% endif %}

<span class="h2 password-content__title">{{ section.settings.header | escape }}</span>
</div>


{% schema %}
{
"name": {
"cs": "Záhlaví",
"da": "Overskrift",
"de": "Titel",
"en": "Header",
"es": "Encabezado",
"fi": "Ylätunniste",
"fr": "En-tête",
"hi": "हैडर",
"it": "Header",
"ja": "ヘッダー",
"ko": "헤더",
"nb": "Header",
"nl": "Koptekst",
"pl": "Nagłówek",
"pt-BR": "Cabeçalho",
"pt-PT": "Cabeçalho",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Üstbilgi",
"vi": "Đầu trang",
"zh-CN": "标头",
"zh-TW": "標頭"
},
"settings": [
{
"type": "image_picker",
"id": "logo",
"label": {
"cs": "Obrázek loga",
"da": "Logobillede",
"de": "Logo-Foto",
"en": "Logo image",
"es": "Logo",
"fi": "Logokuva",
"fr": "Image du logo",
"hi": "लोगो इमेज",
"it": "Immagine del logo",
"ja": "ロゴ画像",
"ko": "로고 이미지",
"nb": "Logobilde",
"nl": "Afbeelding van logo",
"pl": "Obraz logo",
"pt-BR": "Imagem do logotipo",
"pt-PT": "Imagem do logótipo",
"sv": "Logobild",
"th": "รูปภาพโลโก้",
"tr": "Logo görseli",
"vi": "Hình ảnh logo",
"zh-CN": "logo 图片",
"zh-TW": "標誌圖片"
}
},
{
"type": "range",
"id": "logo_max_width",
"label": {
"cs": "Šířka vlastního loga",
"da": "Tilpasset logobredde",
"de": "Logobreite",
"en": "Custom logo width",
"es": "Ancho del logo personalizado",
"fi": "Mukautetun logon leveys",
"fr": "Largeur personnalisée du logo",
"hi": "कस्टम लोगो की चौड़ाई",
"it": "Larghezza logo personalizzato",
"ja": "ロゴの幅をカスタマイズする",
"ko": "사용자 지정 로고 폭",
"nb": "Tilpasset logobredde",
"nl": "Aangepaste logo-breedte",
"pl": "Niestandardowa szerokość logo",
"pt-BR": "Largura do logotipo personalizado",
"pt-PT": "Largura de logótipo personalizada",
"sv": "Anpassad logotypsbredd",
"th": "ความกว้างของโลโก้แบบกำหนดเอง",
"tr": "Özel logo genişliği",
"vi": "Chiều rộng logo tùy chỉnh",
"zh-CN": "自定义 logo 宽度",
"zh-TW": "自訂商標寬度"
},
"min": 50,
"max": 500,
"step": 10,
"unit": "px",
"default": 100
},
{
"type": "text",
"id": "header",
"label": {
"cs": "Nadpis",
"da": "Overskrift",
"de": "Titel",
"en": "Heading",
"es": "Título",
"fi": "Otsake",
"fr": "En-tête",
"hi": "शीर्षक",
"it": "Heading",
"ja": "見出し",
"ko": "제목",
"nb": "Overskrift",
"nl": "Kop",
"pl": "Nagłówek",
"pt-BR": "Título",
"pt-PT": "Título",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Başlık",
"vi": "Tiêu đề",
"zh-CN": "标题",
"zh-TW": "標題"
},
"default": {
"cs": "Připravujeme",
"da": "Kommer snart",
"de": "Demnächst",
"en": "Coming Soon",
"es": "Próximamente",
"fi": "Tulossa pian",
"fr": "En construction",
"hi": "जल्द आ रहा है",
"it": "Presto disponibile",
"ja": "まもなく公開",
"ko": "곧 출시 예정",
"nb": "Kommer snart",
"nl": "Binnenkort",
"pl": "Już wkrótce",
"pt-BR": "Em breve",
"pt-PT": "Em breve",
"sv": "Kommer snart",
"th": "เร็วๆ นี้",
"tr": "Çok Yakında",
"vi": "Sắp ra mắt",
"zh-CN": "即将推出",
"zh-TW": "即將推出"
}
}
]
}
{% endschema %}

KetanKumar
Shopify Partner
36839 3635 11972

@Magpie2212 

Thanks for code 

can you please add the below code

<div class="password-content">
{% if section.settings.logo %}
{%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
<a href="{{ routes.root_url }}" itemprop="url" class="site-header__logo-image" data-image-loading-animation>
{% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
<img class="lazyload js" src="{{ section.settings.logo | img_url: image_size }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
data-sizes="auto"
alt="{{ logo_alt | escape }}"
style="max-width: {{ section.settings.logo_max_width }}px">
<noscript>
{% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
<img src="{{ section.settings.logo | img_url: image_size }}"
srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x"
alt="{{ section.settings.logo.alt | default: shop.name }}"
itemprop="logo"
style="max-width: {{ section.settings.logo_max_width }}px;">
</noscript>
</a>
{% else %}
<h1 class="site-header__logo-link">
<span class="logo">{{ shop.name }}</span>
</h1>
{% endif %}

<span class="h2 password-content__title">{{ section.settings.header | escape }}</span>
</div>


{% schema %}
{
"name": {
"cs": "Záhlaví",
"da": "Overskrift",
"de": "Titel",
"en": "Header",
"es": "Encabezado",
"fi": "Ylätunniste",
"fr": "En-tête",
"hi": "हैडर",
"it": "Header",
"ja": "ヘッダー",
"ko": "헤더",
"nb": "Header",
"nl": "Koptekst",
"pl": "Nagłówek",
"pt-BR": "Cabeçalho",
"pt-PT": "Cabeçalho",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Üstbilgi",
"vi": "Đầu trang",
"zh-CN": "标头",
"zh-TW": "標頭"
},
"settings": [
{
"type": "image_picker",
"id": "logo",
"label": {
"cs": "Obrázek loga",
"da": "Logobillede",
"de": "Logo-Foto",
"en": "Logo image",
"es": "Logo",
"fi": "Logokuva",
"fr": "Image du logo",
"hi": "लोगो इमेज",
"it": "Immagine del logo",
"ja": "ロゴ画像",
"ko": "로고 이미지",
"nb": "Logobilde",
"nl": "Afbeelding van logo",
"pl": "Obraz logo",
"pt-BR": "Imagem do logotipo",
"pt-PT": "Imagem do logótipo",
"sv": "Logobild",
"th": "รูปภาพโลโก้",
"tr": "Logo görseli",
"vi": "Hình ảnh logo",
"zh-CN": "logo 图片",
"zh-TW": "標誌圖片"
}
},
{
"type": "range",
"id": "logo_max_width",
"label": {
"cs": "Šířka vlastního loga",
"da": "Tilpasset logobredde",
"de": "Logobreite",
"en": "Custom logo width",
"es": "Ancho del logo personalizado",
"fi": "Mukautetun logon leveys",
"fr": "Largeur personnalisée du logo",
"hi": "कस्टम लोगो की चौड़ाई",
"it": "Larghezza logo personalizzato",
"ja": "ロゴの幅をカスタマイズする",
"ko": "사용자 지정 로고 폭",
"nb": "Tilpasset logobredde",
"nl": "Aangepaste logo-breedte",
"pl": "Niestandardowa szerokość logo",
"pt-BR": "Largura do logotipo personalizado",
"pt-PT": "Largura de logótipo personalizada",
"sv": "Anpassad logotypsbredd",
"th": "ความกว้างของโลโก้แบบกำหนดเอง",
"tr": "Özel logo genişliği",
"vi": "Chiều rộng logo tùy chỉnh",
"zh-CN": "自定义 logo 宽度",
"zh-TW": "自訂商標寬度"
},
"min": 50,
"max": 500,
"step": 10,
"unit": "px",
"default": 100
},
{
"type": "text",
"id": "header",
"label": {
"cs": "Nadpis",
"da": "Overskrift",
"de": "Titel",
"en": "Heading",
"es": "Título",
"fi": "Otsake",
"fr": "En-tête",
"hi": "शीर्षक",
"it": "Heading",
"ja": "見出し",
"ko": "제목",
"nb": "Overskrift",
"nl": "Kop",
"pl": "Nagłówek",
"pt-BR": "Título",
"pt-PT": "Título",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Başlık",
"vi": "Tiêu đề",
"zh-CN": "标题",
"zh-TW": "標題"
},
"default": {
"cs": "Připravujeme",
"da": "Kommer snart",
"de": "Demnächst",
"en": "Coming Soon",
"es": "Próximamente",
"fi": "Tulossa pian",
"fr": "En construction",
"hi": "जल्द आ रहा है",
"it": "Presto disponibile",
"ja": "まもなく公開",
"ko": "곧 출시 예정",
"nb": "Kommer snart",
"nl": "Binnenkort",
"pl": "Już wkrótce",
"pt-BR": "Em breve",
"pt-PT": "Em breve",
"sv": "Kommer snart",
"th": "เร็วๆ นี้",
"tr": "Çok Yakında",
"vi": "Sắp ra mắt",
"zh-CN": "即将推出",
"zh-TW": "即將推出"
}
}
]
}
{% endschema %}
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
Magpie2212
Excursionist
15 0 6

Hi @KetanKumar 

This has worked but there is now a grey box behind the logo and the logo itself is really pixelated.

Any way to resolve this?

Thanks

KetanKumar
Shopify Partner
36839 3635 11972

@Magpie2212 

Thanks for update

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

.site-header__logo-image {
background: transparent;
}

 

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
Magpie2212
Excursionist
15 0 6

This has got rid of the grey box but the logo is still very pixelated. The pixelation shouldn't be an issue with the image itself as it's the same image that has been used on the live website and that one isn't pixelated.

Thanks

KetanKumar
Shopify Partner
36839 3635 11972

@Magpie2212 

Thanks for feedback

can you please update the password header code

<div class="password-content">
{% if section.settings.logo %}
{%- assign img_url = section.settings.logo | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
<a href="{{ routes.root_url }}" itemprop="url" class="site-header__logo-image" data-image-loading-animation>
{% capture logo_alt %}{{ section.settings.logo.alt | default: shop.name }}{% endcapture %}
<img class="lazyload js" src="{{ section.settings.logo | img_url: 'master' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ section.settings.logo.aspect_ratio }}"
data-sizes="auto"
alt="{{ logo_alt | escape }}"
style="max-width: {{ section.settings.logo_max_width }}px">
<noscript>
{% capture image_size %}{{ section.settings.logo_max_width | escape }}x{% endcapture %}
<img src="{{ section.settings.logo | img_url: image_size }}"
srcset="{{ section.settings.logo | img_url: image_size }} 1x, {{ section.settings.logo | img_url: image_size, scale: 2 }} 2x"
alt="{{ section.settings.logo.alt | default: shop.name }}"
itemprop="logo"
style="max-width: {{ section.settings.logo_max_width }}px;">
</noscript>
</a>
{% else %}
<h1 class="site-header__logo-link">
<span class="logo">{{ shop.name }}</span>
</h1>
{% endif %}

<span class="h2 password-content__title">{{ section.settings.header | escape }}</span>
</div>


{% schema %}
{
"name": {
"cs": "Záhlaví",
"da": "Overskrift",
"de": "Titel",
"en": "Header",
"es": "Encabezado",
"fi": "Ylätunniste",
"fr": "En-tête",
"hi": "हैडर",
"it": "Header",
"ja": "ヘッダー",
"ko": "헤더",
"nb": "Header",
"nl": "Koptekst",
"pl": "Nagłówek",
"pt-BR": "Cabeçalho",
"pt-PT": "Cabeçalho",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Üstbilgi",
"vi": "Đầu trang",
"zh-CN": "标头",
"zh-TW": "標頭"
},
"settings": [
{
"type": "image_picker",
"id": "logo",
"label": {
"cs": "Obrázek loga",
"da": "Logobillede",
"de": "Logo-Foto",
"en": "Logo image",
"es": "Logo",
"fi": "Logokuva",
"fr": "Image du logo",
"hi": "लोगो इमेज",
"it": "Immagine del logo",
"ja": "ロゴ画像",
"ko": "로고 이미지",
"nb": "Logobilde",
"nl": "Afbeelding van logo",
"pl": "Obraz logo",
"pt-BR": "Imagem do logotipo",
"pt-PT": "Imagem do logótipo",
"sv": "Logobild",
"th": "รูปภาพโลโก้",
"tr": "Logo görseli",
"vi": "Hình ảnh logo",
"zh-CN": "logo 图片",
"zh-TW": "標誌圖片"
}
},
{
"type": "range",
"id": "logo_max_width",
"label": {
"cs": "Šířka vlastního loga",
"da": "Tilpasset logobredde",
"de": "Logobreite",
"en": "Custom logo width",
"es": "Ancho del logo personalizado",
"fi": "Mukautetun logon leveys",
"fr": "Largeur personnalisée du logo",
"hi": "कस्टम लोगो की चौड़ाई",
"it": "Larghezza logo personalizzato",
"ja": "ロゴの幅をカスタマイズする",
"ko": "사용자 지정 로고 폭",
"nb": "Tilpasset logobredde",
"nl": "Aangepaste logo-breedte",
"pl": "Niestandardowa szerokość logo",
"pt-BR": "Largura do logotipo personalizado",
"pt-PT": "Largura de logótipo personalizada",
"sv": "Anpassad logotypsbredd",
"th": "ความกว้างของโลโก้แบบกำหนดเอง",
"tr": "Özel logo genişliği",
"vi": "Chiều rộng logo tùy chỉnh",
"zh-CN": "自定义 logo 宽度",
"zh-TW": "自訂商標寬度"
},
"min": 50,
"max": 500,
"step": 10,
"unit": "px",
"default": 100
},
{
"type": "text",
"id": "header",
"label": {
"cs": "Nadpis",
"da": "Overskrift",
"de": "Titel",
"en": "Heading",
"es": "Título",
"fi": "Otsake",
"fr": "En-tête",
"hi": "शीर्षक",
"it": "Heading",
"ja": "見出し",
"ko": "제목",
"nb": "Overskrift",
"nl": "Kop",
"pl": "Nagłówek",
"pt-BR": "Título",
"pt-PT": "Título",
"sv": "Rubrik",
"th": "ส่วนหัว",
"tr": "Başlık",
"vi": "Tiêu đề",
"zh-CN": "标题",
"zh-TW": "標題"
},
"default": {
"cs": "Připravujeme",
"da": "Kommer snart",
"de": "Demnächst",
"en": "Coming Soon",
"es": "Próximamente",
"fi": "Tulossa pian",
"fr": "En construction",
"hi": "जल्द आ रहा है",
"it": "Presto disponibile",
"ja": "まもなく公開",
"ko": "곧 출시 예정",
"nb": "Kommer snart",
"nl": "Binnenkort",
"pl": "Już wkrótce",
"pt-BR": "Em breve",
"pt-PT": "Em breve",
"sv": "Kommer snart",
"th": "เร็วๆ นี้",
"tr": "Çok Yakında",
"vi": "Sắp ra mắt",
"zh-CN": "即将推出",
"zh-TW": "即將推出"
}
}
]
}
{% endschema %}

 

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