Create a custom template

Download the commented starter template — it contains every element Sigly expects, annotated line by line:

Download the starter template

Rename it and restyle anything you like. The filename becomes the gallery name — acme-classic.html shows as Acme Classic.

Signatures render inside email clients, and email clients are stuck in the past — desktop Outlook literally uses Word's rendering engine. Every template must therefore use:

• Tables for layout — never flexbox, grid or floats. One outer <table> is the template's root element.
• Inline styles on every element — no <style> block, no classes, no external CSS. Mail clients strip them.
• Absolute https:// image URLs — signatures travel with the email, so relative paths break instantly.
• Email-safe fonts — Arial, Helvetica, Verdana, Georgia, Times, Tahoma, Trebuchet, Courier. Web fonts fall back unpredictably.
• Total width around 600–650px — wider gets clipped or scaled on mobile.

These ids are how Sigly finds each field. All of them must exist — hidden ones simply start with display:none and the builder switches them on.

Text fields

• namePlaceholder, titlePlaceholder — always visible; the name is what the name-colour picker targets.
• pronounsPlaceholder, departmentPlaceholder, companyPlaceholder — each wrapped in a matching …Container that starts hidden.
• officePhonePlaceholder, cellPhonePlaceholder, faxPlaceholder — inside their …Container spans, all three inside a phoneRow div. Sigly writes formatted numbers and tap-to-call links into these.
• addressPlaceholder — a block element; Sigly wraps its contents in a directions link when that option is on.

Link fields

• emailPlaceholder and websitePlaceholder are the <a> tags themselves — Sigly rewrites their href and can place an icon inside them.

Images and zones

• logoContainer/logoImage and profilePicContainer/profilePicImage — the builder moves these containers between topZone, leftZone and rightZone when the user picks a placement, so all three zone cells must exist even though two start empty.
• footerImagesContainer with footerImage1–4 and footerImageLink1–4 — four fixed slots for banners, badges and certification marks.

Everything else

• customLinksContainer — where user-added links render.
• disclaimerContainer — starts empty; the builder fills it.

• Labels sit before their placeholder, inside the container: Office: <span id="officePhonePlaceholder">…. That's what lets a chosen icon replace the "Office:" text. A label can be plain text, <strong>, an emoji or a small image — the builder handles all four.
• Hidden sections use display:none on the container — never delete optional sections. The builder strips hidden ones from the sent signature, so they cost nothing.
• Gallery dummy links use href="#" in customLinksContainer. They make the slot visible in the gallery without being imported as real links.
• HTML comments are fine — annotate your file freely. Sigly strips comments from every exported and deployed signature automatically.
• Sample content should look plausible — the gallery shows your file as-is, so "Jordan Example, Operations Manager" beats "xxxx".

Upload your file to the templates/ folder of your Sigly installation, open it in the builder, and run the checklist:

• Fill every field — name, title, phones, email, address, website — and watch each land in the right spot.
• Switch every toggle on and off: pronouns, department, company, fax.
• Set an icon on a contact field — the label should be replaced, and come back when the icon is removed.
• Move the logo and profile picture between top, left and right.
• Change the name and link colours, the font, the size, and the accent line.
• Copy the finished signature into a real mail client and send yourself an email — the only test that fully counts.

Add a preview image so the galleries show your design: a PNG named after your file — acme-classic.html → assets/images/templates/acme-classic.png — around 1286px wide. A screenshot of the rendered signature on a white background is exactly what the built-in thumbnails are.

That's it. The template appears in the homepage gallery and the dashboard Templates page automatically, and works with CSV rollout, Microsoft 365 and Google Workspace personalisation with nothing further to wire up.