{"id":13067,"date":"2024-08-05T05:09:24","date_gmt":"2024-08-05T05:09:24","guid":{"rendered":"https:\/\/www.picreel.com\/blog\/?p=13067"},"modified":"2025-02-13T07:18:39","modified_gmt":"2025-02-13T07:18:39","slug":"concrete-cms-popup","status":"publish","type":"post","link":"https:\/\/www.picreel.com\/blog\/concrete-cms-popup\/","title":{"rendered":"How to Create a Popup in Concrete CMS?"},"content":{"rendered":"<p>My entire website is built on Concrete CMS, and recently, I&#8217;ve heard that popups can significantly grow your email list and improve CTRs.<\/p>\n<p>So, does Concrete CMS offer popups? Absolutely!<\/p>\n<p>There are two ways to create a popup in Concrete CMS: using the built-in maker or a popup tool like\u00a0<a href=\"https:\/\/www.picreel.com\/\">Picreel<\/a>.<\/p>\n<p>We&#8217;ll also discuss the differences between Concrete CMS\u2019 popup builder and Picreel as a standardized popup tool. In fact, here\u2019s how my Picreel popup looks within Concrete CMS:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-12877 size-full\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/07\/PP_PIC_-SPP-endPulse.png\" alt=\"Concrete CMS popup\" width=\"1076\" height=\"657\" \/><\/p>\n<p>Before we get into that, here\u2019s the difference between using Concrete CMS\u2019s own popup vs a standardized popup tool.<\/p>\n<div id=\"tablepress-231-scroll-wrapper\" class=\"tablepress-scroll-wrapper\">\n\n<table id=\"tablepress-231\" class=\"tablepress tablepress-id-231 tablepress-responsive\">\n<thead>\n<tr class=\"row-1 odd\">\n\t<th class=\"column-1\">Criteria<\/th><th class=\"column-2\">Concrete CMS Popup<\/th><th class=\"column-3\">Picreel Popup<\/th>\n<\/tr>\n<\/thead>\n<tbody class=\"row-hover\">\n<tr class=\"row-2 even\">\n\t<td class=\"column-1\">Multi-platform support<\/td><td class=\"column-2\">\u274c Only supports popups on websites built with Concrete CMS.<\/td><td class=\"column-3\">\u2705 Supports popups across multiple website platforms, including WordPress, Shopify, Magento, and more.<\/td>\n<\/tr>\n<tr class=\"row-3 odd\">\n\t<td class=\"column-1\">More features<\/td><td class=\"column-2\">\u274c Basic popup creation with limited functionality.<\/td><td class=\"column-3\">\u2705 Offers a comprehensive set of features, including A\/B testing, analytics, exit-intent popups, and more.<\/td>\n<\/tr>\n<tr class=\"row-4 even\">\n\t<td class=\"column-1\">Better customization options<\/td><td class=\"column-2\">\u274c Limited to basic design and functionality customizations.<\/td><td class=\"column-3\">\u2705 Extensive customization options, including templates, design elements, triggers, and behavioral targeting.<\/td>\n<\/tr>\n<tr class=\"row-5 odd\">\n\t<td class=\"column-1\">Integrates with various website platforms<\/td><td class=\"column-2\">\u274c Designed specifically for Concrete CMS and does not integrate with other platforms.<\/td><td class=\"column-3\">\u2705 Integrates seamlessly with various website platforms and third-party tools for email marketing, CRM, and more.<\/td>\n<\/tr>\n<tr class=\"row-6 even\">\n\t<td class=\"column-1\">Advanced targeting options<\/td><td class=\"column-2\">\u2705 Basic targeting options based on simple conditions like page views.<\/td><td class=\"column-3\">\u2705 Advanced targeting options, including user behavior, time on site, referral source, and geolocation.<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n\n<\/div>\n<p>In my experience, I recommend using Picreel for the following reasons:<\/p>\n<ul>\n<li><strong>Multi-platform support:<\/strong>\u00a0Picreel works across multiple platforms, ensuring your popups remain functional even if you switch platforms.<\/li>\n<li><strong>Better customization options:<\/strong>\u00a0Picreel offers extensive customization options, allowing you to create visually appealing and highly effective popups.<\/li>\n<li><strong>Advanced targeting options:<\/strong>\u00a0With Picreel, you can use\u00a0<a href=\"https:\/\/www.picreel.com\/features\/popup-targeting\/\">advanced targeting<\/a>\u00a0options to reach your audience more effectively.<\/li>\n<\/ul>\n<p>Nevertheless, in this tutorial, I will show you step-by-step how to create a popup using both methods.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Method_1_Using_Concrete_CMS%E2%80%99s_Built-in_Popup\"><\/span>Method 1: Using Concrete CMS\u2019s Built-in Popup<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Concrete CMS offers a built-in popup maker. Here\u2019s how to use it:<\/p>\n<p><strong>1.<\/strong> Access your Concrete CMS dashboard by logging in with your admin credentials.<\/p>\n<p><strong>2.<\/strong> From the top menu, go to the &#8220;<strong>Dashboard<\/strong>&#8221; to access various site management options.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13072\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-Dashboardn.png\" alt=\"CMP Dashboard\" width=\"1036\" height=\"552\" \/><\/p>\n<p><strong>3.<\/strong> Go to &#8220;<strong>Blocks<\/strong>&#8221; and click on &#8220;<strong>Add Block Type<\/strong>.&#8221; Select &#8220;<strong>HTML<\/strong>&#8221; or &#8220;Content&#8221; to create a block that will serve as your popup content.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13073\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-DHTML.png\" alt=\"Add Block Type\" width=\"829\" height=\"795\" \/><\/p>\n<p><strong>4.<\/strong> Use the block editor to create the content for your popup. This can include text, images, forms, or any other content you want to display.<\/p>\n<p><strong>5.<\/strong> Add the block you created to the page by dragging and dropping it into the desired area.<\/p>\n<p><strong>6.<\/strong> Set up display conditions for the popup. You can choose to display it based on user actions, page load, or specific triggers like button clicks.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-13070 size-full\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-triggers-like-button.png\" alt=\"Set up display conditions\" width=\"881\" height=\"609\" \/><\/p>\n<p><strong>7.<\/strong> Go to the &#8220;<strong>Design<\/strong>&#8221; or &#8220;<strong>Header\/Foote<\/strong>r&#8221; settings of your theme to add custom scripts.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-13069 size-full\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-HeaderFoote.png\" alt=\"settings of your theme to add custom scripts\" width=\"881\" height=\"1259\" \/><\/p>\n<p><strong>8.<\/strong> Click &#8220;<strong>Publish Changes<\/strong>&#8221; to make your changes live.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Method_2_Creating_a_Popup_Using_Picreel\"><\/span>Method 2: Creating a Popup Using Picreel<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Picreel is a powerful popup maker that works across multiple platforms, providing you with a versatile solution for creating popups. Here&#8217;s how you can create a popup using Picreel:<\/p>\n<p><strong>1.<\/strong> Sign up for a free Picreel account and log in.<\/p>\n<p><strong>2.<\/strong> Go to the \u201c<strong>Campaigns<\/strong>\u201d menu and click &#8220;<strong>New Campaign<\/strong>&#8221; from the top right. You can select the templates option from the drop-down or start from scratch.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12107\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/04\/PP_PIC_2Campaigns.png\" alt=\"New campaign\" width=\"1313\" height=\"561\" \/><\/p>\n<p><strong>3.<\/strong> From the templates menu, choose the type of popup you want to create.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12897\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/07\/PP_PIC_CM-templates-menu-1.png\" alt=\"templates menu\" width=\"1873\" height=\"441\" \/><\/p>\n<p><strong>4.<\/strong> Once you select the design, customize it according to your preferences.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12878\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/07\/PP_PIC_SPP-customize-it.png\" alt=\"select the design and customize it\" width=\"1313\" height=\"607\" \/><\/p>\n<p><strong>5.<\/strong> Configure your targeting and trigger options to specify when and where you want your popup to appear.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12106\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/04\/PP_PIC_2-personalize-targeting.png\" alt=\"configure\" width=\"1308\" height=\"581\" \/><\/p>\n<p><strong>6.<\/strong> Click &#8220;<strong>Save<\/strong>&#8221; to activate your popup.<\/p>\n<p><iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/J1tBmOnBJEA?si=CFeDNolCm7pZUGbd\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h3>Embedding Picreel HTML Code Inside Concrete CMS<\/h3>\n<p>To embed a Picreel popup on your Concrete CMS website, follow these steps:<\/p>\n<p><strong>1.<\/strong> Navigate to campaigns and click &#8220;<strong>View Code.<\/strong>&#8221;<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-12109\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/04\/PP_PIC_5-saving-se.png\" alt=\"save code\" width=\"1629\" height=\"806\" \/><\/p>\n<p><strong>2.<\/strong> Click on the code to copy it.<\/p>\n<p><strong>3.<\/strong> Go to the page where you want to embed the custom HTML code.<\/p>\n<p><strong>4.<\/strong> Click the &#8220;<strong>Edit<\/strong>&#8221; button in the toolbar at the top of the page. Click on the &#8220;<strong>+<\/strong>&#8221; icon to add a new block.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-13068 size-full\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-Edit.png\" alt=\"add a new block\" width=\"1597\" height=\"657\" \/><\/p>\n<p><strong>5.<\/strong> In the &#8220;<strong>Add Block<\/strong>&#8221; dialog, scroll down or use the search function to find the &#8220;<strong>HTML<\/strong>&#8221; block.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-13073 size-full\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/08\/Competitor_PIC_CMP-DHTML.png\" alt=\"Add Block \" width=\"829\" height=\"795\" \/><\/p>\n<p><strong>6.<\/strong> In the HTML block editor, you can paste your custom HTML, JavaScript, and CSS code.<\/p>\n<p><strong>7.<\/strong> Click &#8220;<strong>Publish<\/strong>\u00a0<strong>Changes<\/strong>&#8221; to make your changes live.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Which_Is_a_Better_Method_Method_1_or_2\"><\/span>Which Is a Better Method: Method 1 or 2?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Keeping a long-term view, Picreel is probably better because your popup tool remains intact despite your changing platforms.<\/p>\n<p>You get more sophisticated popup options and more triggers. Picreel comes with a\u00a0<a href=\"https:\/\/www.picreel.com\/pricing\/\">forever-free plan<\/a>\u00a0for startups and small businesses and allows you to create unlimited popups with all premium features. I feel the free version does the job; however, you can always look for paid options that start as low as\u00a0<strong>$9.99\/month.<\/strong><\/p>\n<p>On the other hand, if you prefer to use the limited options available with Concrete CMS\u2019s built-in popup without incurring any additional integrations, it can still serve your needs just fine.<\/p>\n<p>Remember, the goal is to create compelling popups that drive user engagement and conversions, regardless of your chosen method. Ultimately, the choice is yours.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>My entire website is built on Concrete CMS, and recently, I&#8217;ve heard that popups can significantly grow your email list and improve CTRs. So, does Concrete CMS offer popups? Absolutely! There are two ways to create a popup in Concrete CMS: using the built-in maker or a popup tool like\u00a0Picreel. We&#8217;ll also discuss the differences&#8230;<\/p>\n","protected":false},"author":26,"featured_media":13071,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71],"tags":[],"class_list":["post-13067","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-popup"],"_links":{"self":[{"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts\/13067","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/users\/26"}],"replies":[{"embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/comments?post=13067"}],"version-history":[{"count":3,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts\/13067\/revisions"}],"predecessor-version":[{"id":14104,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts\/13067\/revisions\/14104"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/media\/13071"}],"wp:attachment":[{"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/media?parent=13067"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/categories?post=13067"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/tags?post=13067"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}