مشاهده کد

<div class="post-share-box" style="direction:rtl; background:#f8f9fa; border-radius:12px; padding:20px 16px; margin:30px auto; max-width:600px; font-family:'Sahel', 'Tahoma', sans-serif; box-shadow:0 2px 8px rgba(0,0,0,0.05); border:1px solid #eee;">

.post-share-box * { box-sizing: border-box; }
    .post-share-title {
      margin: 0 0 15px 0;
      font-size: 16px;
      font-weight: 600;
      color: #333;
      text-align: center;
    }
    .post-share-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      justify-content: center;
    }
    .share-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 10px 16px;
      border-radius: 8px;
      color: #fff;
      font-size: 14px;
      text-decoration: none;
      border: none;
      cursor: pointer;
      transition: opacity 0.2s ease;
      white-space: nowrap;
    }
    .share-btn:hover { opacity: 0.85; }
    .share-btn svg {
      width: 18px;
      height: 18px;
      fill: currentColor;
      flex-shrink: 0;
    }

.share-tg  { background: #0088cc; }
    .share-wa  { background: #25D366; }
    .share-tw  { background: #000; }
    .share-fb  { background: #1877f2; }
    .share-copy { background: #6c757d; }
  </style>

<p class="post-share-title">📤 این پست را به اشتراک بگذارید:</p>

<div class="post-share-buttons">
    
    <a class="share-btn share-tg" id="share-telegram" href="#" target="_blank" rel="noopener">
      <svg viewBox="0 0 24 24"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg>
      تلگرام
    </a>
    
    <a class="share-btn share-wa" id="share-whatsapp" href="#" target="_blank" rel="noopener">
      <svg viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12c0 1.77.49 3.42 1.35 4.85L2 22l5.27-1.38C8.56 21.53 10.23 22 12 22c5.52 0 10-4.48 10-10S17.52 2 12 2zm0 18c-1.46 0-2.86-.39-4.06-1.08l-.29-.17-3.13.82.84-3.06-.19-.3C4.43 15.04 4 13.56 4 12c0-4.41 3.59-8 8-8s8 3.59 8 8-3.59 8-8 8zm4.53-5.59c-.25-.12-1.47-.72-1.69-.8-.23-.08-.39-.12-.55.12-.16.24-.64.78-.78.94-.14.16-.27.18-.52.06s-1-.37-1.91-1.18c-.71-.63-1.18-1.41-1.32-1.65-.14-.24-.01-.37.11-.49.11-.11.25-.29.38-.44.13-.15.17-.25.25-.42.08-.17.04-.31-.02-.44-.06-.12-.55-1.33-.76-1.82-.2-.49-.4-.42-.55-.43-.14-.01-.31-.01-.48-.01s-.44.06-.67.31c-.23.25-.88.86-.88 2.09s.9 2.43 1.03 2.59c.13.16 1.77 2.7 4.28 3.79.6.26 1.07.41 1.43.53.6.19 1.15.16 1.58.1.48-.07 1.47-.6 1.68-1.18.21-.58.21-1.08.14-1.18-.07-.1-.23-.16-.48-.28z"/></svg>
      واتساپ
    </a>
    
    <a class="share-btn share-tw" id="share-twitter" href="#" target="_blank" rel="noopener">
      <svg viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
      توییتر
    </a>
    
    <a class="share-btn share-fb" id="share-facebook" href="#" target="_blank" rel="noopener">
      <svg viewBox="0 0 24 24"><path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"/></svg>
      فیسبوک
    </a>
    
    <button class="share-btn share-copy" id="share-copy">
      <svg viewBox="0 0 24 24"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>
      کپی لینک
    </button>
  </div>

var tg = container.querySelector('#share-telegram');
      var wa = container.querySelector('#share-whatsapp');
      var tw = container.querySelector('#share-twitter');
      var fb = container.querySelector('#share-facebook');
      var copyBtn = container.querySelector('#share-copy');

if(tg) tg.href = 'https://t.me/share/url?url=' + url + '&text=' + title;
      if(wa) wa.href = 'https://wa.me/?text=' + title + '%20' + url;
      if(tw) tw.href = 'https://twitter.com/intent/tweet?url=' + url + '&text=' + title;
      if(fb) fb.href = 'https://www.facebook.com/sharer/sharer.php?u=' + url;

if(copyBtn) {
        copyBtn.addEventListener('click', function(e) {
          navigator.clipboard.writeText(window.location.href).then(function() {
            var originalHTML = copyBtn.innerHTML;
            copyBtn.innerHTML = '<svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg> کپی شد!';
            setTimeout(function() {
              copyBtn.innerHTML = originalHTML;
            }, 2000);
          }).catch(function() {
            alert('خطا در کپی کردن لینک');
          });
        }, false);
      }
    })();
  </script>
</div>