How can I set a timed pop-up banner for my online store?

Shopify Discussion
1

Hi all,

Looking for suggestions to have a pop up banner that only appears at a certain time.

For example… 10pm visitor visits store, pop up says "store closed for deliveries, but you can still place an order for delivery tomorrow morning "> > 6am pop up stops showing as store opens.> > Any ideas??

2

This is a general example to get the ball rolling, there is a more performant way to do this but this should give you a general idea. I wouldn’t go installing an app for something that could be done in one function block.

The more customizations an app provides for people, the bigger the js file is and it’s going to slow down your site.

const modal = document.querySelector('.modal')

function showModal() {
  const date = new Date()
  const hour = date.getHours()
  const minutes = date.getMinutes()

  if (hour >= 22 || hour < 6) {
    modal.style.display = 'none'
  } else {
    modal.style.display = 'block'
  }
}

// check every minute
setInterval(showModal, 60 * 1000)
3

Hey, @Hodnettretail

I’d recommend looking into the SpurIT Sales Pop-Up app as this offers functionality to set impression triggers to display your messages to customers at the right time of the day.

To see the app in action, feel free to check out their app demo.

If there is anything else I can help you with, please let me know.

4

Thanks I’ll take a look.

As long as I can do the timed pop ups that’s really what I’m looking for.