{"id":13134,"date":"2024-03-20T15:03:29","date_gmt":"2024-03-20T14:03:29","guid":{"rendered":"https:\/\/helpcenter.blendee.com\/article\/templates-next-flash-sales-recommendations-and-next-flash-sales\/"},"modified":"2024-03-20T15:03:30","modified_gmt":"2024-03-20T14:03:30","slug":"templates-next-flash-sales-recommendations-and-next-flash-sales","status":"publish","type":"article","link":"https:\/\/helpcenter.streamwise.it\/en\/article\/templates-next-flash-sales-recommendations-and-next-flash-sales\/","title":{"rendered":"Templates “NEXT FLASH SALES RECOMMENDATIONS” and “NEXT FLASH SALES”"},"content":{"rendered":"\n

We’re going to explain how every single key in this template works.For the initial configuration of the behavioural message, please refer to the dedicated article how to configure a behavioural message<\/a>.<\/p>\n\n

<\/div>\n\n
\"\"<\/a><\/figure>\n\n
<\/div>\n\n
\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

OPTIONS > More<\/h3>\n\n\n\n

Show message on upload<\/strong> immediately visible on upload.<\/p>\n\n\n\n

Show after scrolling (in px)<\/strong> indicates how many px we need to scroll from the top of the page to see the message.<\/p>\n\n\n\n

Idle time since close<\/strong> shows how long I don’t have to show the message again if it is closed.<\/p>\n\n\n\n

Only after x seconds<\/strong> do we set a delay in the display.<\/p>\n\n\n\n

Initial animation (fadein\/fadeout):<\/strong> we can decide whether to apply an effect to the opening and closing of the message.<\/p>\n\n\n\n

Warning duration (in seconds):<\/strong> we can set a maximum time for which the message will remain visible (only if the Warning key visible until closed set to no).<\/p>\n\n\n\n

Warning visible until closed<\/strong> : we can make sure that the message remains visible until the user closes it.<\/p>\n\n\n\n

OPTIONS > Button<\/h3>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Open Message Button Text Size (in px) | Open Message Button Rollover Text Color | Open Message Button Rollover Background Color | Open Message Button Rollover Border Color | Open Message Button Border Color | Open Message Button Text Color | Open Message Button Border Size (in px) | Open Message Button Background Color<\/strong> We customize the colors and sizes of the Open Message button that appears when the main warning is closed.<\/p>\n<\/div>\n<\/div>\n\n

\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

LAYOUT > Content recommendation(only in the “NEXT FLASH SALES RECOMMENDATIONS” template)<\/h3>\n\n\n\n

Show REC<\/strong> : we can decide whether or not to hide the carousel with recommendations<\/p>\n\n\n\n

Show REC before content<\/strong> if set to “yes” the carousel is inserted before the content, otherwise it is inserted after.<\/p>\n\n\n\n

REC Title<\/strong> : We can enter the title text that appears before the carousel.<\/p>\n\n\n\n

LAYOUT > Message Text<\/h3>\n\n\n\n

Text size (in px) | Title size (in px) | Text Color | Title Color<\/strong> : We can set color and size for titles and text.<\/p>\n\n\n\n

Text content<\/strong> : small visual editor from which we can enter the text to be displayed in the message.<\/p>\n\n\n\n

Side image<\/strong> we can insert a side image through the Blendee media gallery.<\/p>\n\n\n\n

Display side image<\/strong> we can decide whether to display the side image or not.<\/p>\n\n\n\n

Side image on the left<\/strong> : if set to yes the image will be inserted on the left, otherwise it will go to the right.<\/p>\n\n\n\n

Side image width (in px):<\/strong> we can set the maximum width of the side image.<\/p>\n\n\n\n

Link color<\/strong> : We can set a color for links within the text content.<\/p>\n\n\n\n

Additional Button Target<\/strong> : We set the target (where the link opens) of the additional button.<\/p>\n\n\n\n

Additional button text<\/strong> : we can insert the internal text of the button (colors and other things are taken from those we set in the other keys).<\/p>\n\n\n\n

Additional button link<\/strong> : enter the URL to which the button should link.<\/p>\n\n\n\n

Hide additional button<\/strong> : we can decide whether to hide the additional button.<\/p>\n\n\n\n

LAYOUT > More<\/h3>\n\n\n\n

Maximum box width (in px):<\/strong> We can set a maximum width of the message.<\/p>\n\n\n\n

We<\/strong> can insert a CSS shape, we refer you to the site<\/a>, to be able to generate your custom shapes.<\/p>\n\n\n\n

We can decide whether or not to show the outer overlay<\/strong>.<\/p>\n\n\n\n

Animated outer overlay:<\/strong> We can decide whether to display animated shapes.<\/p>\n\n\n\n

Outer Overlay Opacity (in %)<\/strong> accepts values from 1 to 100 and sets the opacity of the outer overlay.<\/p>\n\n\n\n

Live Background Shape Opacity (in %)<\/strong> sets the opacity of animated outer shapes.<\/p>\n\n\n\n

Closing box icon<\/strong> : we can select the icon to be used for the close button of the message.<\/p>\n\n\n\n

zindex<\/strong> We set the z-index to place the message on top of the site elements.<\/p>\n\n\n\n

LAYOUT > Position & Size<\/h3>\n\n\n\n

Distance of the box from the sides (in px):<\/strong> set a minimum distance from the edges that the message must respect.<\/p>\n\n\n\n

Box position<\/strong> a select appears where we can set the position of our message.<\/p>\n\n\n\n

Show Drop Shadow<\/strong> : We can turn the drop shadow on or off.<\/p>\n\n\n\n

Outer Overlay Color<\/strong> sets the background color of the outer overlay.<\/p>\n\n\n\n

Live Background Shape Color<\/strong> sets the color of animated outer shapes.<\/p>\n\n\n\n

Show Drop Shadow<\/strong> : We can turn the drop shadow on or off.<\/p>\n\n\n\n

Close Icon Color<\/strong> to set the close icon color of the message.<\/p>\n\n\n\n

Outer border color: Outer border color<\/strong> of the message.<\/p>\n\n\n\n

Border width (in px): The<\/strong> outer border thickness of the message.<\/p>\n\n\n\n

Background color<\/strong> to set the background color of the entire message.<\/p>\n\n\n\n

Right position closing icon (in px) | Top position closing icon (in px)<\/strong> we can place the closing icon, we can also enter negative values.<\/p>\n\n\n\n

Content padding (in px): The<\/strong> distance of the content from the edges of the message.<\/p>\n\n\n\n

Rounded corners (in px)<\/strong> to set the rounded corners of the message.<\/p>\n\n\n\n

Open message button position<\/strong> : we set the position of the “open message” button when the warning is closed.<\/p>\n\n\n\n

Distance from Open Message button border (in px)<\/strong> is the distance of the Open Message button from the edge of the screen.<\/p>\n\n\n\n

Open Message Button Text<\/strong> : Enter the text you want to display on the Open Message button.<\/p>\n\n\n\n

Hide Open Message Button Icon<\/strong> We can show or hide the icon on the open message button.<\/p>\n\n\n\n

Open message button icon<\/strong> : we select the icon to show on the open message button.<\/p>\n<\/div>\n<\/div>\n\n

\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

FORMS & BUTTONS > Button<\/h3>\n\n\n\n

Button Border Size<\/strong> | Button border color: Button border color<\/strong> and thickness buttons.<\/p>\n\n\n\n

Rollover Button Border Color<\/strong> sets the color of the borders on hover.<\/p>\n\n\n\n

Rounded corners of buttons (in px): The<\/strong> distance between the content and the edge of the button.<\/p>\n\n\n\n

Button text size (in px)<\/strong><\/p>\n\n\n\n

Buttons background rollover<\/strong> background color on hover.<\/p>\n\n\n\n

Button Background: The<\/strong> background color of the buttons.<\/p>\n\n\n\n

Text color: Buttoned rollover<\/strong> text color on hover.<\/p>\n\n\n\n

Text Color Buttons: Text Color<\/strong> Buttons.<\/p>\n\n\n\n

FORMS AND BUTTONS > position and size<\/h3>\n\n\n\n

Hide form:<\/strong> we can decide whether or not to hide the form.<\/p>\n\n\n\n

Form Input Background Color<\/strong> sets the color of the form’s inputs.<\/p>\n\n\n\n

Form Input Border Color<\/strong> sets the border color for form inputs.<\/p>\n\n\n\n

Checkbox\/radio form color:<\/strong>we set the color with which we highlight selected checkboxes and radios.<\/p>\n\n\n\n

Form label color<\/strong><\/strong>: The color of the text on the form labels.<\/p>\n\n\n\n

Form background color<\/strong> : Set the background color of the form.<\/p>\n\n\n\n

Rounded corners of the form (in px):<\/strong> if the background of the form is active, we can also set the rounded corners.<\/p>\n\n\n\n

Padding form (in px if background is active)<\/strong> If the background is active, we can set a margin between the border of the form and the contents.<\/p>\n\n\n\n

To show form background,<\/strong> we can activate or deactivate the background of the form (if deactivated, the padding will be 0).<\/p>\n<\/div>\n<\/div>\n\n

\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

Keys present only in the “NEXT FLASH SALES RECOMMENDATIONS” template<\/h2>\n\n\n\n
<\/div>\n\n\n\n

CAROUSEL > Location & Size<\/h3>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Active Carousel Bullet Background Color<\/strong> | Active Bullet Carousel Border Color<\/strong> | Color Bullet Carousel Border<\/strong> | Bullet carousel rollover background color<\/strong> | Bullet Border Color: Carousel Rollover<\/strong> : Customize the colors of the bullets used for carousel pagination.<\/p>\n\n\n\n

Margin before and after the carousel (in px)<\/strong> We set a margin before and after the carousel.<\/p>\n\n\n\n

Central carousel controls<\/strong> puts buttons and bullets all central.<\/p>\n\n\n\n

Carousel controls grouped to the left (only if centered set to off)<\/strong> puts all controls grouped to the left.<\/p>\n\n\n\n

Carousel padding between elements (in px)<\/strong> distance between one card and another.<\/p>\n\n\n\n

Right arrow carousel<\/strong> icon for left arrow.<\/p>\n\n\n\n

Left arrow carousel<\/strong> icon for right arrow.<\/p>\n\n\n\n

Bullet Carousel Background Color<\/strong> : We customize the colors of the bullets used for the pagination of the carousel.<\/p>\n\n\n\n

Horizontal padding: Carousel controls (in px): Lateral<\/strong> distance between the icon and the edge of the left-right arrows.<\/p>\n\n\n\n

Carousel Controls Icon Size (in px): Right<\/strong> Left Arrow Icon Size.<\/p>\n\n\n\n

Vertical padding: Carousel controls (in px): Distance<\/strong> between the icon and the top and bottom edges of the left-right arrows.<\/p>\n\n\n\n

Carousel Controls Border Thickness (in px): Thickness<\/strong> of the border of the left and right arrow buttons.<\/p>\n\n\n\n

Rounded corners, carousel controls (in px),<\/strong> rounded corners of left and right arrow buttons.<\/p>\n\n\n\n

Carousel Controls on the Sides<\/strong> inserts arrows on either side of the carousel, one on the left and one on the right, centered vertically to the content.<\/p>\n\n\n\n

Bullet carousel size (in px):<\/strong> We set the size of the pagination bullets.<\/p>\n\n\n\n

Card bottom edge size (in px)<\/strong> | Top card edge size (in px)<\/strong> | Card Roll Border Color<\/strong> | Card Rollover Background Color<\/strong> | Card Border Color<\/strong> | Card Background Color<\/strong> | Vertical card padding (in px)<\/strong> | Horizontal card padding (in px)<\/strong> | Left side card border size (in px)<\/strong> | Size of the left side edge of the card (in px):<\/strong> customizations of the individual cards.<\/p>\n\n\n\n

CAROUSEL > More<\/h3>\n\n\n\n

Activate drag mouse carousel<\/strong> We can activate or deactivate the drag of the carousel with the mouse.<\/p>\n\n\n\n

Hide carousel nav<\/strong> hides pagination bullets.<\/p>\n\n\n\n

Hide Carousel Controls<\/strong> hides the right-left arrows.<\/p>\n\n\n\n

Carousel autoplay<\/strong> sets the carousel autoplay.<\/p>\n\n\n\n

Carousel autoplay pause rollover<\/strong> if set to yes, when the mouse hovers in the carousel area, it no longer scrolls automatically.<\/p>\n\n\n\n

Carousel animation timeout<\/strong> sets the animation time for autoplay.<\/p>\n\n\n\n

Card Image Animation<\/strong> toggles the image zoom on or off when the mouse hovers over the card.<\/p>\n\n\n\n

Hide title before REC<\/strong> : we can show or hide the title before the carousel<\/p>\n\n\n\n

CAROUSEL > Content recommendation<\/h3>\n\n\n\n

Order Product Name<\/strong> | Brand Order<\/strong> | Image Order<\/strong> | Order short description<\/strong> | Price order<\/strong> we can decide the order of each item, the higher the value the sooner it will be entered.<\/p>\n\n\n\n

Show currency symbol before price <\/strong>if set to “yes” shows the currency before the price, otherwise it inserts it after.<\/p>\n\n\n\n

Brand name size (in px)<\/strong> | Brand Name Color<\/strong> | Color Reduced Price<\/strong> | Original price<\/strong> | Product description<\/strong> color | Product Name Color<\/strong> | Product description size (in px)<\/strong> | Product Name Size (in px)<\/strong> | Maximum carousel image height (in px)<\/strong> | Bar size original price (in px)<\/strong> | Bar Color Original Price<\/strong> | Size sale price (in px)<\/strong> | Original price size (in px)<\/strong> we set the colors and size of the text content of the cards.<\/p>\n\n\n

\n
\"\"<\/a><\/figure><\/div>\n\n\n

Hide Additional Text Discount Label<\/strong> | Discount Label on the Left<\/strong> | Discount Label at the top<\/strong> | Rounded Corners Discount Label<\/strong> | Discount label text size (in px)<\/strong> | Discount Color Label<\/strong> | Vertical Distance Discount Label (in px)<\/strong> | Horizontal Distance Discount Label (in px)<\/strong> | Discount label internal padding (in px)<\/strong> | Additional Text Discount Label<\/strong> | Discount label background<\/strong> : these parameters are used to customize the discount label.<\/p>\n\n\n\n

Hide Image Discount Label<\/strong> | Hide REC Button<\/strong> | Hide REC Pricing<\/strong> | Hide REC Image<\/strong> | Hide REC Description<\/strong> | Hide REC Name<\/strong> | Hide REC brand:<\/strong> we can hide the elements of the card that we want.<\/p>\n\n\n\n

Original Price Slanted Bar<\/strong> : If set to “Yes”, the bar on the sale price will be oblique, otherwise it will be straight.<\/p>\n\n\n\n

CAROUSEL > Button<\/h3>\n\n\n\n

Full-width button<\/strong> sets the card button across the width of the card.<\/p>\n\n\n\n

Button Text<\/strong> : Enter the text for the card buttons.<\/p>\n\n\n\n

Padding above\/below button (in px)<\/strong> sets the top\/bottom margin between the content and the edge of the button.<\/p>\n\n\n\n

Button side padding (in px)<\/strong> sets the left\/right margin between the content and the edge of the button.<\/p>\n<\/div>\n<\/div>\n\n

\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

COUNTDOWN & COUPONS > More<\/h3>\n\n\n\n

Wait for Coupon Expiration Reset after <\/strong>if the coupon expiration is set to yes, this is the time when the forced coupon expiration restarts.<\/p>\n\n\n\n

Coupon Forced Expiration Time<\/strong> is the forced expiration time that is shown when the user views the message.<\/p>\n\n\n\n

Coupon Expiration Date<\/strong> : The expiration date (at midnight on the specified day) is shown when the coupon does not expire.<\/p>\n\n\n\n

Force Coupon Expiration<\/strong> if set to yes, the expiration of the coupon is set with the parameters configured before, for example if we set this parameter to “yes” and “Forced coupon expiration time” to 15 minutes, the user as soon as he sees the countdown will see 15:00:00 and once it reaches zero the countdown will restart after the time indicated in the key “Wait for reset coupon expiration after if the expiration”.<\/p>\n\n\n\n

Coupons<\/strong> : Enter the coupon code to display here.<\/p>\n\n\n\n

Hide Countdown Lock | Hide Copy Coupon Button | Hide Countdown<\/strong> : We can customize the items to be displayed.<\/p>\n\n\n\n

\"\"<\/a><\/figure>\n\n\n\n

Show countdown on open message button<\/strong> : we can decide to show the countdown also in the open message button.<\/p>\n\n\n\n

COUNTDOWN AND COUPONS > Location & Size<\/h3>\n\n\n\n
\"\"<\/a><\/figure>\n\n\n\n

Label Countdown Seconds | Label Countdown Minutes | Label Countdown Hours | Label Countdown Days We<\/strong> set the text written above each element of the countdown.<\/p>\n\n\n\n

Countdown number size (in px) | Countdown Number Separation Line Size (in px) | Countdown Number Separation Line Color | Countdown Numbers Color | Countdown Numbers Background Color | Separator Color Now | Mobile countdown number sizes (in px)<\/strong> we customize the number tiles, sizes and colors.<\/p>\n\n\n\n

Countdown box background color<\/strong> : We set a background color for the countdown box.<\/p>\n\n\n\n

Coupon Button Text Size (in px) | Copy Coupon Button Text | Copy Coupon Button Icon | Hide icon on copy coupon button<\/strong> , we customize the copy coupon button, text size, icon while the colors will be those of the buttons configured in the other keys.<\/p>\n\n\n\n

Text before the countdown<\/strong> : we can enter a text to be displayed before the countdown.<\/p>\n\n\n\n

Box countdown inner margin (in px)<\/strong> is the distance of the content from the outer countdown box margin.<\/p>\n<\/div>\n<\/div>\n

\n

Was this content useful?<\/strong><\/div><\/p>\n

Thanks for contributing!<\/p>\n

\nYes<\/a>\nNo<\/a>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

We’re going to explain how every single key in this template works.For the initial configuration of the behavioural message, please refer to the dedicated article how to configure a behavioural message. OPTIONS > More Show message on upload immediately visible on upload. Show after scrolling (in px) indicates how many px we need to scroll […]<\/p>\n","protected":false},"author":1,"featured_media":0,"menu_order":0,"template":"","format":"standard","article-category":[563],"article-tag":[177,190],"class_list":["post-13134","article","type-article","status-publish","format-standard","hentry","article-category-template-en","article-tag-recommendations-en","article-tag-template-en"],"_links":{"self":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/13134"}],"collection":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":1,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/13134\/revisions"}],"predecessor-version":[{"id":13135,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article\/13134\/revisions\/13135"}],"wp:attachment":[{"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/media?parent=13134"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article-category?post=13134"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/helpcenter.streamwise.it\/en\/wp-json\/wp\/v2\/article-tag?post=13134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}