UPDATE YOUR EMAIL SIGNATURE

EMAIL SIGNATURE APPLE MAIL

Email Signature Generator

Current nudge: 12px Tip: For the Mail app on MacBook, nudge to -14px
Test in Gmail, Outlook, and Apple Mail. Adjust nudge, then copy again.

 

Follow the instructions below to paste your signature, depending on your email app:

 

Apple Mail (macOS)
• Mail → Settings → Composing → set Message format to Rich Text ✔️
Uncheck “Use the same message format as the original message”
• Mail → Settings → SignaturesUncheck “Always match my default message font”
• Create a new signature, paste the generated HTML, replace placeholders with images from your computer
• Choose Actual Size if prompted
• Test by starting a new message (not replying to a plain-text email)

Always-visible images: Drag images from Finder into the signature editor to embed them inline (CID).

iPhone/iPad

  1. Email the final signature to yourself from desktop.

  2. On iPhone/iPad: copy the block → Settings → Mail → Signature → paste.
    If formatting drops, type a character first, paste, then delete it.


 

Outlook (Windows desktop)

  1. Click Copy Signature.

  2. Outlook → File → Options → Mail → Signatures…New → paste.

  3. Send yourself a test.

Always-visible images: In the signature editor: Insert → Pictures → select PNG from disk.
Outlook for Mac / Outlook web:
• Mac: Settings → Signatures → New → paste from browser → Insert pictures if needed.
• Web: Settings → Mail → Compose & Reply → Email signature → paste → Insert picture.

 


 

Gmail (web)

  1. Settings (gear) → See all settingsGeneral → Signature → Create new.

  2. Paste the HTML you copied.

  3. Click Insert imageUpload logo/badge (recommended) or use HTTPS URL.

  4. Save Changes.

Tip: Uploaded images are hosted by Google and usually display automatically.


 

`); doc.close();// autosize iframe after images load const resize = () => { const h = Math.max( doc.body.scrollHeight, doc.documentElement.scrollHeight, doc.body.offsetHeight, doc.documentElement.offsetHeight ); frame.style.height = h + 'px'; }; const imgs = doc.images; let pending = imgs.length; if (pending === 0) resize(); else { Array.from(imgs).forEach(img=>{ if (img.complete) { if (--pending === 0) resize(); } else img.addEventListener('load', ()=>{ if (--pending === 0) resize(); }, {once:true}); }); }drawGuideOverlay(host, nudgeValue); }function drawGuideOverlay(host, nudgeValue){ const old = host.querySelector('.preview-edge-overlay'); if (old) old.remove();const wrap = document.createElement('div'); wrap.className = 'preview-edge-overlay'; wrap.style.position = 'absolute'; wrap.style.left = '0'; wrap.style.top = '0'; wrap.style.width = '600px'; wrap.style.pointerEvents = 'none';const line = document.createElement('div'); line.style.position = 'absolute'; line.style.top = '0'; line.style.bottom = '0'; line.style.left = Math.max(0, nudgeValue) + 'px'; line.style.width = '1px'; line.style.background = 'rgba(220,0,0,0.35)';const label = document.createElement('div'); label.textContent = `left edge: ${nudgeValue}px`; label.style.position = 'absolute'; label.style.top = '6px'; label.style.left = line.style.left; label.style.transform = 'translateX(-50%)'; label.style.fontSize = '11px'; label.style.color = '#a00'; label.style.background = '#fff'; label.style.padding = '2px 6px'; label.style.border = '1px solid rgba(160,0,0,0.2)'; label.style.borderRadius = '3px'; label.style.whiteSpace = 'nowrap';wrap.appendChild(line); wrap.appendChild(label); host.style.position = 'relative'; host.appendChild(wrap); }// ========= controller ========= function generateSignature(){ const nudge = parseInt($('nudgeRange')?.value || '0', 10) || 0; const nudgeVal = $('nudgeVal'); if (nudgeVal) nudgeVal.textContent = nudge; const html = buildSignatureHTML(nudge); renderPreviewWithGuide(html, nudge); const sink = $('copyTableArea'); if (sink) sink.innerHTML = html; }function copyTableOnly(){ const sink = $('copyTableArea'); if (!sink) return; if (sink.innerHTML.trim() === '') generateSignature();if (navigator.clipboard && window.ClipboardItem) { const html = sink.innerHTML; const blobHtml = new Blob([html], {type:"text/html"}); const blobText = new Blob([html.replace(/<[^>]+>/g," ")], {type:"text/plain"}); navigator.clipboard.write([new ClipboardItem({ "text/html": blobHtml, "text/plain": blobText })]) .then(()=> alert("Formatted signature copied! Paste it into your email app’s signature editor.")) .catch(()=> legacyCopy()); return; } legacyCopy();function legacyCopy(){ const temp = document.createElement("div"); temp.contentEditable = "true"; temp.style.position = "fixed"; temp.style.left = "-99999px"; temp.style.top = "0"; temp.innerHTML = sink.innerHTML; document.body.appendChild(temp); const range = document.createRange(); range.selectNodeContents(temp); const sel = window.getSelection(); sel.removeAllRanges(); sel.addRange(range); document.execCommand("copy"); document.body.removeChild(temp); alert("Formatted signature copied! Paste it into your email app’s signature editor."); } }// ========= bindings ========= document.addEventListener('input', (e)=>{ const id = e.target?.id; if (id && [ 'companyInput','websiteInput','nameInput','titleInput', 'mobileInput','officeInput','addressInput','emailInput','nudgeRange' ].includes(id)) { generateSignature(); } }); $('btnPreview')?.addEventListener('click', generateSignature); $('btnCopyTable')?.addEventListener('click', copyTableOnly);// first render generateSignature(); })();