Jump to content
johntheboss

Changer apparence bouton de paiement Paypal

Recommended Posts

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
 

Share this post


Link to post
Share on other sites

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)

Share this post


Link to post
Share on other sites

Merci pour cette réponse.....

 

Ah fait c****!

Par contre du coup, peut-être est-il possible de modifier les deux autres?
En fait c'est juste pour que tous les boutons aient le même aspect (un peu perfectioniste sur les bords....)

Share this post


Link to post
Share on other sites

Alors j'ai réussi à changer la couleur du fond, mais impossible de supprimer la petite flèche (chevron) sur la droite.....

Quelqu'un pourrait m'éclairer?

Share this post


Link to post
Share on other sites

J'ai exactement ce problème ! :mellow: Rien que changer la couleur du fond me conviendrait. Si vous pouvez me dire comment faire ce serait très gentil  :D

Share this post


Link to post
Share on other sites

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 license@prestashop.com 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 <contact@prestashop.com>
*  @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

Share this post


Link to post
Share on other sites

J'ai essayé cette méthode mais je me retrouver confronté à un problème de dimension de l'image.

Share this post


Link to post
Share on other sites

Merci @anteverce pour ce hack !

Ca marche bien sur notre Boutique Militante et ça fait quand même plus pro au moment de la dernière étape avant l'achat...

Merci.

  • Like 1

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

Merci beaucoup Anteverce pour tes explications claires et efficaces.

 

J'ai bien réussis à mettre mon moyen de paiement PayPal, à ma sauce, grâce à toi.

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

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)

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More