Title: Contact Camo
Author: Plan Left
Published: 8 juin 2023
Last modified: 2 juillet 2026
---
Recherche d’extensions
# Contact Camo
Par [Plan Left](https://profiles.wordpress.org/planleft/)
[Télécharger](https://downloads.wordpress.org/plugin/planleft-contact-camo.1.0.26.zip)
* [Détails](https://fr.wordpress.org/plugins/planleft-contact-camo/#description)
* [Avis](https://fr.wordpress.org/plugins/planleft-contact-camo/#reviews)
* [Développement](https://fr.wordpress.org/plugins/planleft-contact-camo/#developers)
[Support](https://wordpress.org/support/plugin/planleft-contact-camo/)
## Description
Contact Camo protects email addresses from scrapers and bots — now with a native
Gutenberg block so you can build beautiful, protected contact experiences without
touching a single line of code.
### What Is It?
Contact Camo is a plugin for WordPress developed by Plan Left that effectively hides
or obfuscates email addresses from scammers, web scrapers and internet bots to help
minimize spam and other nefarious, automated actors.
In addition to protecting email addresses, Contact Camo provides rich, visual control
over how those protected email addresses are displayed and interacted with by your
visitors — all from inside the WordPress block editor.
### Now with a Native Gutenberg Block!
Contact Camo now feels right at home in the WordPress block editor. Drag it in,
configure it visually, and see a live preview of exactly what your visitors will
see — no shortcodes, no guesswork.
**Everything is point-and-click:**
* 🎨 **Pick an icon** — Browse and search hundreds of WordPress icons right inside
the sidebar. Choose your size from XS to XL, or dial in an exact pixel size.
* 🖌️ **Choose a color** — Set the text and icon color using your theme’s color
palette or a custom color picker. It just works.
* 🔘 **Link or button?** — Toggle between a standard link and a styled button in
one click. Your theme’s button styles apply automatically.
* 📋 **Inline or popup form?** — Show a sleek embedded contact form or a modal
popup — your choice, configured visually.
* 📐 **Control the layout** — Adjust container padding and form width to fit perfectly
within your design.
* 👁️ **Show what you want** — Display the icon and text together, icon only, or
text only. You decide.
* ⚡ **Live preview** — Every change you make is reflected instantly in the editor
canvas. What you see is what you get.
All of the above is available through the shortcode too, for those who prefer it.
### Example Use Cases
* Educational Organization with large faculty directories
* Nonprofits who need to be accessible without displaying in-content email addresses
* Large Organizations who have departmental pages and points of contact but don’t
want to maintain multiple contact forms
* Anyone who doesn’t want to expose email addresses to the scammers, scrapers and
bots of the internet.
### Why Did You Make This Plugin?
We work with many non-profits and educational organizations that need to list contact
info in directories on their website. Due to the public visibility of these and
their large user base, our clients’ web properties are under constant threat from
spammers and bots. We wanted to ensure that their user directories were safe from
these threats while still being functional to visitors. In other words, we needed
to hide a bunch of email addresses from the outside world while still allowing the
outside world to contact those users via their email address. When we got to developing
this plugin, we knew we had to provide a solution that was as bulletproof as possible
while allowing our clients and customers the most amount of control over things
as practical.
#### Ultimately, we needed to create a plugin that would:
* Optionally hide or obfuscate email addresses from scrapers and bots securely
and confidently. For our use case, email addresses needed to be obfuscated in
the source code, the DOM, and in HTTP requests. We took the email address out
of the client-side equation completely by just tucking it safely away in the
database in a lookup table instead of providing a workaround that simply disguises
the email address. We essentially took the email address to a safe house and
sent out its representative to interact with the outside world on its behalf.
Nobody gets the email, not no way, not no how, see?!?
* Provide users with lots of control over the UX of protected email addresses,
without the need for cumbersome configuration. The Gutenberg block handles all
of that visually, and the shortcode is still there for power users.
* Be performant in capabilities, lightweight in footprint, and opinionated in scope.
The client was very pleased with the end-result and so were we. So, we decided to
offer it back to the community. Our development team reviewed and scrutinized the
existing plugin, found areas for improvements and further customizations, and baked
them right in for everyone to use.
### Who Is It For?
Site administrators and content editors/moderators. Anyone with a WordPress site
that would like the peace of mind of knowing that their users’ email addresses are
safely hidden from spam bots and other unintended consumers with ill intent. Content
creators that don’t want to worry about the complications and time expenditure of
dealing with and managing their user base getting spammed from their platform. And
especially when any of the above mentioned require some level of control over what’s
displayed to their users, who may very well be their customers or clients or patients,
etc… It’s for site builders that want protection AND customization without being
overwhelmed.
With the new Gutenberg block, that means literally anyone editing a page in WordPress—
no code required.
### What Problems Does It Solve?
Contact Camo hides or obfuscates email addresses in the source code AND the DOM.
Not only this, it ensures the unobfuscated email address is never used in any page
or ajax request from its originating context; all handling/processing is done server-
side. Once obfuscated, the client-side never sees the original email address again(
where obfuscated). The obfuscation (key) is a hash that is stored in a lookup table
with the original email address.
A few of the limitations we found in some existing (but great) plugins:
* email address only obfuscated in DOM, but not in source code
* email address only obfuscated in source code, but not in the DOM
* integrating with a 3rd-party service that scrapes entire pages and performs a
search-and-replace of email addresses with obfuscated versions in the source
code
* email address obfuscation using only html entities replacement
* few options for controlling output
* no contact form or fallback options
* no native block editor support
### How Does It Work?
**With the Gutenberg block (recommended):** Search for « Contact Camo » in the block
inserter, drop it onto your page, enter the email address you want to protect, and
configure everything else from the visual sidebar. Done. You’ll see a live preview
of the output right there in the editor.
**With the shortcode:** Contact Camo provides a simple shortcode that can be placed
anywhere shortcodes are supported. The shortcode’s default output is a clickable
link with the obfuscated email address’s generated hash stored in a data attribute.
On click, this hash is used to look up the email address and then open the browser’s
configured email client with the « To » field pre-populated.
The shortcode accepts parameters for overriding the default output — output a button
instead of a link, add CSS classes, change the text output, choose an icon, set
a color, and more.
The shortcode also supports an embedded contact form or an optional modal popup
contact form as an alternative to triggering the email client.
### What is Hide vs Obfuscate?
For our plugin, we wanted to give site administrators the option to either completely
hide the email address and never let any end content consumer see any piece of the
email, or to hide the email until requested and reveal it in context after a specific
action is taken.
* **Hiding the email address:** The site visitor will never see the email address,
and instead only be presented a popup contact form that submits and mails through
ajax. This option totally hides the email, and it will never be revealed unless
the emailed recipient emails the form submitter back.
* **Obfuscating the email address:** The site visitor will not see the email address
until the contact button (or link) is clicked. On click, the email address will
be revealed and the visitor can copy or mail to that address.
### What Can I Do With It?
We chose to err on the side of simplicity, balanced with enough options to be truly
useful. The Gutenberg block makes all of these options accessible without writing
a single line of code:
* Show a link or a button — your theme’s styles applied automatically
* Add an icon from a library of hundreds, with full size control
* Set a custom text and icon color using your theme palette or a custom picker
* Show only the icon, only the text, or both
* Display an inline contact form or a modal popup form
* Control padding, form width, and layout
* Add a custom CSS class or anchor ID for targeting with your own styles or JavaScript
All of the above is also available via the shortcode for developers and power users.
#### Basic Usage
**Block Editor:**
Search for « Contact Camo » in the block inserter (+), add it
to your page, enter an email address in the sidebar, and you’re protected.
**Shortcode:**
* **`[contactcamo email="contact@example.com"]`**
output: a basic anchor tag with default text
* **`[contactcamo email="contact@example.com" label="Contact Us" form=true button
=true]`**
output: a clickable button with text that says « Contact Us »
* **`[contactcamo email="contact@example.com" label="Contact Us" form=true button
=true popup=true]`**
output: a clickable button that, when clicked, pops up a modal contact form
* **`[contactcamo email="contact@example.com" icon="email" display="both" iconsize
="md"]`**
output: a link with a mail icon and text
* **`[contactcamo email="contact@example.com" id="one-contactcamo-to-rule-them-
all" label="Fly, You Fools!" button=true class="btn btn-lg btn-lt-blue"]`**
output: a large, styled clickable button with custom text
#### Shortcode Parameters
* **email** _required string_
the email address to be obfuscated
* **label** _optional string default= »Email »_
the visible text on the link or
button
* **subject** _optional string_
pre-fills the email subject line
* **icon** _optional string_
a Dashicon slug (e.g. `email`, `phone`, `admin-users`)
to show alongside the label
* **display** _optional string default= »both »_
controls what is shown: `both`(
icon + text), `icon` (icon only), or `text` (text only)
* **iconsize** _optional string default= »sm »_
icon size preset: `xs` (12px),`
sm` (16px), `md` (20px), `lg` (28px), `xl` (36px), or `custom`
* **iconsizepx** _optional integer default=20_
custom icon size in pixels, used
when `iconsize=custom`
* **textcolor** _optional string_
a hex color value (e.g. `#e63946`) for the text
and icon color
* **form** _optional boolean default=false_
if true, show a contact form instead
of opening an email client
* **popup** _optional boolean default=false_
if true, show the contact form in
a modal overlay when clicked
* **formtitle** _optional string default= »Compose Email Message »_
the heading
shown at the top of the popup form
* **formwidth** _optional integer default=325_
maximum width of the contact form
in pixels; set to `0` for full width
* **button** _optional boolean default=false_
if true, render a `