{"id":13539,"date":"2024-11-05T08:44:35","date_gmt":"2024-11-05T08:44:35","guid":{"rendered":"https:\/\/www.picreel.com\/blog\/?p=13539"},"modified":"2025-01-28T07:25:52","modified_gmt":"2025-01-28T07:25:52","slug":"cs-cart-popup","status":"publish","type":"post","link":"https:\/\/www.picreel.com\/blog\/cs-cart-popup\/","title":{"rendered":"How to Create a Popup in CS-Cart? A Quick Tutorial"},"content":{"rendered":"<p>Ever visited a website and had a popup appear at just the right time, nudging you to take action? Ever wonder how they do it? If you\u2019re using CS-Cart and haven\u2019t yet added popups to your marketing toolbox, you might be missing out on a simple but powerful feature.<\/p>\n<p>Surprisingly, CS-Cart doesn\u2019t come with a built-in popup creator! So, does that mean you&#8217;re out of luck? Not at all. With just a few clicks and the right tools, you can easily create eye-catching, conversion-boosting popups that engage your visitors. The best workaround is using a popup extension.<\/p>\n<p>Here&#8217;s a sneak peek at a popup I crafted for CS-Cart using\u00a0<a href=\"https:\/\/www.picreel.com\/\">Picreel<\/a>. Check it out!<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13531\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/11\/PP_PIC_SBS-ExpressionEngine-1.png\" alt=\"Popup\" width=\"1076\" height=\"657\" \/><\/p>\n<div class=\"banner-btn newuishow\" style=\"text-align: center;\"><a class=\"round_btn try-btn\" href=\"https:\/\/www.picreel.com\/templates\/black-friday-sales-popup\">Use This Popup<\/a><\/div>\n<p>Doesn&#8217;t it look amazing?<\/p>\n<p>While you can craft CS-Cart popups using any third-party extension, Picreel is my go-to tool. So, let&#8217;s get started and see how you can weave your magic with this awesome tool!<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Create_Popups_in_CS-Cart_Using_Picreel_Popup_Builder\"><\/span>Create Popups in CS-Cart Using Picreel Popup Builder<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Picreel caught my eye due to its powerful features and seamless integration across various platforms. You can add a popup to CS-Cart live in a flash without getting tangled in complicated code.<\/p>\n<p>It offers\u00a0exit-intent technology, mobile-optimized popups, extensive customization options, <a href=\"https:\/\/www.picreel.com\/features\/popup-ab-testing\/\">A\/B testing<\/a>\u00a0capabilities, and various targeting choices, making it a fantastic tool to kickstart your popup strategy.<\/p>\n<p>Now, let&#8217;s jump into the steps to create your popups!<\/p>\n<p><strong>Step 1: Sign Up for Picreel<\/strong><\/p>\n<p>First things first, you&#8217;ll need to\u00a0create a Picreel account. Head over to their website and sign up. They offer a\u00a0free trial, so you can test it out before committing.<\/p>\n<p><strong>Step 2: Create a New Popup<\/strong><\/p>\n<p>Once you\u2019re in the Picreel dashboard, the next step is to create your first popup. Here\u2019s how &#8211;<\/p>\n<ul>\n<li>Go to the\u00a0<strong>\u201cCampaigns\u201d<\/strong>\u00a0menu.<\/li>\n<li>Click the\u00a0<strong>&#8220;+ New Campaign&#8221;<\/strong>\u00a0button.<\/li>\n<li>You\u2019ll be asked to\u00a0<a href=\"https:\/\/www.picreel.com\/templates\/\">select a template<\/a>\u00a0for your popup. You can also start from scratch.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13532\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/11\/PP_PIC_SBS-ExpressionEngine-2.png\" alt=\"Templates\" width=\"1592\" height=\"807\" \/><\/p>\n<p>Once you&#8217;ve picked your template, you&#8217;ll land on the customization screen. Here, you can unleash your creativity and personalize the text, colors, images, and the entire look and feel of your popup.<\/p>\n<p><strong>Step 3: Customize Your Popup<\/strong><\/p>\n<p>Picreel&#8217;s intuitive drag-and-drop editor lets you effortlessly tailor your popup. You can adjust colors, fonts, images, and more to align with your brand\u2019s aesthetic perfectly.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13541\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/11\/PP_PIC_2Black-Friday-1.png\" alt=\"Customize your popup\" width=\"1313\" height=\"611\" \/><\/p>\n<p>Don\u2019t worry if you\u2019re not a design expert\u2014Picreel gives you plenty of creative freedom. Here&#8217;s how you can tweak your popups to make them just right:<\/p>\n<ul>\n<li><strong>Edit Text:<\/strong>\u00a0Simply click on any text element to update the message. Aim for something straightforward and to the point.<\/li>\n<li><strong>Add Images:<\/strong>\u00a0Upload your own images or pick from Picreel&#8217;s gallery of stock photos. Make sure your visuals align with your brand&#8217;s style.<\/li>\n<li><strong>Change Colors &amp; Fonts:<\/strong>\u00a0Stay consistent with your brand by using your signature colors. You can alter the background, text, and button shades to ensure your popup pops without disrupting your website&#8217;s flow.<\/li>\n<li><strong>Button Links:<\/strong>\u00a0Double-check that your call-to-action (CTA) button directs users to the right place, whether it\u2019s a registration page, product page, or elsewhere.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-10784\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/01\/PP_PIC_CHRISTMAS-DAY-min-1.jpg\" alt=\"POPUP\" width=\"1467\" height=\"926\" \/><\/p>\n<p><strong>Step 4: Set Up Targeting Options<\/strong><\/p>\n<p>Using Picreel, you can be very specific about who sees your popup, when do they see it, and how often.<\/p>\n<p>You can choose from a range of targeting options, including &#8211;<\/p>\n<ul>\n<li><strong>Exit Intent:<\/strong>\u00a0Show the popup when a visitor is about to leave your site.<\/li>\n<li><strong>Time on Page:<\/strong>\u00a0Trigger the popup after a visitor has spent a certain amount of time on your page.<\/li>\n<li><strong>Scroll Depth:<\/strong>\u00a0Display the popup when a visitor scrolls down a certain percentage of the website.<\/li>\n<li><strong>Page Targeting:<\/strong>\u00a0Show the popup on specific pages or URLs.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13409\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/09\/PP_PIC_HCPC-GoCampaignsss-1.png\" alt=\"Campaigns\" width=\"1602\" height=\"2212\" \/><\/p>\n<p><strong>Looking for a visual walkthrough to see each step in action? Check out this quick video!<\/strong><\/p>\n<p><iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/J1tBmOnBJEA?si=UeC-toxuOdwoJfkc\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<h3>Embed HTML Code Inside CS-Cart<\/h3>\n<p>Once your popup is ready, Picreel will generate an embed code. This will typically include a few steps &#8211;<\/p>\n<p><strong>1.<\/strong> Start by heading over to the\u00a0<strong>\u201cInstallation\u201d<\/strong>\u00a0section.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-13416\" src=\"https:\/\/www.picreel.com\/blog\/wp-content\/uploads\/2024\/09\/PP_PIC_HCPC-Gwe-copy-the-code.png\" alt=\"copy the code\" width=\"1160\" height=\"408\" \/><\/p>\n<p><strong>2.<\/strong> Select\u00a0<strong>\u201cCopy Code\u201d<\/strong>\u00a0to quickly copy the embed code.<\/p>\n<p><strong>3.<\/strong> Navigate to your\u00a0<strong>CS-Cart dashboard<\/strong>\u00a0and choose the site where you&#8217;d like to add the popup.<\/p>\n<p>CS-Cart offers the ability to embed external HTML elements within its rich text field, making it ideal for our needs.<\/p>\n<p><strong>4.<\/strong> After accessing the rich text editor for your content,\u00a0<strong>switch to the &#8220;HTML&#8221; view<\/strong>\u00a0using the option available in the toolbar. Then, paste the Picreel embed code and save your changes.<\/p>\n<p><strong>5.<\/strong> After embedding the code, make sure to publish your changes in CS-Cart. Your popup will now display based on the targeting settings you\u2019ve set up in Picreel.<\/p>\n<p><strong>? Pro Tip:<\/strong>\u00a0Once you\u2019ve deployed your popup, check your site to ensure it\u2019s functioning correctly. While popups may look impressive on desktop, they don\u2019t always display well on mobile devices. If you\u2019re utilizing Picreel, use the preview mode to see how it appears on mobile screens.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Wrapping_Up\"><\/span>Wrapping Up<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Creating CS-Cart popups using tools like Picreel is a straightforward and effective process, even when it involves adding HTML or JavaScript to your site. I\u2019ve found that Picreel\u2019s user-friendly interface, extensive customization options, and powerful targeting features make it an excellent choice for enhancing your CS-Cart experience.<\/p>\n<p>This approach has significantly boosted my email list and increased engagement on my website. Plus, the best part? You don\u2019t have to spend a dime to get started! Picreel offers a\u00a0<a href=\"https:\/\/www.picreel.com\/pricing\/\">free plan<\/a>\u00a0that includes all the premium features you need. If you decide to scale up later, the pricing is just\u00a0<a href=\"https:\/\/www.picreel.com\/pricing\/?business\">$9.99 per month<\/a>, which is very affordable.<\/p>\n<p>So why not give it a shot? Try out various designs and targeting strategies to see what resonates with your audience. And remember to keep an eye on your results to ensure you&#8217;re getting the most out of your CS-Cart popups. With the right approach, you can create popups that truly enhance your site\u2019s performance!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ever visited a website and had a popup appear at just the right time, nudging you to take action? Ever wonder how they do it? If you\u2019re using CS-Cart and haven\u2019t yet added popups to your marketing toolbox, you might be missing out on a simple but powerful feature. Surprisingly, CS-Cart doesn\u2019t come with a&#8230;<\/p>\n","protected":false},"author":26,"featured_media":13540,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71],"tags":[],"class_list":["post-13539","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\/13539","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=13539"}],"version-history":[{"count":2,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts\/13539\/revisions"}],"predecessor-version":[{"id":13960,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/posts\/13539\/revisions\/13960"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/media\/13540"}],"wp:attachment":[{"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/media?parent=13539"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/categories?post=13539"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.picreel.com\/blog\/wp-json\/wp\/v2\/tags?post=13539"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}