• Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Register
  • Login
Bagisto Forum

Bagisto

  • Register
  • Login
  • Search
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups

How to Add a WhatsApp Icon Conditionally on Product Pages or All Pages

General Discussion
2
3
434
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • A
    arunchahar last edited by 20 Jan 2025, 04:36

    Hello Bagisto Team,
    I hope you all are doing well!
    I need help adding a WhatsApp icon to my Bagisto store with these requirements:

    1. Display the icon only on product details pages.
    2. Optionally, display the icon on all pages when needed.

    I tried adding the script using the Custom JS option in the admin panel, but it did not work as expected. How can I properly identify product detail pages and conditionally include the script? Any guidance or code examples would be greatly appreciated!

    My code:

     <script> 
        var url = 'https://scrm-data-us-oss.oss-us-west-1.aliyuncs.com/sender/whatsapp_replace_crisp/user_main.js';
        var s = document.createElement('script');
        s.type = 'text/javascript';
        s.async = true;
        s.src = url;
        var options = {
      "enabled":true,
      "chatButtonSetting":{
          "backgroundColor":"#4dc247",
          "ctaText":"Message Us",
          "borderRadius":"25",
          "marginLeft":"0",
          "marginBottom":"50",
          "marginRight":"50",
          "position":"right"
      },
      "brandSetting":{
          "brandName":"Honey King",
          "brandSubTitle":"Replies within 1 min",
          "brandImg":"https://www.website.com/storage/channel/1/2KzMyW6BZs0BCzbWp4aMg1PAALW5E3bfBDcsnbql.jpg",
          "welcomeText":"Hi,there!\nHow can I help you?",
          "messageText":"Hello, I have a question about {{page_link}}",
          "backgroundColor":"#DC4E1E",
          "ctaText":"Start Chat",
          "borderRadius":"25",
          "autoShow":false,
          "phoneNumber":"919013780284"
      }
    };
        s.onload = function() {
            CreateWhatsappChatWidget(options);
        };
        var x = document.getElementsByTagName('script')[0];
        x.parentNode.insertBefore(s, x);
     </script> 
    

    Thank you!

    1 Reply Last reply Reply Quote 0
    • Rishabh-Webkul
      Rishabh-Webkul last edited by 20 Jan 2025, 09:15

      Hello @arunchahar

      If you want to make changes and add a WhatsApp icon to my Bagisto Product detail page.

      Product Detail Page File Path - packages >> Webkul >> Shop >> src >> Resources >> views >> products >> view.blade.php

      view.png

      Thanks & Regards

      A 1 Reply Last reply 20 Jan 2025, 11:30 Reply Quote 0
      • A
        arunchahar @Rishabh-Webkul last edited by 20 Jan 2025, 11:30

        @Rishabh-Webkul and how do i add in case i want to show on all frontend shop pages?

        1 Reply Last reply Reply Quote 0
        1 out of 3
        • First post
          1/3
          Last post