Center Klarna Logo

[lasseboy]

Hi!

How can i Center the Klarna Logo on main page? Se picture.

Thanks

[PCQUATRO]

Style="text-align:center;" align="center"

It would be best if you posted your shop URL.

Best Regards

[lasseboy]

sorry www.balochfest.se

 

 

[tuk66]

You have to wrap the image in <div style="text-align: center">image here</div>.

[lasseboy]

 

In which file, is it in KLarna module files or prestashops tpl file for footer?

[tuk66]

Maybe in klarnafooter.tpl?

[lasseboy]

This is klarnafooter.tpl

2015 Prestaworks AB
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to [email protected] so we can send you a copy immediately.
*
*  @author    Prestaworks AB <[email protected]>
*  @copyright 2015 Prestaworks AB
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of Prestaworks AB
*}
{if $klarnav3_footer_layout != 0}
    {if $klarnav3_footer_layout == 1}
        <img src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/long-blue.png?width=440" />
    {/if}
    {if $klarnav3_footer_layout == 2}
        <img src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/long-white.png?width=440" />
    {/if}
    {if $klarnav3_footer_layout == 3}
        <img src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/short-blue.png?width=312" />
    {/if}
    {if $klarnav3_footer_layout == 4}
        <img src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/short-white.png?width=312" />
    {/if}
{else}
    {if $klarna_footer_layout == 'blue-black' || $klarna_footer_layout == 'white' || $klarna_footer_layout == 'blue+tuv' || $klarna_footer_layout == 'white+tuv'}
        <div class="klarna-widget klarna-logo-tooltip"
            data-eid="{$kco_footer_eid|escape:'html':'UTF-8'}"
            data-locale="{$kco_footer_locale|escape:'html':'UTF-8'}"
            data-logo-name="{$klarna_footer_layout|escape:'html':'UTF-8'}"
            data-logo-width="120">
        </div>
    {else}
        {if ($kco_footer_locale|escape:'html':'UTF-8' == 'nl_nl')}
            <img src="https://cdn.klarna.com/1.0/shared/image/generic/logo/nl_nl/basic/blue-black.png?width=100" />
        {elseif ($kco_footer_locale|escape:'html':'UTF-8' == 'da_dk')}
            <div class="klarna-widget klarna-logo-tooltip"
                data-eid="{$kco_footer_eid|escape:'html':'UTF-8'}"
                data-locale="da_dk"
                data-logo-name="blue-black"
                data-logo-width="120">
            </div>
        {else}
            <div class="klarna-widget klarna-{if $kco_footer_active}badge{else}logo{/if}-tooltip"
                data-eid="{$kco_footer_eid|escape:'html':'UTF-8'}"
                data-locale="{$kco_footer_locale|escape:'html':'UTF-8'}"
                data-badge-name="{$klarna_footer_layout|escape:'html':'UTF-8'}"
                data-badge-width="385">
            </div>
        {/if}
    {/if}
    <script async src="https://cdn.klarna.com/1.0/code/client/all.js"></script>
{/if}

[tuk66]

I would wrap the first four <img> elements.

[lasseboy]

The logo is this one:  {if $klarnav3_footer_layout == 2}
        <img src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/long-white.png?width=440" />
    {/if}

 

 

maybe the settings are controlled from another file, should ask klarna support about this

[PCQUATRO]

Best Regards

[lasseboy]

THanks! 

 

but I can't find the file to change.

 

[PCQUATRO]

19 minutes ago, lasseboy said:

but I can't find the file to change.

You just have to look for class="klarna-widget klarna-badge-tooltip klarna-tooltip" for example, or alt="Klarna payment display" ...

you could start by the code you provided...

<div style="text-align:center; width:100%;">
  {if $klarnav3_footer_layout != 0}    
  {if $klarnav3_footer_layout == 1}        <img style="text-align:center !important;" src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/long-blue.png?width=440" />    {/if}    
  {if $klarnav3_footer_layout == 2}        <img style="text-align:center !important;" src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/long-white.png?width=440" />    {/if}    
  {if $klarnav3_footer_layout == 3}        <img style="text-align:center !important;" src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/short-blue.png?width=312" />    {/if}    
  {if $klarnav3_footer_layout == 4}        <img style="text-align:center !important;" src="https://cdn.klarna.com/1.0/shared/image/generic/badge/{$kco_footer_locale|escape:'html':'UTF-8'}/checkout/short-white.png?width=312" />    {/if}
</div>

Best Regards

Edited November 29, 2019 by PCQUATRO (see edit history)

[lasseboy]

Thanks!

i have to be stupid in the head, can not find right at all, is it only the tpl files that control this, or can it be the css files?

[PCQUATRO]

1 hour ago, lasseboy said:

i have to be stupid in the head, can not find right at all, is it only the tpl files that control this, or can it be the css files?

Usualy it is only the TPL, but you can add styles by css to some used ID´s or Classes!

Best regards

[lasseboy]

I give up, now when i go live with payment there is moore problems, maybe my theme dosent support klarna.

[PCQUATRO]

2 hours ago, lasseboy said:

I give up, now when i go live with payment there is moore problems, maybe my theme dosent support klarna.

That´s clearly a theme problem, ask the developer for help. Styling is not a problem, it can be easely solved, the real problem is when functional things do not work as expected!

You have to put those elements inside the main wrapper...

Best Regards

Edited November 30, 2019 by PCQUATRO (see edit history)

[lasseboy]

I think i found the code for img.

img {
  width:auto;
  max-width:100%;
  height:auto;
  vertical-align:middle;
}
.zoomdiv img, .zoomWindow img { max-width:none; }
.zoomdiv, .zoomWrapper { border:1px solid #dddddd !important; }
.zoomPad { float:none !important; }
#product.content_only .zoomPad, #product.content_only .zoomPup {
  background:none !important;
  border:0 !important;
  cursor:default !important;
 

 

But when i try vertical-align:center;   nothing happens.

 

If i put to  max-width:00%;  img disappears

So i think it´s the rigt code for the img.

it´s in global.css

 

[PCQUATRO]

10 hours ago, lasseboy said:

I think i found the code for img.

That´s a global img style, changes you make there will affect all image elements, you need to target just the ones you need to center.

10 hours ago, lasseboy said:

But when i try vertical-align:center;   nothing happens.

vertical-align does not have a center propertie, it´s middle as you can see in the example of code you gave, what you need to use is text-align:center as i´ve been telling you!

Best Regards

[lasseboy]

Thanks all skip the logo in footer, 🤣