Skip to main content

Using the New Signature Editor

Updated today

This article explains how to use the editor efficiently. Learn how to edit content, adjust design, and manage layout for each element, so your signature looks polished and professional.


Getting Started with the Signature Editor

  1. Open the Signature Editor

    • In the main navigation panel, click Signatures > Add signature.

    • Choose either “Start from Scratch” or “Use a template.”

    • The left panel will open on Edit, where you can adjust overall settings like colors, fonts, layout direction, and spacing.

  2. Edit existing elements

    • Click any element on the canvas.

    • The left panel will show Content, Design, and Layout options for that element.

  3. Add new elements

    • Click Add in the left panel, then drag and drop the element you want onto the canvas.

  4. Customize elements

    • Click the element on the canvas to see all the editing options in the left panel.

You can always drag elements around on the canvas to move them wherever you like.


Adding Elements

Here’s what you can add and what each does:

  1. Image: Upload logos or photos.

  2. Headline: Add your name, title, or company.

  3. Contact Details: Add email, phone, website, or address.

  4. Social Icons: Link your social profiles like Facebook, Instagram, or LinkedIn.

  5. Divider: Visually separate sections.

  6. Disclaimer: Add legal or company info.

  7. Green Footer: Add a branded footer section.

  8. Text: Add custom text anywhere.

  9. Button: Create clickable calls-to-action.

  10. Signoff: Add closing lines or email signoffs.

  11. Video: Embed a video link or thumbnail.

  12. Promotion: Highlight a marketing campaign or offer.

  13. Banner: Showcase an image or visual.

  14. Image Gallery: Add multiple images in one block.

  15. Icon: Add decorative icons or symbols.

  16. HTML: Add custom HTML for advanced customization.

Once added, click the element on the canvas to start editing it.


Editing Elements

Each element has three main sections in the left panel:

  1. Content – What the element shows.

    • Enter text, upload images, or add links.

    • Use variables to auto-fill info like image, logo, email, phone, or website.

  2. Design – How it looks.

    • Change fonts, sizes, colors, spacing.

    • Adjust borders, backgrounds, icons, and buttons.

  3. Layout – Where it goes.

    • Arrange elements vertically or horizontally.

    • Adjust spacing and alignment for a neat look.


Moving and Arranging Elements

  1. Drag and drop elements on the canvas to move them.

  2. Rearrange elements vertically or horizontally as needed.

  3. Fine-tune spacing and alignment in the Layout section.

  4. Use Undo/Redo at the top left if you need to revert changes.

Clicking an element in the left panel will add it to the editor canvas. To edit an element that’s already on your editor canvas, make sure to click directly on that element in the editor canvas, not in the left panel.


Preview and Save

  1. Click Preview (top right) to see how the signature looks for a specific employee.

  2. Switch between desktop and mobile views to check responsiveness.

  3. Click Save when you’re done. There are no drafts—your changes are applied immediately.

Right after opening the signature editor, please click Save to keep saving all the edits you make.


FAQs

Why does the preview of my signature on WiseStamp look different from how it appears in my email?

In some cases, the preview of your signature may look slightly different from the final version in your email. This is only a visual difference in the preview and does not affect how the signature is rendered in emails.

Can I add the same contact detail type (like two phone numbers)?

No, a specific contact detail type can only be added once (for example, you cannot have two “Phone” details). However, you can add another type of detail and customize it to display the additional information.

Can I control the space between a contact detail’s label and its value?

No, users currently cannot adjust the space between a contact detail’s label (e.g., “Email:”) and its value (e.g., “[email protected]”). This may result in less precise visual spacing.

Can I align the values of contact details independently?

Not at the moment. Because details are built using a table-based structure, it’s not possible to align values independently of their labels.

Why isn’t my element aligning correctly, even though I’ve set its position?

If an element doesn’t have enough space (not to be confused with padding), it may not align as expected. Ensure the element has adequate space in the layout for alignment settings to take effect.

Can I set a specific width for contact details or other text elements?

Yes, you can set a specific width for both detail and text elements within their settings.

Can I resize text or contact details directly on the signature preview?

No, resizing text or details directly on the canvas isn’t supported. To adjust sizes, use the predefined settings or select a different text style.

Can I change an element layout directly on the canvas?

No, layout adjustments must be made through each element’s settings. Direct manipulation on the canvas isn’t supported.

Can I add a URL to regular text?

No, URLs cannot be embedded directly within regular text. To include a link, use a button or another element that supports linking functionality.

Can I adjust the layout of icon elements?

Yes, you can adjust the layout settings for icon elements as needed.

What image formats are supported for image elements?

Only JPG and JPEG formats are currently supported for image elements. If you want to use another format (like PNG or GIF), you’ll need to convert it to JPG or JPEG first.

How can I create a gif/animated image?

You can easily create an animated image or GIF in the Signature Editor! Start by clicking the Image element in the left panel, then upload your first image or logo in the Content section. Next, turn on the Animation toggle that will appear at the bottom of the left panel. Upload a second image or logo, and choose from four different animation styles

Did this answer your question?