☰

Shopify Enhancer

Enhance Shopify admin dashboard with third-party providers support

  1. // ==UserScript==
  2. // @name         Shopify Enhancer
  3. // @namespace    https://github.com/sparanoid/userscript
  4. // @supportURL   https://github.com/sparanoid/userscript/issues
  5. // @version      2025-05-04
  6. // @description  Enhance Shopify admin dashboard with third-party providers support
  7. // @author       Sparanoid
  8. // @license      AGPL
  9. // @compatible   chrome 80 or later
  10. // @compatible   edge 80 or later
  11. // @compatible   firefox 74 or later
  12. // @compatible   safari 13.1 or later
  13. // @match        https://admin.shopify.com/store/*
  14. // @icon         https://www.google.com/s2/favicons?sz=64&domain=shopify.com
  15. // @grant        none
  16. // ==/UserScript==
  17.  
  18. (function() {
  19.   'use strict';
  20.  
  21.   const wrapperObserver = new MutationObserver((mutationsList, observer) => {
  22.  
  23.     for (const mutation of mutationsList) {
  24.  
  25.       if (mutation.type === 'childList') {
  26.  
  27.         [...mutation.addedNodes].map(item => {
  28.           // console.log('mutation wrapper added', item);
  29.  
  30.           // Main wrapper
  31.           if (item.classList?.contains('Polaris-Page') || item?.id === 'AppFrame') {
  32.             console.log('Main wrapper detected', item);
  33.  
  34.             // Look for spans containing phone numbers
  35.             const phoneSpans = item?.querySelectorAll('span.Polaris-Text--root');
  36.  
  37.             if (phoneSpans && phoneSpans.length > 0) {
  38.               phoneSpans.forEach(span => {
  39.                 const text = span.textContent?.trim();
  40.  
  41.                 // Check if text starts with +86
  42.                 if (text && text.startsWith('+86')) {
  43.                   // Check if we already added the link to this span
  44.                   if (!span.nextElementSibling || !span.nextElementSibling.classList.contains('rouzao-link')) {
  45.                     // Extract phone number
  46.                     const telStr = text.replaceAll(' ', '').replaceAll('+86', '');
  47.  
  48.                     // Create link
  49.                     const link = document.createElement('a');
  50.                     link.setAttribute('href', `https://rouzao.com/orders/list?mobile=${telStr}`);
  51.                     link.setAttribute('target', '_blank');
  52.                     link.setAttribute('class', 'rouzao-link');
  53.                     link.textContent = 'Search in Rouzao';
  54.                     link.style.marginLeft = '0.5em';
  55.  
  56.                     // Insert link after the span
  57.                     span.parentElement.insertBefore(link, span.nextSibling);
  58.                   }
  59.                 }
  60.               });
  61.             }
  62.           }
  63.         })
  64.       }
  65.     }
  66.   });
  67.   wrapperObserver.observe(document.body, { attributes: false, childList: true, subtree: true });
  68.  
  69. })();