Custom Buttons

Custom Buttons Guide

Add powerful custom actions to your contact pages. Create buttons that link to external systems, trigger API calls, and automate workflows with a single click.

Why Custom Buttons?

Streamline Workflows

Access frequently used tools and systems directly from contact pages. No more copying and pasting between applications.

System Integration

Connect echowin to your existing tools. Update external CRMs, trigger automations, or sync data with custom API calls.

One-Click Actions

Perform complex operations with a single button click. Pass contact data automatically to external systems.

Team Consistency

Ensure everyone on your team uses the same processes and has access to the same tools, right from the contact page.

Button Types

Key Features

  • URL template with variables
  • Open in new tab option
  • Dynamic URL generation
  • Contact data insertion
Common Use Cases

View in CRM, Open Profile

Example Configuration
https://app.example.com/customer/{contact.id}/profile
https://app.example.com/customer/abc123/profile

Creating Custom Buttons

Creating a Custom Button

Step 1: Basic Information

What users will see

Optional helper text

Template Variables

Template Variables Reference

Basic Fields

{contact.id}Unique contact ID
{contact.firstName}Contact's first name
{contact.lastName}Contact's last name
{contact.email}Email address
{contact.number}Phone number
{contact.carrier}Phone carrier

Custom Fields

{contact.customFields.fieldName}Any custom field value
{contact.customFields.company}Example: Company name
{contact.customFields.dealSize}Example: Deal size

Variables are replaced with actual contact data when the button is clicked

Smart Field Validation

Automatic Button Disabling

Smart Field Validation

Buttons are automatically disabled when any required field referenced in their templates is empty, null, or contains only whitespace. This prevents errors and ensures data integrity when interacting with external systems.

Button Configuration

Name: Send Email
Type: link
URL:mailto:{contact.email}?subject=Hello {contact.firstName}

Contact Data

{
  "firstName": "John",
  "lastName": "Doe",
  "email": null
}
Button disabled - Missing required fields: email

The button will appear disabled with reduced opacity and show this message on hover.

How It Works

  • The system automatically scans all template variables in button configurations
  • Checks if the corresponding contact fields have values
  • Disables the button if any required field is empty, null, or whitespace
  • Shows a helpful tooltip listing the missing fields on hover

Button Management

Managing Custom Buttons

View Profile

Link

Icon: faUser · Position: 1

Send Email

Link

Icon: faEnvelope · Position: 2

Update CRM

HTTP

Icon: faSync · Position: 3

Generate Report

HTTPDisabled

Icon: faFileAlt · Position: 4

Do Not Call

Toggle

Icon: faToggleOn · Position: 5

Drag buttons to reorder them. Active buttons appear on all contact pages.

Best Practices

User Experience

  • Use clear, action-oriented button names
  • Limit buttons to essential actions
  • Add descriptions for complex actions
  • Buttons automatically disable when required fields are missing

Technical Setup

  • Test buttons with sample contacts
  • Handle errors gracefully
  • Use HTTPS for secure connections
  • Validate API responses properly
  • Consider which fields are required for each button

Performance

  • Cache responses when appropriate
  • Timeout long-running requests
  • Batch multiple API calls if possible
  • Minimize required fields to reduce disabled buttons

Maintenance

  • Document button purposes
  • Monitor API usage and limits
  • Update endpoints as APIs change
  • Review inactive buttons regularly
  • Ensure required fields are populated for critical buttons

Common Button Examples

Link Buttons

  • View in CRM: Open contact in Salesforce, HubSpot, etc.
  • Social Profile: Link to LinkedIn, Twitter profiles
  • Support Ticket: Create ticket in help desk system
  • Send Email: Compose email with pre-filled data

HTTP Request Buttons

  • Sync Data: Update contact in external systems
  • Trigger Workflow: Start automation in Zapier, Make
  • Generate Report: Create PDF report via API
  • Update Status: Change contact status in backend

Security Considerations

  • • Store API keys securely - never expose them in button configurations
  • • Use HTTPS for all external API calls
  • • Validate and sanitize data before sending to external systems
  • • Monitor button usage and API rate limits
  • • Regularly review and update API credentials
  • • HTTP requests are executed server-side to avoid CORS issues

Ready to Add Custom Actions?

Start creating custom buttons to enhance your contact management workflow.

Create Custom ButtonsLearn About Custom Fields