Documentation for ContactProtect Widget

Introduction

Thank you very much for purchasing the ContactProtect Widget.

Good luck in using it on your website!

Get Started


There are basic steps to log in to the Admin Panel:

  • Open this URL in your browser:
    https://contact-protect.com/cp-login.php
  • In the opened login form enter your email address and your purchase code in the corresponding fields (the purchase code is the code that you received when you purchased the Widget). If you want to store the values of these fields (so do not enter them each time), you should check the checkbox "Remember me" at the bottom of the login form. Then click on the "Log in" button.

Get Started

After that (if the entered email address and purchase code are valid), the "Widgets" page will be automatically opened (in the Admin Panel), and you can configure your Widgets according to your preferences.

  • If you have forgotten your purchase code, you should click on the "Forgot your purchase code?" link below the login form.

Get Started

In the opened form enter your email address in the corresponding field. Then click on the "Remind Purchase Code" button.

Get Started

After that, your purchase code will be sent to your email address, and you can enter it on the login page.

  • If you want to log out of the Admin Panel, you should click on the "Log out" button at the top right corner of the page.

Get Started

User Profile


To view your profile details or change your email address, go to the "User Profile" tab of the Admin Panel.

Here you can see the following data:

  • Your email address
  • Your purchase code
  • Your price plan
  • How many widgets maximum you can create according to your price plan
  • How many widgets are left (excluding the widgets you have already created)
  • The expiration date of your price plan

User Profile

To change your email address, enter your new email address in the corresponding field. Then click on the "Save Changes" button.

User Profile

Widget Generator


To add your Widgets, go to the "Widgets" tab of the Admin Panel.

Here is the "Widget Generator" that allows you to create Widgets with protected email addresses (as well as other contacts and any links) according to your preferences.

Widget Generator

Here you should enter an email address (or other contact or any link) in the required field "Email or Link". You can set Font, Font Size and Font Color in the corresponding fields. At the bottom you can see the preview of your email address (or other contact or any link) with the selected options. It is the instant preview that changes as soon as you change any option.

NOTE: When you click on the protected email address (that is inserted into pages on your website through the Widget), the email client window (for example "Outlook Express", "The Bat!" etc.) will be automatically opened with the "Email Address" field filled with your email address.

If you want to insert the clickable text link instead of the email address (or other contact or any link) itself you should enter your text in the "Anchor Text" field.

Widget Generator

NOTE: The text will be displayed but when you click on this text link, the email client window (for example "Outlook Express", "The Bat!" etc.) will be automatically opened with the "Email Address" field filled with your email address.

If you would like to create a link with an image or icon instead of text, then you should enter the HTML code of this image or icon in the "Anchor Text" field.

Widget Generator

You can also copy the protected email address (or other contact or any link) to the clipboard by clicking the right mouse button on it and then clicking on the "Copy to Clipboard" item. And after that you can paste the copied email address (or other contact or any link) where you want.

Widget Generator

NOTE: You can change the label "Copy to Clipboard". For example, you can translate it into any language. To do this, enter your translation in the "Label on Copy Button" field in the Widget Generator.

You can fill the "Subject", "Carbon Copy" and "Blind Carbon Copy" fields. In this case, when you click on the protected email address, the email client window (for example "Outlook Express", "The Bat!" etc.) will be automatically opened with the "Subject", "Carbon Copy (CC)" and "Blind Carbon Copy (BCC)" fields filled.

Also you can fill the "Class (CSS)" field to add your custom CSS class to the protected email address (or other contact or any link).

Widget Generator

If you want to hide your email address (or other contact or any link) from screen readers, you should check the checkbox "Hide Email or Link" and enter your text in the "Hide Text" field. In this case, the clickable text link will be displayed instead of the email address (or other contact or any link) itself, but when you click on this text link, the protected email address (or other contact or any link) will be shown. When you click on the shown protected email address, the email client window (for example "Outlook Express", "The Bat!" etc.) will be automatically opened with the "Email Address" field filled with your email address (also "Subject", "Carbon Copy (CC)" and "Blind Carbon Copy (BCC)" fields can be filled automatically if you wish).

Widget Generator

In addition to email addresses, you can also protect other contacts (phone numbers, messengers, social medias, etc.) and any links. Below are examples for a phone number, Telegram, WhatsApp, Viber, FB Messenger, X (Twitter) and a custom link.

Widget Generator

Widget Generator

Widget Generator

Widget Generator

Widget Generator

Widget Generator

Widget Generator

Widget Generator

To save the Widget in the Widget List (for using it on your website), you should click on the "Add New Widget" button.

Widget Generator

After that the added Widget will appear in the Widget List below, and the message "Widget added" will be displayed at the top.

Widget Generator

In the Widget List you can sort your Widgets alphabetically by the columns "Email or Link", "Anchor Text" and "Hide Text" by clicking on the title of the corresponding column.

Also you can search for any saved Widget by its email or link, its anchor text or its hide text by typing a part of the text or the email address or link into the corresponding field above the Widget List.

Widget Generator

If you would like to edit the Widget, you should click on the green "Edit" button near it in the Widget List.

Widget Generator

After that the fields of the Widget Generator form will be filled with the data of the Widget which is being edited, and the "Save Widget" and "Cancel" buttons will appear at the bottom of the Widget Generator form.

Widget Generator

If you would like to cancel Widget editing, you should click on the "Cancel" button.

If you would like to save the edited version of the Widget, you should click on the "Save Widget" button. Then the edited Widget will be saved in the Widget List, and the message "Widget saved" will be displayed at the top.

Widget Generator

You can delete any Widget from the Widget List. For deleting one Widget you should click on the red "Delete" button near it in the Widget List.

Widget Generator

For deleting several Widgets at once you should check Widgets that you would like to delete in the Widget List and then click on the "Delete checked Widgets" button.

Widget Generator

This button is located above and under the Widget List. Both buttons "Delete checked Widgets" are identical, so you can click on any one of them.

Widget Generator

If you would like to check (or uncheck) all displayed Widgets in the Widget List, you can check (or uncheck) the corresponding checkbox "Check all Widgets" at the top or at the bottom. Both checkboxes are identical, so you can check any one of them.

Widget Generator

Each field in the "Widget" column is resizeable. You can resize it by pulling at its bottom right corner.

Widget Generator

Usage on Websites


To use the Widget on your website, you should insert the Widget's HTML code into the source code of your webpage. It's as easy as inserting the Google Analytics code into your webpage.

To insert the Widget (from the Widget List) into webpages on your website, you should select the corresponding Widget in the "Widget" column in the Widget List and then copy the selected Widget's HTML code and paste it into your webpage. You can copy the selected Widget's HTML code by typing the "Ctrl+C" combination on the keyboard or by clicking the right mouse button and selecting the "Copy" item in the shortcut (context) menu.

Usage on Websites

That's all! After that, the Widget with the protected email address (or other contact or any link) will appear on your webpage.

Integration with Popular CMS and Website Builders

Support

If you have any questions or suggestions, please feel free to contact our Support Team:

https://rainbow-inform.com/contacts/