Klarna logo doesn't show in footer

Solved
brandbuilding
Tourist
10 0 7

All the other payment processors show except Klarna. Is there a way to fix this? As Klarna converts the most. 

Using sense theme Shopify 2.0

 

D85DEC29-56C5-4E69-8BD3-620F2BC252A1.jpeg

Replies 60 (60)
evamoon
Excursionist
11 0 3

Thank you for your reply and help!!! Now I got it to show 🙂

evamoon
Excursionist
11 0 3

Hi again KetanKumar and sorry to bother you again. 

 

I now got Klarna to show (however the image is slightly below the other Payment options). But because I am also missing other various payment methods that are not showing (Paytrail) I am wondering if there'd be a snippet of code to add so that I can add a png image of the various payment methods.

 

I truly appreciate your help and input.

evamoon
Excursionist
11 0 3

@KetanKumar Hi again. So I am attaching here a screenshot of the png I'd like to add to the footer showing all the various payment methods. Is there a way to do this? Thanks again a million.Screenshot 2022-08-17 at 16.22.43.png

KetanKumar
Shopify Partner
35891 3586 11605

@evamoon 

its my pleasure yes you mean this image show at footer right?

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
evamoon
Excursionist
11 0 3

@KetanKumar  , yes I would love to add this png to the footer aligned right under the other payment options

 

Paytrail-banneri-kaikki-maksutavat.png

evamoon
Excursionist
11 0 3
Hello again Ketankumar,

I apologize for bothering you again, but is there a away to align these
payment icons, so that Klarna is on the same height as the other ones?

Thank you so much on beforehand

[image: Screenshot 2022-08-22 at 13.22.21.png]
didrikwasson
New Member
2 0 0

Hi Ketan. I am having issues with this same thing for my store www.southwaythrills.com store password is "twowts" 

How do I make klarna and vipps2.0 visible? I use the payed theme symmetry

Thanks 🙂

SS201
New Member
1 0 0

Hi, I also need to add the klarna logo ( smaller one with the rest of the payment options at the footer of my page, what exactly do I need to click on to be able to place that code? Could I have a step by step please 

many thanks 

JEEcomAB
Tourist
4 0 3

Hi Ketankumar! This code doesn't work with my theme or maybe I do something wrong. Can you please help me?

KetanKumar
Shopify Partner
35891 3586 11605

@JEEcomAB 

oh sorry, can you please send your store url  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
JEEcomAB
Tourist
4 0 3

Thank you! URL: https://www.celso.se

KetanKumar
Shopify Partner
35891 3586 11605

@brandbuilding 

yes, please add this code

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

li.list-payment__item {
    line-height: 0;
    vertical-align: middle;
}

 

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
JEEcomAB
Tourist
4 0 3

Hello, any update about this?

KetanKumar
Shopify Partner
35891 3586 11605

@JEEcomAB 

yes, please used this 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
JEEcomAB
Tourist
4 0 3

@KetanKumar 

I'm sorry, but what code?

rosyecommerce
Tourist
3 0 2

Hello,
Could you please help me, I have the same problem. I can add every payment method logo to the footer except for Klarna. Could you help me with the coding to add the Klarna payment method logo? I work with the prestige theme.
this is my Footer coding:

{%- if template.name == 'page' or template.name == 'blog' or template == 'customers/account' or template == 'customers/order' or template == 'customers/addresses' -%}
{%- assign add_top_margin = true -%}
{%- else -%}
{%- assign add_top_margin = false -%}
{%- endif -%}

<footer id="section-{{ section.id }}" class="Footer {% if section.blocks.size <= 2 %}Footer--center{% endif %} {% if add_top_margin %}Footer--withMargin{% endif %}" role="contentinfo">
<div class="Container">
{%- if section.blocks.size > 0 -%}
<div class="Footer__Inner">
{%- for block in section.blocks -%}
<div class="Footer__Block Footer__Block--{{ block.type }}" {{ block.shopify_attributes }}>
{%- case block.type -%}
{%- when 'text' -%}
{%- if block.settings.title != blank -%}
<h2 class="Footer__Title Heading u-h6">{{ block.settings.title | escape }}</h2>
{%- endif -%}

{%- if block.settings.content != blank -%}
<div class="Footer__Content Rte">
{{ block.settings.content }}
</div>
{%- endif -%}

{%- if block.settings.show_social_media -%}
{% include 'social-media', class: 'Footer__Social', spacing: 'loose' %}
{%- endif -%}

{%- when 'links' -%}
{%- assign linklist = linklists[block.settings.menu] -%}

{%- if linklist != empty -%}
<h2 class="Footer__Title Heading u-h6">{{ linklist.title | escape }}</h2>

<ul class="Linklist">
{%- for link in linklist.links -%}
<li class="Linklist__Item">
<a href="{{ link.url }}" class="Link Link--primary">{{ link.title | escape }}</a>
</li>
{%- endfor -%}
</ul>
{%- endif -%}

{%- when 'newsletter' -%}
{%- if block.settings.title != blank -%}
<h2 class="Footer__Title Heading u-h6">{{ block.settings.title | escape }}</h2>
{%- endif -%}

{%- if block.settings.content != blank -%}
<div class="Footer__Content Rte">
{{ block.settings.content }}
</div>
{%- endif -%}

{%- form 'customer', id: 'footer-newsletter', class: 'Footer__Newsletter Form' -%}
{%- if form.posted_successfully? -%}
<p class="Form__Alert Alert Alert--success">{{ 'footer.newsletter.success' | t }}</p>
{%- else -%}
{%- if form.errors -%}
<p class="Form__Alert Alert Alert--error">{{ form.errors.messages['email'] }}</p>
{%- endif -%}

<input type="hidden" name="contact[tags]" value="newsletter">
<input type="email" name="contact[email]" class="Form__Input" aria-label="{{ 'footer.newsletter.input' | t }}" placeholder="{{ 'footer.newsletter.input' | t }}" required>
<button type="submit" class="Form__Submit Button Button--primary">{{ 'footer.newsletter.submit' | t }}</button>
{%- endif -%}
{%- endform -%}
{%- endcase -%}
</div>
{%- endfor -%}
</div>
{%- endif -%}

<div class="Footer__Aside">
<div class="Footer__Copyright">
<a href="{{ shop.url }}" class="Footer__StoreName Heading u-h7 Link Link--secondary">© {{ shop.name }}</a>

<!--{%- capture maestrooo_link -%}<a href="https://www.maestrooo.com" class="Link Link--primary" target="_blank" rel="noopener">Maestrooo</a>{%- endcapture -%}
<p class="Footer__ThemeAuthor">{{ 'footer.general.credits_html' | t: maestrooo_link: maestrooo_link }} | {{ powered_by_link | replace: '<a', '<a class="Link Link--primary"' }}</p>
</div> -->

{%- if section.settings.show_payment_methods -%}
{%- capture payment_methods -%}
{%- for type in shop.enabled_payment_types -%}
<li class="HorizontalList__Item">{{ type | payment_type_svg_tag }}</li>
{%- endfor -%}
{%- endcapture -%}

{%- if payment_methods != blank -%}
<ul class="Footer__PaymentList HorizontalList">
{{ payment_methods }}
</ul>
{%- endif -%}
{%- endif -%}
</div>
</div>
</footer>

{% schema %}
{
"name": "Footer",
"class": "shopify-section--footer",
"settings": [
{
"type": "checkbox",
"id": "show_payment_methods",
"label": "Show payment methods",
"info": "Payment method icons are automatically displayed based on your Shopify payment methods.",
"default": true
}
],
"blocks": [
{
"type": "text",
"name": "Text",
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "About the shop"
},
{
"type": "richtext",
"id": "content",
"label": "Text",
"default": "<p>Use this text area to tell your customers about your brand and vision. You can change it in the theme settings.</p>"
},
{
"type": "checkbox",
"id": "show_social_media",
"label": "Show social media",
"info": "Make sure to have properly configured your social media in the theme settings.",
"default": true
}
]
},
{
"type": "links",
"name": "Links",
"settings": [
{
"type": "link_list",
"id": "menu",
"label": "Menu",
"info": "This menu won't show dropdown items."
}
]
},
{
"type": "newsletter",
"name": "Newsletter",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "Customers who subscribe will have their email address added to the \"accepts marketing\" [customer list](/admin/customers?query=&accepts_marketing=1)."
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Newsletter"
},
{
"type": "richtext",
"id": "content",
"label": "Text",
"default": "<p>A short sentence describing what someone will receive by subscribing</p>"
}
]
}
],
"default": {
"blocks": [
{
"type": "text",
"settings": {}
},
{
"type": "links",
"settings": {
"menu": "footer"
}
},
{
"type": "newsletter",
"settings": {}
}
]
}
}
{% endschema %}

KetanKumar
Shopify Partner
35891 3586 11605

@rosyecommerce 

yes, please update this code

{%- if template.name == 'page' or template.name == 'blog' or template == 'customers/account' or template == 'customers/order' or template == 'customers/addresses' -%}
{%- assign add_top_margin = true -%}
{%- else -%}
{%- assign add_top_margin = false -%}
{%- endif -%}

<footer id="section-{{ section.id }}" class="Footer {% if section.blocks.size <= 2 %}Footer--center{% endif %} {% if add_top_margin %}Footer--withMargin{% endif %}" role="contentinfo">
<div class="Container">
{%- if section.blocks.size > 0 -%}
<div class="Footer__Inner">
{%- for block in section.blocks -%}
<div class="Footer__Block Footer__Block--{{ block.type }}" {{ block.shopify_attributes }}>
{%- case block.type -%}
{%- when 'text' -%}
{%- if block.settings.title != blank -%}
<h2 class="Footer__Title Heading u-h6">{{ block.settings.title | escape }}</h2>
{%- endif -%}

{%- if block.settings.content != blank -%}
<div class="Footer__Content Rte">
{{ block.settings.content }}
</div>
{%- endif -%}

{%- if block.settings.show_social_media -%}
{% include 'social-media', class: 'Footer__Social', spacing: 'loose' %}
{%- endif -%}

{%- when 'links' -%}
{%- assign linklist = linklists[block.settings.menu] -%}

{%- if linklist != empty -%}
<h2 class="Footer__Title Heading u-h6">{{ linklist.title | escape }}</h2>

<ul class="Linklist">
{%- for link in linklist.links -%}
<li class="Linklist__Item">
<a href="{{ link.url }}" class="Link Link--primary">{{ link.title | escape }}</a>
</li>
{%- endfor -%}
</ul>
{%- endif -%}

{%- when 'newsletter' -%}
{%- if block.settings.title != blank -%}
<h2 class="Footer__Title Heading u-h6">{{ block.settings.title | escape }}</h2>
{%- endif -%}

{%- if block.settings.content != blank -%}
<div class="Footer__Content Rte">
{{ block.settings.content }}
</div>
{%- endif -%}

{%- form 'customer', id: 'footer-newsletter', class: 'Footer__Newsletter Form' -%}
{%- if form.posted_successfully? -%}
<p class="Form__Alert Alert Alert--success">{{ 'footer.newsletter.success' | t }}</p>
{%- else -%}
{%- if form.errors -%}
<p class="Form__Alert Alert Alert--error">{{ form.errors.messages['email'] }}</p>
{%- endif -%}

<input type="hidden" name="contact[tags]" value="newsletter">
<input type="email" name="contact[email]" class="Form__Input" aria-label="{{ 'footer.newsletter.input' | t }}" placeholder="{{ 'footer.newsletter.input' | t }}" required>
<button type="submit" class="Form__Submit Button Button--primary">{{ 'footer.newsletter.submit' | t }}</button>
{%- endif -%}
{%- endform -%}
{%- endcase -%}
</div>
{%- endfor -%}
</div>
{%- endif -%}

<div class="Footer__Aside">
<div class="Footer__Copyright">
<a href="{{ shop.url }}" class="Footer__StoreName Heading u-h7 Link Link--secondary">© {{ shop.name }}</a>

<!--{%- capture maestrooo_link -%}<a href="https://www.maestrooo.com" class="Link Link--primary" target="_blank" rel="noopener">Maestrooo</a>{%- endcapture -%}
<p class="Footer__ThemeAuthor">{{ 'footer.general.credits_html' | t: maestrooo_link: maestrooo_link }} | {{ powered_by_link | replace: '<a', '<a class="Link Link--primary"' }}</p>
</div> -->

{%- if section.settings.show_payment_methods -%}
{%- capture payment_methods -%}
{%- for type in shop.enabled_payment_types -%}
<li class="HorizontalList__Item">{{ type | payment_type_svg_tag }}</li>
{%- endfor -%}
{%- endcapture -%}

{%- if payment_methods != blank -%}
<ul class="Footer__PaymentList HorizontalList">
{{ payment_methods }}
<li class="list-payment__item Klarna_Payment">
<img class= "icon icon--full-color" src="https://upload.wikimedia.org/wikipedia/commons/4/40/Klarna_Payment_Badge.svg" alt="{{ shop.name }}" itemprop="logo">
</li>
</ul>
{%- endif -%}
{%- endif -%}
</div>
</div>
</footer>

<style>
.Klarna_Payment img {width: 40px;}
</style>
{% schema %}
{
"name": "Footer",
"class": "shopify-section--footer",
"settings": [
{
"type": "checkbox",
"id": "show_payment_methods",
"label": "Show payment methods",
"info": "Payment method icons are automatically displayed based on your Shopify payment methods.",
"default": true
}
],
"blocks": [
{
"type": "text",
"name": "Text",
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "About the shop"
},
{
"type": "richtext",
"id": "content",
"label": "Text",
"default": "<p>Use this text area to tell your customers about your brand and vision. You can change it in the theme settings.</p>"
},
{
"type": "checkbox",
"id": "show_social_media",
"label": "Show social media",
"info": "Make sure to have properly configured your social media in the theme settings.",
"default": true
}
]
},
{
"type": "links",
"name": "Links",
"settings": [
{
"type": "link_list",
"id": "menu",
"label": "Menu",
"info": "This menu won't show dropdown items."
}
]
},
{
"type": "newsletter",
"name": "Newsletter",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "Customers who subscribe will have their email address added to the \"accepts marketing\" [customer list](/admin/customers?query=&accepts_marketing=1)."
},
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Newsletter"
},
{
"type": "richtext",
"id": "content",
"label": "Text",
"default": "<p>A short sentence describing what someone will receive by subscribing</p>"
}
]
}
],
"default": {
"blocks": [
{
"type": "text",
"settings": {}
},
{
"type": "links",
"settings": {
"menu": "footer"
}
},
{
"type": "newsletter",
"settings": {}
}
]
}
}
{% 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
rosyecommerce
Tourist
3 0 2

Thank you very much @KetanKumar ! Super fast response and i now have the Klarna logo in my footer! I wish you a great day!

rosyecommerce
Tourist
3 0 2

I have one more question, is it possible to put the logo next to the other logo's instead underneath? 

KetanKumar
Shopify Partner
35891 3586 11605

@rosyecommerce 

its my pleasure to help us 

I have one more question, is it possible to put the logo next to the other logo's instead underneath? 

please share screenshot where  did you add

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