Oceanpayment | Card Brand Logos Displayed During Account Application

When applying for an Oceanpayment account, it is necessary to add payment logos to your Shoplazza store to meet Oceanpayment site verification requirements. Displaying temporary payment logos such as Visa, Mastercard, and UnionPay helps confirm that your store is eligible for approval. This process is quick to set up and does not affect the regular shopping experience for customers. After the Oceanpayment account is approved, the temporary payment logos can be safely removed to restore the store’s original layout.

Note

The code provided in this article serves as a reference for adding payment icons to the footer. Display issues may occur depending on your store’s theme or if other custom code is present. If display issues occur, remove the code immediately or seek assistance from a developer.

Adding card organization logos to your storefront

Follow the steps below to quickly add payment logos to your storefront.

1. Install the Custom Code App: From your Shoplazza Admin, go to the App Store and install the Custom Code app.

2. Insert Custom Code: Open the Custom Code app, click Add new code.

3. Paste the code: In the Insert Code field, paste the following snippet:

<script type = "text/javascript"> try { 
      const logoSnippets = document.createElement("div");
      logoSnippets.id = "shoplaza-section-footer-logo";
      document.getElementById("shoplaza-section-footer").appendChild(logoSnippets);
      document.getElementById('shoplaza-section-footer-logo').innerHTML = '<div style="white-space:normal;text-align:center;" class="footer bg-footer footer_container tw-bg-footer-bg tw-bg-footer"><!-- Visa --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/0244f114b3afad4d9b0fe22f54dbb837_180x.png"><!-- Mastercard --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/431cf474360ec26f50e453910d747622_180x.png"><!-- Maestro --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/ea127d2967d52ee7106f1d862a4be2aa_180x.png"><!-- Visa Electron --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/9042ff8fe121c2fe80df22b3a4e38c67_180x.png"><!-- JCB --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/2d9a48ae30ea532451ce4c54825d5dfe_180x.png"><!-- American Express --><img style="height:24px;margin:4px;" src="https://cdn.shoplazza.com/ee0414210cf3495b1abf7137cffe680d.png"><!-- Carte Bancaire --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/8c7d570994064c8066658bc0edba5366_180x.png"><!-- Diners Club --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/47c5b22ec39fb82d220efef0c301e8cd_180x.png"><!-- Discover --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/7b913163091dc227b0d4b946be32b704_180x.png"><!-- UnionPay --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/1b2b030090fdac882511e286a570ba0e_180x.png"><!-- PayPal --><img style="height:24px;margin:4px;" src="https://img.shoplazza.com/oss/operation/a0a058baaeef16e88f6bd2ee36c03f6f_180x.png"> </div>';
     } catch(e){      }</script>

4. Configure and save: After pasting the code, set the following:

Choose user end: PC & Mobile
Trigger pages: All pages (excluding the Checkout page)
Location: Bottom
Save to apply the changes.

Preview the storefront

Visit your storefront and scroll to the bottom of the page. The temporary payment logos (Visa, Mastercard, Maestro, Visa Electron, JCB, American Express, Carte Bancaire, Diners Club, Discover, UnionPay, PayPal) should display correctly.

After your Oceanpayment account is approved

After the Oceanpayment account is approved, remove the temporary payment logos to restore the original footer layout:

Return to the Custom Code app.
Disable or delete the previously added code snippet to restore your store’s original footer layout.

Adding card organization logos is a mandatory part of the Oceanpayment account application process. This temporary setup ensures that your store meets banking verification requirements without affecting your regular operations. After your application is approved, be sure to remove the temporary code to maintain a clean and professional store appearance. If you encounter any issues, please consult your technical team for assistance.