- Inspiring examples on how e-commerce sites use pop ups
- Review of the best pop up ideas from SaaS
- Pop up Windows on Blogs
The world of pop ups is lovely, interesting, and is limited only by your fantasy. Pop-ups help you start a conversation with visitors, capture leads, activate, retain, and so much more.
Dashly clients can make professionally designed pop ups easy as 1-2-3 without designers’ and developers’ help with our new Pop-up Builder.
To charge you with the inspiration, we walked through the web and found some excellent pop ups – see, look and create even better ones with Dashly Pop-up Builder.
Inspiring examples on how e-commerce sites use pop ups
Highlight special offers for the first-time site visitors
Conversion is far the end of what can offered in time discount do for you. This engagement tool can increase customers’ trust, loyalty, customer satisfaction rate.
Example #1 Navigation pop up window from a clothes store
But only if you would use it right. Like ASOS — a British online fashion and cosmetic retailer does by using pop up to entice customers to visit sale landings. By routing them directly to a special offer for the women or men section, they eliminate the navigation clicks in the menu. That saves the customer time and improves the on-site customer experience.
The banner’s non-intrusive style helps to stand out among other bright site elements and makes it safe from a well-known “banner blindness” effect.
Example #2 The short trail pop up from a dog mats store
It doesn’t mean that traditional square pop up windows don’t work. Soggy Doggy Doormat online store proves that. There is a navigation pop up window welcomes website visitors leading them to a special offers landing:
With the help of two accents: headline and CTA button, they engage people to a simple action ─ visit a sale landing page. Since this store has only one type of product, they don’t need to explain the offer. A clear CTA with no metaphors and a little FOMO effect between the lines is perfect for highlighting a good deal.
I call this type of pop ups a short path to a treasure. By clicking “Show me the offers” visitors don’t have to look for discount items in a whole list.
Pro Tip: Don’t use two pop up close options. Avoid ⊗ element if there is a “no, thanks” text alternative already in your pop up window.
Example #3 A road signpost from LEGO
What if your site serves two or more equally essential goals, each of which you want to highlight? Try to follow LEGO, a toys’ manufacturer example. There are e-store and a play zone you are offered to visit in a navigation message that pop ups when you visit a website for the first time:
No sales, only useful info. CTAs are different, but they serve the same goal ─ show the direction.
Pro Tip: If there are two parts in your pop up window, sync their CTA goals ─ to navigate, sell, or inform. For example, “to guide to the store and blog” is a possible option because it is about navigation. But it can’t be “save 20% on jeans and visit our blog” because they are about different intents: sales and navigation. Here you should prioritize and use a classic pop up with one goal and relevant CTA: “save 20% on jeans” or “visit our blog”.
Another way how e-stores welcome visitors is a lead capturing pop up windows. So, let’s go deeper into the best pop up examples.
Value to offer when collect email addresses
This pop up applies at any stage of the customer journey (except for those already in your list). If the goal is clear, the content varies. Popular e-stores, what do they offer in exchange for a visitor’s email address?
That’s easy, a discount. But why does one pop up work and others don’t? Let’s figure out!
Spoiler alert: It’s not about a discount size only.
Example #4 Discount + Visualization of a desired from a candle e-store
But it is a good start. Just look at how Candle Delirium, a luxury candle e-store, welcomes its new visitors:
A personalized offer with a compelling image encourages you to become a VIP member of a cozy evening email club.
Pro Tip: ½ of a pop up window takes a stylized photo of a product. That drives visitors’ attention to the result: here is what you came for ─ and you’ll have this beauty on your shelf even cheaper than you expect!
Example #5 Discount + FOMO tip from bags, jewelry and dresses store
If you don’t want to focus on a specific group of items, there are no-image subscription pop ups. Usually, they include a text and email capturing field with a contrast CTA button on solid color background. Just like on the Kate Spade’s ─ bags, jewelry, and dresses store website.
After a minute on the main page, visitors see this:
The first purchase discount is highlighted in the header and lead capture form — a basic tactic. The most exciting part is a bit lower. I mean, play on the FOMO effect in the anchor of the pop up closing link.
Pro Tip: It is about “my perspective”. With no hesitation, we click “no thanks” when it is somebody offering us something. But it’s a whole different story when it is you who refuse a valuable opportunity. To avoid future regret, you’ll think twice even if you don’t need a product now. That is what a simple “I don’t want ____” or “I’d rather pay a full price” phrase does. Use it.
Example #6 Discount + Segmentation from a clothes store
Revolve fashion retailer email pop up message may seem to have the same discount header, CTA, the pop up close link. We saw those three abstracts before. But look under the email field. A valuable detail when a visitor can choose what information to subscribe to:
Here is another design of email pop up with a subscription segmentation by interests from a Frank And Oak clothes store:
Just choose the one you like more. Email subscription segmentation is a good start for a two-way conversation with a potential customer. The more relevant your offer, the better customer experience you provide, the higher chances a subscriber will buy it and then others.
And speaking of chances. One more thing to offer in exchange for emails.
Example # 7 Giveaway from Ruroc, a sport helmets’ manufacturer
The opportunity to win a pricy product is way more intriguing than a simple discount. Thus, every visitor sees this email pop up:
This is a justified use of detailed description in pop up window. Look how gently they engage email subscribers to follow them on socials. Mind a tribute to GDPR ー a checkbox for subscription agreement.
Example #8 Knowledge in exchange for an email
Information is the gold of the 21st century. Thus, Best Buy online store offers visitors to be the first to know about deals and company news in two formats by email or text message:
Pro Tip: When providing two subscription options, don’t duplicate the description. If you’ll send the same info by both channels, write about it in a pop up window description part once. Use two descriptions if you plan to send different content.
Example #9 Intrigue from an apparel store
Yes, it is about information again but on a bit more sophisticated cover. Just look how an interesting photo together with a countdown timer don’t leave a chance to ignore this message:
If there is a sale on your website, try to impress visitors with no welcome pop up. Instead of this, use an exit-intent one like a fruits e-store does:
By clicking “Set a reminder”, a visitor loads the relevant landing with a calendar and a field to leave contacts. Agree, this is a nonstandard pop up idea.
Expose the privileges of registered visitors
When visiting e-commerce sites, in the right upper corner, you may see a sign-up option. To provide the best customer experience, e-stores collect relevant data by offering visitors to sign-up in a pop up window.
Example #10 You can’t access the GILT fashion store without leaving your email in this pop up because there is no opportunity to close it:
Other brands aren’t so demanding for the visitors. Thus, Zappos shoe store sign-up pop up is more unobtrusive:
A small window in the right corner of the screen doesn’t overshadow the content.
Pro Tip: The main advantage of this pop up idea is a list of VIP members’ benefits. It isn’t a claim like in the previous case, but an offer. Visitors understand what they’ll get by clicking “SIGN IN”.
And, of course, a classic move with a discount from Proviz ― Cycling, Running and Outdoor Sportswear e-store:
By clicking on this pop up and signing-up visitor automatically subscribes to the Proviz email newsletter also.
Get customers to add more to their carts
“You may also like”, “Customers who bought this also shopped”, “Frequently bought with ___” aka product recommendations.
Example #11 The best place to show them during checkout or on the added to cart confirmation pop up like Wayfair furniture store does:
Pay attention that there is a carousel with three recommended items visible on the screen simultaneously. Why? To demonstrate the offered product in detail with the optimal space for an image and description.
Pro Tip: If your product doesn’t have many details to show, place up to 5 items in a visible part of a carousel.
Example #12 Sephora cosmetics store increases this tactic effect with a free shipping opportunity
Just look how this “You’re only $$ away from free shipping” engages you to add something more to a shopping cart:
Show useful information in-time
We won’t talk about “Cookies agreement” or “Select your country for shipping” pop up windows. You know these pop up ideas for sure.
Example #13 It’s way more interesting to follow the idea from Zappos shoes store of out of stock pop up:
Of course, you can just cross the missing items in the list so that visitors won’t click it. But in such a way, you lose the opportunity to communicate with potential customers. What if they are ready to consider an alternative pair of sneakers? To save their time, offer similar in-stock options in a pop up window.
Example #14 Generate some heat for the website visitors via customers activity pop up notifications like Cosmetic Capital does
If the visitor stays on the product card or sale landing (hesitates about a purchase) for more than two minutes, it is good to notify somebody that somebody has purchased it right now.
Pro Tip: It looks suspicious when such messages pop up in precisely one minute. The pop up timing should be different. For example, 1st pop up after two minutes visitor is on a website, 2nd ─ after three minutes, 3rd after 30 sec, and so on.
Review of the best pop up ideas from SaaS
To engage visitors to register in the service, try a demo, subscribe to the newsletter – there are so many examples of how services use pop ups. Let’s analyze the best of them.
Qualify leads with multiple steps email capture pop up window
Example # 15 If you need to go deeper into lead qualification and get more information about every visitor (to offer the best deal for them) – launch the whole series of pop ups. Just like KlientBoost – a performance marketing agency did.
The result of the pop up series is collected emails and a portrait of the visitor for further communication.
Example #16 Don’t like so many windows? Try a list of options pop up format.
This is how Circles.life ─ a digital telco service asks its visitors: what they didn’t like when leaving the website.
In such a feedback pop up, you can also ask what they are looking for, what professional sphere (or type of company) they belong to, etc.
Increase conversion rate
Uuu… Here is such a big field for experiments. This type of pop ups is aimed to increase everything that can be increased – sign-up conversion rate, conversion to payment and even brand awareness, WOM marketing effectiveness, and so on.
Example # 17 This is a full-screen pop up that encourages you to sign up and shows the advantages you’ll get as an early adopter of Chanty – all-in-one team collaboration service:
Chanty full-screen size pop up
Since a product that offers services can’t be visualized in an aesthetically attractive manner. Thus, Chanty uses the Morpheus character for a “choice” idea visualization. The first element that got visitors’ eye is a large header. But the main idea is a bit lower – bold text with special status and a % of a possibly saved time.
Example #18 Remind your visitors that there’s a chance to try your product for free. That is what myRealPage website building platform makes when a visitor is trying to leave:
Exit intent pop up catches them with an offer too good to pass up ─ a free trial period. You’d say everybody does, nothing new. But visiting their pricing page, you won’t find a free plan.
Example #19 Smaller, smaller, even smaller. Datanyze ─ a tool that captures comprehensive information on your leads, doesn’t hide freemium. They use a small side pop up to emphasize this opportunity for visitors:
This pop up offers to add a Chrome extension and use a tool for free. Pay attention to how they prove the extension reliability with rating stars from Chrome store.
Example #20 If you have an update coming soon – whet everybody’s appetite with a pop up. Intrigue visitors with an opportunity to be the VIP users of your soon update. Just like ContentStudio, a content discovery tool did in this pop up:
ContentStudio captures leads for new feature release
Example #21 Another good idea is to illustrate the product’s value in a pop up is to show it through a real situation starring a visitor. Just look how OptiMonster – a digital platform that offers pop up, implemented this tactic:
One of the jobs their product does is reducing the number of abandoned carts. And this pop up is an excellent demonstration of the value they offer.
Example #22 Steer clear of standard pop ups. Interact your visitors – they’ll love to play! Come up with a quiz, lottery, wheel, or something that no one did before. Conversions will pleasantly surprise. Remember Circles.life feedback pop up? This time they offered visitors to play:
Pro Tip: If you want your visitors to have only one chance to win – just show the pop up only once (you can do this in the pop up settings).
Example #23 Good offers are always a great idea – people love to save. Just remember that visitors have to understand what your product is about and why they need to pay for it otherwise, even a good discount won’t help.
TrymyUI’s – Usability Testing Service shows unique offer pop up and highlights the most valuable info: offer, price and CTA button.
Reactivate users with a special offer
Pop ups can not only collect personal data and make visitors sign up. They also have a strategic mission – activate, involve, and return visitors back on track.
Example #24 Traditionally, starting with a “huge” pop up example – HoldOnStranger (a marketing solution for e-commerce sites) is ready to become better for you. You didn’t find a needed feature – just drop them a message in a pop up.
HoldOnStranger retention pop up asks visitors what does a product misses fitting their requirements. It can be an excellent start to a long-lasting friendship where a user feels that a brand improves the product specially for him/her.
Example #25 You can stop visitors from reading by showing them essential video content – watching videos may be more interesting than reading:
Privy pop up with a case study video in it — rare and valuable content.
Start long-lasting relationships with email newsletter subscription
Example #26 When you visit a site of a Canadian author and blogger, Danielle LaPorte you’ll be welcomed by a pop up window with her photo with an offer to subscribe for a newsletter:
Since it’s a personal brand site, the idea of placing a photo on the pop up window is pretty good. It emphasizes the fact that you subscribe to a real professional’s emails, but not a company.
Pro Tip: People trust other people, not companies. Thus, visitors are more likely to share their email in a pop up window if there is a face of the company on it ─ the person they can thank or complain later.
Example #27 If you don’t have a face of the company yet, there is another way to get visitors’ loyalty and trust. Ask their preferences right in the email subscription pop up window, like Greatdays Group Travel:
It is simple. The more relevant content, the higher conversion it has.
Example #28 Sign-up pop up frequently appears while reading some blog articles or eBooks on a website. One of the most remarkable ways to involve visitors is to let them read an interesting article only in the middle and then offer to sign up to continue reading.
Example #29 Omniconvert ─ a conversion rate optimization software announced its event with a bright pop up in the bottom of the page:
Look how they highlighted experts ─ the key reason to visit this conference.
Collect visitors contacts to make personal communication further
Usually, such email capturing pop ups appear after a visitor spent some time on the website, scrolled the page to the bottom, or when a visitor is trying to leave a website.
The main point here is that people are more likely to give their data for some valuable content. That’s why pop ups like that are popular.
Example #30 To leave visitors no chance to ignore an email guide Lilach Bullock a business coach, uses a full-screen pop up window:
Example #31 If you don’t want your pop up to fill the whole screen space, you can go for a standard size pop up, like these from Privy ─ the email marketing platform for Shopify & Wix stores:
In Dashly, we call it a big pop up. This leave intent pop up has an additional website URL field. Thus, the service collects additional info about potential clients.
Example #32 The next one is a small pop up from ProfitWell subscription software service:
This two-step type of lead capture pop up window asks for email only when a visitor clicks it.
Example #33 If you want to add more interactivity, make your pop up move, jump or blink like Lemonstand’s one:
But be careful, this may distract your visitors. Anyway, you’ll never miss such an active email capturing pop up on website-building tools and hosting platform’s site.
If you don’t have any guides or docs that may be sent or downloaded, you probably have a blog or an email campaign with all product updates. Interesting things there, right? Offer to subscribe to your newsletter and keep up. You can show this kind of pop ups only on your blog, not on the main website – just select the needed settings in Dashly.
Pop up Windows on Blogs
Example #34 Pop up doesn’t need to have a button or an input field to be a good one. Thus, Spotify small side pop up redirects to another article:
An interesting tactic to improve visitors’ behavior on a blog.
But if you are a fan of classic, in Dashly, you can make a pop up with a field for an email or phone number, with a button, with a text field, or just a pop up with no additional fields.
Example #35 There is a tradition to offer blog visitors to subscribe for a brand newsletter on a main blog page:
A simple two parts Toptal (a freelancing platform) blog subscription pop up with a header, email field, and CTA button.
Example #36 In addition to these elements, GetResponse, an online platform for email marketing software, asks for a visitor’s name.
GetResponse big email subscription pop up on blog
You can take more out of the pop up and add some additional fields (ex. name, company name, phone number, etc.) Or even add a little qualification to see what your leads are interested in, segment them and increase conversions.
Example #37 Just like LiveChat.Inc customer service platform did on its blog:
LiveChatInc pop up with qualification
By following this email subscription example, you can offer visitors to subscribe to company news & product updates, sales, events, etc. yes, the number of the newsletters will reduce, what can’t be said about its quality.
Example #38 If you don’t want to interrupt the reading process, place an email subscription pop up near the text. Appcues the Product-Led Growth Platform also likes this idea, so it offers readers to get weekly newsletters in the left corner, but not over the text:
Now you see that you can do whatever your fantasy can come up with. Especially since the moment, we provided you with an instrument — Dashly Pop-up Builder.
Drag, drop, play, rock
|This article was first published on January 16, 2019. December 1, we’ve updated it.|