đĄNeed a different CTA? Reach out to our team through the support request system
House Ads allows us to easily create banners, pop-ups and buttons to invite user to subscribe to your newsletter or to become a supporter. We provide some templates by default.
Types of CTAs or House Ads
We will often work with 3 types of CTA:
Slide-in
Popup
Before/After
Check their differences and best practices below.
1. Slide-in
What is: A popup or an opt-in form that slides in politely from the corners/sides of the screen. Highly recommended setting a two step slide-in CTA, where in the first step you make the user a direct ask to subscribe to your newsletter. The second step will only appear after a user has subscribed. Itâs an opportunity to ask for their support and to offer more information.
đĄ Tips for Slide 1
Heading: Make a direct ask. This will be the first thing a user reads, so be upfront about what youâre asking them to do. Make it clear and concise.
Example: âSubscribe to XYZ Publicationâ or âSign up for the XYZ Publication newsletter."
Description: Tell them why and expand on the offering. Explain further what theyâre signing up for. This can include how often and what day you send it, the content thatâs included, etc. Make sure you tell them why they should subscribe.
Example: âGet important news from our community in your inbox twice a weekâ or âWeâll deliver local news direct to your inbox every Wednesday.â
Button: Make sure the button stands out by choosing colors that pop and a font that is big and bold.
đĄ Tips for Slide 2
Heading: Even though itâs unlikely that a user will contribute directly after subscribing, seize the opportunity to educate them on how youâre supported. Warm them up to the idea while you have their attention or emphasize your value proposition.
Example: âWeâre funded by youâ or âWe rely on our membersâ or â100% local.â
Description: Let them know that youâre grateful for their subscription and that they can expect your newsletter in their inbox soon. Explain how their support makes a difference. A lot of readers are still getting used to the idea of voluntarily supporting local news. Explain that every reader who chooses to give matters greatly.
Example: âThank you for subscribing! Weâre powered by readers like you who invest in local news. Consider supporting us today.â or âThanks so much! Check it out in your inbox and consider supporting us (or start supporting us today because we know youâll love it)."
Button: Offer them more information. We donât want their journey to stop here, even if theyâre not ready to contribute. Give them the option to learn more about who you are, check out the team, or read through your guiding principles. But ultimately ask them to support you. Since support is the ultimate goal, give them the option to contribute. Even if theyâre not ready yet, it prepares them to expect another ask down the road.
Best practices: It's important to give the reader time to understand your website and navigate around, specially if this CTA is being used for Donate Campaigns. On Configure, go to Launch > After Scroll/ Display Within Range and turn it on. Slide the Display at - Display when a user scrolls the page to 40%:
This way the CTA will only appear after the reader has scrolled down your page, making the experience less busy. By default, the cookie CTA on the bottom will overlap any other CTA, including the Slide-in. To change the order and make the Slide-in appear on the top, ask the developers to add the following code on your website:
.cp-module-slide_in .cp-popup { z-index: 9999999; }
Popup
What is: A Light-box overlay that can be launched on any web page with a dedicated call to action. A full-screen popup can be very effective, but itâs most often used during concentrated campaigns.
đĄ Tip Make it timely. Add a countdown timer or use time-sensitive language to put on the pressure.
Best practices: This type of popup is really invasive and disrupts the user journey in a very abrupt way. If triggered after the page loads or on multiple pages, it may causes the reader to leave your website. For that, we recommend to:
Go to Configure > Launch
Click on After a Few Seconds on the Page and turn it off
You can either Click on After Number of Page Visits, turn it on and choose a number of pages visits necessary to trigger the popup, or trigger the popup After Scroll
For this specific CTA, make sure that the popup won't be triggered again after the reader closes it by clicking on Cookies, on the left navigation bar
Before/After
What is: A banner or an opt-in form that can be embedded before or after your blog post on a page. Placing a âsupport usâ CTA at the bottom of each article. Itâs a good opportunity to appeal to readers who are engaging with the work that youâre doing.
đĄ Tips
Heading: Be direct. Donât avoid the subject - make it clear that youâre asking for their support. They just spent a couple of minutes reading your article, theyâre primed for the appeal.
Example: âThis article is made possible by our readersâ or âEnjoy the article? We need you to support this workâ
Description: Emphasize the why! Thereâs a lot of room to play around here. The reader has already made it to the bottom of the article, so theyâll likely take an extra minute or two to read your appeal.
Button: Make it pop. Ensure that the user canât miss the button, even if they donât read through the text.
Best practices: Remember to set the Display Rules on All posts on Configure > Target.
Managing CTAs
You can remove a CTA from your website by simply turning it off. Go to House Ads > Dashboard to see all the CTAs of your website.
You can edit the copy of the desired CTA by clicking on the CTA name:
Double click the text to edit the copy. Click in "Save" and "Make public".
đĄ Please remember to set the mobile view! On the top navigation, after "Connect" there's a mobile icon. Please click on it to style your House Ad
Enable House Ads on specific pages, categories or post
You can enable the CTA on specific pages, categories or post:
Go to House Ads > Dashboard and open the desired CTA by clicking on the Name;
On the top left corner, click in "Configure";
On the sidebar, click in "Target";
Click on "Pages" and on "Display Rules";
Make sure to set All Posts on Display rules for in-line and before/after posts CTAs
Select "Target Specifics" to display the CTA on a specific:
Page: Type the title of the page
Post: Type the title of the post
Category: Type the category name
Disable CTA on specific pages, categories or post
You can also disable the CTA on specific pages, categories or post:
Go to House Ads > Dashboard and open the desired CTA by clicking on the Name;
On the top left corner, click in "Configure";
On the sidebar, click in "Target";
Click on "Pages" and on "Display Rules";
Select "Target Specifics" and add the name of the page or title of the post:
You often don't want slide-ins CTAs on the following pages:
Privacy Policy
Support Us
Newsletter
Terms of Use and Payment Policy
Thank you
Contact us
Click in "Save" and "Make public"
Design tips
When editing your CTAs, make sure that it has enough:
Contrast: Itâs important that buttons and texts stand out from the background. Images on the background are tricky, so you need to be extra careful;
Legibility: fonts needs to be big enough, specially on mobile. Itâs hard to fix a number here, but it works best with fonts that are bigger than 16px;
Hierarchy: the button needs to stand out more than âRead moreâ, and other elements
Triggering Pelcro Modal
To trigger a Pelcro Modal using House Ads buttons, select the button on the House Ads editor and click on Advanced. On Custom Class, add:
pelcro-subscribe-button