Help Center – Contact Button Help Center – Contact Button
  • Home
  • About
  • Pricing
  • Log In
Sign Up
Help Center – Contact Button Help Center – Contact Button
Sign Up
Help Center – Contact Button Help Center – Contact Button
  • Home
  • About
  • Pricing
  • Log In
loading
  1. Home
  2. Articles
  3. Getting Started
  4. Setup Guide – How to Create a New App
Updated on March 6, 2025

Articles

  • Folder icon closed Folder open iconGetting Started
    • Setup Guide – Get Started in 15 Minutes or Less
    • Setup Guide – How to Create a Button
    • Setup Guide – How to Create a New App
    • Setup Guide – Creating New Workspaces
    • Setup Guide – How To Create a List or Menu
  • Folder icon closed Folder open iconApp Guides
    • App Setup Guide – Contact Forms App
    • App Setup Guide – Chat Widgets
    • App Setup Guide – Facebook Messenger
    • App Setup Guide – WhatsApp Business
    • App Setup Guide – Click-to-Call
    • App Setup Guide – Map Links
    • App Setup Guide – Website Links
    • App Setup Guide – HTML Embed
    • App Setup Guide – Business Hours
    • App Setup Guide – Social Links
    • App Setup Guide – Send Messages
    • App Setup Guide – Images & PDFs
    • App Setup Guide – Email Subscriptions
    • App Setup Guide – Reservations & Bookings
    • App Setup Guide – Lists & Menus
  • Folder icon closed Folder open iconWebsite Installation
    • Install on Cardd
    • Install on Ecwid
    • Install on Framer
    • Install on Ghost
    • Install on Google Tag Manager
    • Install with HTML
    • Install on Lightspeed
    • Install on Shopify
    • Install on Squarespace
    • Install on Wix
    • Install on Webflow
    • Install on Weebly
    • Install on WordPress
  • Folder icon closed Folder open iconIntegration Guides
    • Integrate the Tawk.to Chat Widget
    • Integrate the Crisp Chat Widget
    • Integrate the 2Chat Chat Widget
    • Integrate the Hubspot Chat Widget
  • Folder icon closed Folder open iconProduct FAQs
    • How do I remove the "⚡ by Contact Button" branding?
    • Why are my Buttons and/or Apps not displaying on my site?
    • How Do I Change Default Button & Menu Font?
    • Where do contact form responses go?
    • How do Contact Form app webhooks and callback URLs work?
    • Which countries & languages does Contact Button support?
    • Can I use the same kind of app multiple times in one button?
    • Can I have multiple buttons on same domain?
    • Do I need to have website development skills to use Contact Button?
    • How do I switch between workspaces?
    • Can I change my account email address?
    • How do I request a new password?
    • What happens when I go over a monthly plan limit?
    • Can I use a hyperlink to automatically open button menu?
  • Folder icon closed Folder open iconAccounts & Billing
    • What kind of support do you offer?
    • Accepted Payment Methods
    • Calculating Taxes
    • How Are Plan Limits Tracked?
    • How Do I Cancel My Subscription?
    • How To Find Your Billing History & Invoices
    • How Do I Upgrade My Account?
    • Is it possible to downgrade plans?
Getting Started

Setup Guide – How to Create a New App

Estimated reading: 5 minutes 11325 views

You can easily create a new app to add to any of your Contact Buttons without the need of a developer. Simply complete the following steps to create a new app to any your buttons on your website.

Step 1 

Click on the Add New Button icon in the side menu and select “New App”. Alternatively, you can click the Apps Button to go to your apps page and then click the blue “+ Create New App” button. Both do the same thing.


Step 2

Select any of the Apps listed. Please visit contactbutton.com/apps if you’d like to learn more about any of the apps.


Step 3

In the “App Setup” section, make sure to give your new app a Display Name. This will be shown to users if you have a row or column button layout as well as be used as your internal name for the app.

If you use the row layout, make sure to also fill out the App Description field, otherwise we’ll display text that says “Null” instead.


Step 4

Each app has a different setup flow. We’ve tried to make it as intuitive as possible to complete the fields, but here are links to detail setup instructions for every app we currently offer in alphabetical order.

  • Business Hours
  • Chat Widgets
  • Click-to-Call
  • Contact Forms
  • Email Subscriptions
  • Facebook Messenger
  • HTML Embed
  • Images & PDFs
  • Lists & Menus
  • Map Links
  • Reservations & Bookings
  • Send Messages
  • Social Links
  • Website Links
  • WhatsApp Business

Step 5 

In the “Icon Design” section of every app, you’ll find the fields listed below.

  • App Icon
    We provide you with a default app icon plus over our 500 different Font Awesome icons to choose from.

    To change the default icon we’ve selected for a particular app, just click the “Search Icons” button to open up an icon selector popup box. Click the icon you want and we’ll automatically change the current selection for you.

    Or if you’d prefer to have a custom app icon, simply click the Custom button and then upload an app icon of your choice in JPG or PNG format.
  • Background Color
    If you decide to use an App Icon in the previous step, you can set any color you want as a background by clicking on the colored box to open a color picker or by entering a 6 character hex value in the box to the right of it.
  • Border
    By default, we don’t add any borders or drop shadows to icons, but if you’d like to add one, click the drop down box to add one. All you need to do is select a color from the color fields that show up once you change from the default of “No Border”.

Step 6

In the “Display” section of every app, you’ll find the fields listed below:

  • Add to Button(s)
    By default, any time you create a new app, we add it to any of your existing buttons. If you do not want to add the app you’re creating to a button, just click on the x to the left of the button’s name.

    Note: You can always add apps to button’s you skipped in this step by editing the button and adding a button in this same field by clicking the blue “+” button.
  • Show on Device
    If you don’t want an app to be displayed to users using a certain type of device, you can disable the app for specific devices by unchecking either of the two boxes. 

    Note 1: If you uncheck both boxes, nobody will see the app.

    Note 2: Desktop devices include laptops. 

    Note 3: Mobile devices include tablets.

  • Enable App
    If for any reason you want to quickly prevent a particular app from showing up in any of your buttons without having to delete it, simply click the blue toggle to disable the app and it will not be displayed anywhere until you switch the toggle back to on.
  • Show at all times
    Since some apps allow people to contact you directly, like “Click-to-Call”, we offer you the ability to decide the hours of the week that an app is visible to your website visitor.

    If you decide to set custom hours, you just have to adjust the blue part of the slider to the times you want it to display. We will hide the app outside of these times.

    Important Note: The times are based on the time zone you have selected in the “Location” tab found on your Settings page, so please make sure you adjust that setting if you want to use this feature.

    If for example, you don’t want an app to show up on the weekend, all you have to do is click the two arrows on the right of the slider to turn off all minutes of the day.

    Or if you want to disable an app outside of business hours, just drag the two sliders to a start and finish time.

Step 7

Click the save button on the bottom of the page. Your new app will immediately show up on any of the Contact Buttons you added it to in the previous step.

If it isn’t showing up for some reason, please make sure the Enable App toggle is switched to on.

Still stuck? Click here to message us.

How can we help?

Was this page helpful? Yes No

CONTENTS

Powered By EazyDocs

© 2024 All Rights Reserved by Contact Button