Signup pop-ups for webapps

Signup pop-ups for webapps

Signup pop-ups are intended to convert your visitors to leads effectively. They gather information about the visitors on your app. They can be used for subscriptions and registrations. You can set where, when, how, and to whom they should appear in your app.  

Creating Signup pop-ups

  1. From theNavigation toolbar, choose Web Assistant and select Webapp.
  2. Select the domain for which you want to create a signup pop-up .
  3. Click  Smart pop-ups  
  4. Click  Create smart pop-up .
  5. Click  Create new in Signup pop-ups section.
  6. Edit the default name provide on left top corner to customize the pop-up name.

Defining Signup pop-ups

Once you've given your pop-up a name, you can proceed to define it. 

Click  Design signup pop-up  . Creating a pop-up involves the following three steps. 

  1. Selecting a pop-up template 
  2. Customizing your pop-up 
  3. Setting up pop-up display preferences 

Selecting a pop-up template 


We have a wide range of predesigned templates from which you can choose and customize to suit your needs. Go through the Standard pop-up and full page pop-up templates and choose the one you want by clicking 
Use template .

Customizing your pop-up 

Once you have chosen the template, you will be taken to the pop-up editor. You can customize the pop-up as per your need. You can apply different styles to every element in the pop-up.

Customize texts:

Select the text you want to customize and do any of the following:

  • Background  - Apply a background color and image for the text. 
  • Border  - Change the border color, style, and size for the text. 
  • Width  - Change the width of the text. 
  • Height  - Change the height of the text. 
  • Font : Change the font of the text.
  • Text : Write your own message. 
Customize input fields 

Click the field you want to customize and do any of the following: 
  • Background   - Apply a background color and image for the fields.  
  • Border   - Change the border color, style, and size for the fields.  
  • Width   - Change the width of the fields.  
  • Height   - Change the height of the fields.  
  • Font  : Change the placeholder content style, size. 
  • Text  : Write your own placeholder content. 


You can apply different styles to every field in the form. 

Customize button 

You can customize the look of the button by doing any of the following:

  • Background  - Apply a background color and image for the button. 
  • Border  - Change the border color, style, and size for the button. 
  • Width  - Change the width of the button. 
  • Height  - Change the height of the button. 
  • Font  - Change the label font, color, style and size of the button. 
  • Text - Change the label of the button. 
Customize pop-up body 

Click on the pop-up body to customize and do the following: 

  • Background  - Apply a background color and image for the body. 
  • Border  - Change the border color, style and size for the body. 
  • Width  - Change the width of the body. 
  • Height  - Change the height of the body. 
  • Background image - Change the image in the background.
  • Image opacity - Change the opacity of the background image
  • Border radius - Change the radius of the background

Customize image:

Click on the image you want to customise and do the following.

  • Background image   - Change the background image 
  • Aspect ratio   - Change the aspect ratio of the image 
  • Image opacity   - Change the image opacity.  
  • Background   - Change the background of the image. 
  • Border  - Change the image border style and thickness
  • Border radius  - Change the radius of the image background 

Customize image

Customize overlay:

Overlay covers the webpage forming the base for pop-up. You can customize its appearance on the screen.

  • Choose overlay option.
  • You can change the overlay's opacity and its background. 

Setting up pop-up display preferences 

Once you've customized the pop-up to suit your needs, you need to choose when, where, and how your pop-up should appear on your pages. 

Click the  Set up tab from the left pane of the editor and set up the following: 

When to show 

Set up when you want your pop-up to appear on your visitors' screens. You can choose to display the pop-up on the  Entry of the visitors or at their  Exit  or when they  scroll  up to a certain percentage of the page. For the scroll option, define the percentage of content you want your visitors to view before you show them the popup.   You can also set the  Time Onpage  option that shows your pop-up after a set time the visitor is on page.

Where to show 

Define where on the webpage you want your pop-up to appear by choosing the  Position . You can choose between center, top-left, top-right, bottom-left, or bottom-right of the webpage. 

How to show 

Define how you want your pop-up to appear in your page. Choose from the listed animations. 

Re-appearance of pop-ups

Define the time for the pop-up to reappear when the visitor rejects the pop-up. You can also choose to continue to show the pop-up to the visitors on rejection by choosing No limit in the drop down. 

How to show the pop-up  

Once you're done with the customization, click Save and proceed .  

Every signup pop-up needs to be associated with a list. Anyone signing up or registering via the form will be added to the associated list.   In the popup detail view, click Associate mailing list and select your desired list.

Define response pages  

When visitors submit your pop-up, they will be redirected to a thank you page, and will be sent a confirmation email. You can choose to use the default pages and emails, or customize them to suit your needs.  

To customize the pages, click the   Edit  icon next to the pages.  

  Signup thank you page 

Thank your visitors when they submit your pop-up. You can opt to open the page in the same window, new window, or as an inline popup with a small, customized browser message.  


Designing the signup thank you page 

Select the   Signup thank you page  sub tab. Here you can do the following:  

  • Choose where you want to open the thank you page. You can choose to open it in a new window, in the same window, or have the message inline.  

  • Choose if you want to show the thank you page or redirect to another URL. 

  • Customize the content and design of the thank you page. Click the Edit icon next to the content. This will open an editor where you can make the customizations.    

Confirmation email 

This is an email sent to the leads' email addresses they used for signup. This email includes a button that the leads need to click to confirm the authenticity of their email address.  

Designing the confirmation email 

Select the   Confirmation email  sub tab. Click the   Edit  icon to customize the content and the design of the email. This will open an editor where you can do the following:  

  • Change the subject, sender name, and sender address. 

  • Add your company logo by clicking the  Choose or upload logo  button. 

  • Edit the content (change the font, size, color, etc.), and customize it to suit your needs. 
     

Confirmation thank you page 

When your leads confirm, you can show them a thank you page. You can either make use of a default page or redirect the lead to another URL.  

Designing the confirmation thank you page 

Select the   Confirmation thank you email  sub tab. Click the   Edit  icon to customize the content and the design.  

Resubscribe email 

This is a confirmation email sent to those who have previously unsubscribed and want to resubscribe. The email will be sent to the address provided by them and includes a button for the leads to confirm their interest in resubscribing.  

Designing the resubscribe email 

Select the   Resubscribe email  subtab. Click the   Edit  icon to customize the content and the design of the email. This will open an editor where you can do the following:  

  • Change the subject of your email. 

  • Note: The sender name and sender address will be the same as given for the confirmation email. 

  • Add your company logo by clicking the  Choose or upload logo  button. 

Edit the content (change the font, size, color, etc.), and customize it to suit your needs. 


Select pages 

Now you will be taken to the detail view of the pop-up. Click Select pages and fill in the following information: Under this section, select webpages where you want your pop-up to appear, 

Pages  : Choose the webpages where you want the pop-up to appear. You can select one of the following: 
    • All pages  - Show the pop-up in all the pages of the selected domain. 
    • Specific pages  - Show the pop-up only on the selected pages. Select the required pages from the dropdown menu. 
    • Pages matching a specific criteria  - Define a criteria based on the page URL. The pop-up will be shown only on the pages that match the criteria.
The pop-up will appear only on the pages where the Web Assistant's tracking code is embedded.  

Activity based criteria You can set up certain activity based criteria and the pop-up will be shown to the visitors who satisfy the criteria. 

Filter users based on their field information
: You can set up certain field based criteria and the pop-up will be shown to the visitors who satisfy the criteria.
By default, the pop-up will be shown to known visitors.

Click Save after adding the details.   

Select pages

Schedule

Here you should define the time period you want your pop-up to be active on your pages. 

Click  Schedule . You can choose to keep the pop-up active always or set a definite time period. 

Schedule pop-up

Once you've completed the setup you can Activate the pop-up. 

Reports 

Once you've activated the pop-up you can see the pop-up report under the Reports section. 

Overall stats 

You can view the following information: 

  • Views  - Number of visitors to whom the pop-up was displayed. 
  • Bounces  - Number of visitors who closed the popup without submitting. 
  • Clicks  - Number of clicks received by the CTA button irrespective of the number of visitors.
  • Unique clicks - Number of visitors who clicked the CTA button


Time-based report 

This graph will show you the number of views, bounces, clicks, and unique clicks over time. 


Top performing countries 

Countries with the highest number of clicks will be listed in this section. 

Pages with high conversions  

Pages where the highest number of conversions occurred will be listed in this section.

Pages with high bounces  

Pages where a high number of bounces occurred will be listed in this section. 


Location-based stats 

You can view the number of views and clicks occurred from various locations on a geo-map. 


Location based stats
    • Related Articles

    • Understanding Signup pop-ups

      Signup pop-ups are intended to convert your visitors to leads effectively. They gather information about the visitors on your webpages. They can be used for subscriptions and registrations. You can set where, when, how, and to whom they should appear ...
    • Signup pop-ups for website

      Signup pop-ups are intended to convert your visitors to leads effectively. They gather information about the visitors on your webpages. They can be used for subscriptions and registrations. You can set where, when, how, and to whom they should appear ...
    • Smart pop-ups

      Pop-ups are effective in bringing about a lot of conversions. They are proven to work in optimizing your online marketing potential. There are two types of smart pop-ups you can create using Zoho MarketingHub: Signup pop-ups Signup pop-ups are ...
    • Creating smart pop-ups for website

      Pop-ups are effective in bringing about a lot of conversions. They are proven to work in optimizing your online marketing potential. There are two types of smart pop-ups you can create using Zoho MarketingHub: Signup pop-ups Signup pop-ups are ...
    • Creating smart pop-ups for web app

      Pop-ups are effective in bringing about a lot of conversions. They are proven to work in optimizing your online marketing potential. There are two types of smart pop-ups you can create using Zoho MarketingHub: Signup pop-ups Signup pop-ups are ...