Jump to content

Changer apparence bouton de paiement Paypal

johntheboss
 Share

Recommended Posts

johntheboss Newbie

johntheboss

Posted
Posted

Bonjour,

 

 

Tout nouveau dans l'aventure prestashop, j'ai déjà réussi à faire pas mal de choses...

 

Néanmoins, je ne trouve pas comment modifier l'apparence de "Paypal" dans la page de paiement, en fin de commande. 
Je voudrai que le bouton ait le même aspect que les autres (même couleur de fond, et petite flêche sur la droite) :
718357paypal.jpg

 

Merci
 

Link to comment
Share on other sites
eric69 Newbie

eric69

Posted
Posted (edited)

Bonjour johntheboss,

 

Alors là c'est mission impossible avec le module Paypal, 

rien que de changer l'image par défaut, en mettant une autre dans le même dossier avec le même nom, l'image de paypal

par défaut, se remet automatiquement au bout d'un moment.

en fait l'image est appelé par du code du module, même en trouvant le code, a chaque mise à jour l'image par défaut sera de nouveau présente !

 

Modifier l’aspect du module de paiement paypal, est un vrai cauchemar o))

Edited by eric69 (see edit history)
Link to comment
Share on other sites
  • 9 months later...
EISEAL Apprentice

EISEAL

Posted
Posted (edited)

Salut,

 

Pour que Paypal ressemble aux autres solutions de paiement :

 

Créer le fichier themes/TONTHEME/modules/paypal/views/templates/hook/express_checkout_payment.tpl (ou remplacer son contenu)

{*
* 2007-2014 PrestaShop
*
* 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.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author PrestaShop SA <[email protected]>
*  @copyright  2007-2014 PrestaShop SA
*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*}

<div class="row">
    <div class="col-xs-12 col-md-6">
        <p class="payment_module">
            <a class="paypal" href="javascript:void(0)" onclick="$('#paypal_payment_form').submit();" id="paypal_process_payment" title="{l s='Pay with PayPal' mod='paypal'}" rel="nofollow">
                <span>{l s='Pay with PayPal' mod='paypal'}</span><br />
                <span style="font-size:12px; color:#666; font-weight:normal; font-style:italic;">{l s='Fast and secure payment' mod='paypal'}</span>
            </a>
        </p>
    </div>
</div>


<!--{if $smarty.const._PS_VERSION_ >= 1.6}

<div class="row">
    <div class="col-xs-12 col-md-6">
        <p class="payment_module paypal">
            <a href="javascript:void(0)" onclick="$('#paypal_payment_form').submit();" id="paypal_process_payment" title="{l s='Pay with PayPal' mod='paypal'}">
                {if isset($use_mobile) && $use_mobile}
                    <img src="{$base_dir_ssl|escape:'htmlall':'UTF-8'}modules/paypal/img/logos/express_checkout_mobile/CO_{$PayPal_lang_code|escape:'htmlall':'UTF-8'}_orange_295x43.png" />
                {else}
                    {if isset($logos.LocalPayPalHorizontalSolutionPP) && $PayPal_payment_method == $PayPal_integral}
                        <img src="{$logos.LocalPayPalHorizontalSolutionPP|escape:'htmlall':'UTF-8'}" alt="{$PayPal_content.payment_choice|escape:'htmlall':'UTF-8'}" height="48px" />
                    {else}
                        <img src="{$logos.LocalPayPalLogoMedium|escape:'htmlall':'UTF-8'}" alt="{$PayPal_content.payment_choice|escape:'htmlall':'UTF-8'}" />
                    {/if}
                    {$PayPal_content.payment_choice}
                {/if}
                
            </a>
        </p>
    </div>
</div>

<style>
    p.payment_module.paypal a
    {ldelim}
        padding-left:17px;
    {rdelim}
</style>
{else}
<p class="payment_module">
    <a href="javascript:void(0)" onclick="$('#paypal_payment_form').submit();" id="paypal_process_payment" title="{l s='Pay with PayPal' mod='paypal'}">
        {if isset($use_mobile) && $use_mobile}
            <img src="{$base_dir_ssl}modules/paypal/img/logos/express_checkout_mobile/CO_{$PayPal_lang_code}_orange_295x43.png" />
        {else}
            {if isset($logos.LocalPayPalHorizontalSolutionPP) && $PayPal_payment_method == $PayPal_integral}
                <img src="{$logos.LocalPayPalHorizontalSolutionPP}" alt="{$PayPal_content.payment_choice|escape:'htmlall':'UTF-8'}" height="48px" />
            {else}
                <img src="{$logos.LocalPayPalLogoMedium}" alt="{$PayPal_content.payment_choice|escape:'htmlall':'UTF-8'}" />
            {/if}
            {$PayPal_content.payment_choice}
        {/if}
        
    </a>
</p>

{/if}
-->
<form id="paypal_payment_form" action="{$base_dir_ssl}modules/paypal/express_checkout/payment.php" data-ajax="false" title="{l s='Pay with PayPal' mod='paypal'}" method="post">
    <input type="hidden" name="express_checkout" value="{$PayPal_payment_type|escape:'htmlall':'UTF-8'}"/>
    <input type="hidden" name="current_shop_url" value="{$PayPal_current_page|escape:'htmlall':'UTF-8'}" />
    <input type="hidden" name="bn" value="{$PayPal_tracking_code|escape:'htmlall':'UTF-8'}" />
</form>

Dans themes/TONTHEME/css/global.css, ajouter :

    p.payment_module a.paypal {
      background: url(../img/paypal.png) 15px 15px no-repeat #f8f8f8; }

 Juste après :

    p.payment_module a.bankwire {
      background: url(../img/bankwire.png) 15px 12px no-repeat #f8f8f8; }

Et remplacer :

p.payment_module a.cheque:after, p.payment_module a.bankwire:after, p.payment_module a.cash:after {

par :

p.payment_module a.cheque:after, p.payment_module a.bankwire:after, p.payment_module a.cash:after, p.payment_module a.paypal:after {

Enfin, ajouter l'image jointe dans themes/TONTHEME/img/ (ou l'image de ton choix qui doit s'appeller paypal.png)
 

post-376634-0-30808600-1429604605.png

Edited by anteverce (see edit history)
  • Like 3
Link to comment
Share on other sites
  • 3 weeks later...
  • 1 month later...
  • 4 months later...
Xavier95 Newbie

Xavier95

Posted
Posted

Bonjour Anteverce

 

 

 

La méthodologie est impeccable, néanmoins la mise en page du lien Paypal est plus courte que les autres moyens de paiements (Dommage car presque parfait)

peux-tu me dire ou se trouve cette différence de présentation et quelles sont les codes à modifier côté globalcss ou Express_Checkout_Payement.tpl

voir image jointe 

 

Merci de votre retour 
 

 

post-1035562-0-27766500-1447066661_thumb.jpg

  • Like 1
Link to comment
Share on other sites
  • 4 weeks later...
EISEAL Apprentice

EISEAL

Posted
Posted (edited)

Bonjour Anteverce

 

 

 

La méthodologie est impeccable, néanmoins la mise en page du lien Paypal est plus courte que les autres moyens de paiements (Dommage car presque parfait)

 

peux-tu me dire ou se trouve cette différence de présentation et quelles sont les codes à modifier côté globalcss ou Express_Checkout_Payement.tpl

 

voir image jointe 

 

Merci de votre retour 

 

 

C'est dans Express_Checkout_Payement.tpl faut remplacer :

<div class="col-xs-12 col-md-6">

par :

<div class="col-xs-12">

Un truc comme ca ^^

Edited by anteverce (see edit history)
  • Like 2
Link to comment
Share on other sites
Xavier95 Newbie

Xavier95

Posted
Posted

Merci encore une fois,

 

C'est exactement la modification souahité, maintenant l'image de paiement Paypal est sur toute la longueur de la page comme les modules de paiement d'origine Chèque et virement 

Maintenant c'est vraiment complet et très pro

 

Bravo Anteverce :)

  • Like 1
Link to comment
Share on other sites
jipi Newbie

jipi

Posted
Posted

Merci  anteverce. Je voulais faire cela depuis longtemps sans y parvenir et grâce à vous c'est fait.

J'ai profité de ma meilleure compréhension du sujet pour retoucher aussi le module Payplug. Un Big up!

 

Paiements-2McEditions.JPG

  • Like 1
Link to comment
Share on other sites
  • 1 month later...
cycleelcyc Newbie

cycleelcyc

Posted
Posted

bonsoir,

j'ai installé le module "univeral payment", lien ci-dessous

https://www.prestashop.com/forums/topic/139475-modulefree-universal-payment-module/

 

et j'ai eu le meme probleme pour l'apparence bouton, connaissez vous ou je peux modifier le code pour avoir le meme apparence ? j'ai cherché dans global.css mais rien trouvé...

 

d'avance, merci

Link to comment
Share on other sites
  • 2 months later...
Beageek Newbie

Beageek

Posted
Posted (edited)

pour moi c'est l'enfer j'ai bien suivis toute les manipulation mais quoi qu'il arrive j'ai des résultat pourris , j'arrive même pas a avoir la petite flèche a droite de paypal 

 

j'en peu plus de ce truc... ^^

 

si quelqu'un peu me dire ou on trouve cette petite flèche et comment on l'ajoute a Paypal merci d'avance

Edited by lokyjo (see edit history)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing
×
×
  • Create New...