CMS Development

micheleguilford
Participante

How to create pop-up with direct link, not form

resolver

I'm looking for the abiity to have a lightbox pop up on a page that simply redirects to another page on my site. Heard about a special we have but lost the email with the direct link? Click here and there you are. Seems so much simpler than a form pop-up, but I don't want to use a store template. 

 

Possible? Not?

-Michele 

1 Soluciones aceptada
Hubspotlien
Solución
Participante

How to create pop-up with direct link, not form

resolver

"Instead of full page interstitials, use banners that take up only a small fraction of the screen to grab your users' attention. These can be implemented in various ways. For example, for app install banners, you can use a browser-supported banner, such as Smart App Banners for Safari or in-app install experience for Chrome. Another option is to create a simple HTML banner, similar to a typical small advertisement, that links to the correct app store for download. You can reuse these small containers for other kinds of notifications, such as newsletter sign-up prompts." From Google Developers Portal

Ver la solución en mensaje original publicado

37 Respuestas 37
DomRychlik
Equipo de producto de HubSpot
Equipo de producto de HubSpot

How to create pop-up with direct link, not form

resolver

Hi everyone, I’ve some exciting news to share - we’ve launched a brnad new pop-up builder in HubSpot Marketing Hub and CMS Hub into public beta that will allow you to create a pop-up form (or any other type of pop-up, including one without a form) that will trigger on button click. If you’re inetersted in checking it out you can DM me or opt yourself in (if you’re Super Admin and in MH or CMSH starter - you’ll find the beta opt in in the existing Pop-up forms editor)

GPettinau
Miembro

How to create pop-up with direct link, not form

resolver

Hi, I've used the url Non Hubspot as destination, but it doesn't track the clicks. In the stats I see visualization but not clicks on CTA. How can I set this? Thanks 

0 Me gusta
AllanG
Participante | Partner nivel Diamond
Participante | Partner nivel Diamond

How to create pop-up with direct link, not form

resolver

Is this only available in starter?....Super Admin in enterprise and not seeing this feature. Thx

0 Me gusta
AMartinez33
Participante

How to create pop-up with direct link, not form

resolver

Can I get some documentation on how to use this feature. Thanks.

DomRychlik
Equipo de producto de HubSpot
Equipo de producto de HubSpot

How to create pop-up with direct link, not form

resolver

Hi, here's a Knowldge Base article with more details on how to use it.

https://knowledge.hubspot.com/ctas/create-ctas

0 Me gusta
Hubspotlien
Participante

How to create pop-up with direct link, not form

resolver

Hi all, with Google's upcoming Page Experience update. Will we now be penalised for using pop-ups or "intrusive interstitials" in our sites?

DomRychlik
Equipo de producto de HubSpot
Equipo de producto de HubSpot

How to create pop-up with direct link, not form

resolver

Hi HubSpot Community,

 

 

I'm Dom and I’m a Product Manager at HubSpot. My team is currently looking to build out this functionality beyond the simple solution that we put in place in 2020. I’d be really interested in hearing more about your use cases and generally finding out how you are currently using pop ups and CTAs, what’s working for you and what’s not working. Please DM me if you’re interested in sharing your feedback and jumping on a quick 30 min call with myself and the team.

 

Best,

Dom

VMishravivek
Participante

How to create pop-up with direct link, not form

resolver

Hey ,

 

This option is available in HS. 

Go to Marketing=> Lead capture=> Forms => Pop up form. 

Then While creating the form go to Callout and select the correct option as shown in the image below.

 

VMishravivek_0-1615289811636.png

 

Thanks

 

Hubspotlien
Participante

How to create pop-up with direct link, not form

resolver

Hi everyone, I think Google will penalise sites for using pop-ups when the new 'Page Experience' update rolls out in May?

0 Me gusta
dennisedson
Equipo de producto de HubSpot
Equipo de producto de HubSpot

How to create pop-up with direct link, not form

resolver

@Hubspotlien 

Interesting.  do you have any documentation on that?

(also, thanks for adding here)

0 Me gusta
Hubspotlien
Solución
Participante

How to create pop-up with direct link, not form

resolver

"Instead of full page interstitials, use banners that take up only a small fraction of the screen to grab your users' attention. These can be implemented in various ways. For example, for app install banners, you can use a browser-supported banner, such as Smart App Banners for Safari or in-app install experience for Chrome. Another option is to create a simple HTML banner, similar to a typical small advertisement, that links to the correct app store for download. You can reuse these small containers for other kinds of notifications, such as newsletter sign-up prompts." From Google Developers Portal

jessebeginbound
Participante | Partner nivel Platinum
Participante | Partner nivel Platinum

How to create pop-up with direct link, not form

resolver

Hi @micheleguilford and everyone!

 

I know I'm a little late to the party but we do have a custom module for this that can help if anyone is interested. It allows for you to put a HubSpot Form, PDF, Image, YouTube Video, or iframe of another webpage into a beautiful Popup. It's triggered by a custom button you can style and place on any HubSpot CMS template or page - no coding required!

 

check it out if it sounds like something you might be interested in.

http://beginbound.hs-sites.com/ultimate-popup-wizard-begin-bound-hubspot-custom-module

 

Happy HubSpotting!

Jesse

kathleendavis9
Miembro

How to create pop-up with direct link, not form

resolver

I believe this has been solved with the new hubspot form pop-ups forms! Doesn't have to actually be a form, they really should move it from the forms section. 

 

Create a pop-up form, then on the first step, for the question "What should the button link to?", you can just set it to a non-hubspot URL and bypass the form altogether. 

JRaudys
Participante

How to create pop-up with direct link, not form

resolver

@kathleendavis9 I created an account on here just to thank you for pointing this out. Emoticono riéndose a carcajadas

AlexHutson
Colaborador | Partner
Colaborador | Partner

How to create pop-up with direct link, not form

resolver

Thanks! Yes - you're correct. Cheers!

0 Me gusta
is_ppce
Participante

How to create pop-up with direct link, not form

resolver

Just chiming in to echo this - Having to use an external pop up creator like GetSiteControl is fine, but I'd really rather do it in house at Hubspot and it seems like a no-brainer.

0 Me gusta
MarketingMax
Participante | Partner nivel Elite
Participante | Partner nivel Elite

How to create pop-up with direct link, not form

resolver

Bump. Think this should be pretty simple to implement. Have it so that you can replace the form with a CTA that directs the user to a specific page.

0 Me gusta
DanielSanchez
Asesor destacado | Partner nivel Platinum
Asesor destacado | Partner nivel Platinum

How to create pop-up with direct link, not form

resolver

Hi @micheleguilford and @dariakg 

 

I create one custom module without JavaScript. Look:

 

1) Create one file in your Design Manager and select "Custom Module";

2) Create 1 rich text field and 2 color fields;

3) Paste the code bellow in your space for HTML and CSS in the module.

 

HTML

<div id="openModal" class="modalDialog popup-auto-open">
  <div> <a href="#openModal" title="Close" class="close" style="background:{{ your_field_color.color }};color:{{ your_field_color_2.color }};">X</a>
    Here you insert your value of rich text field or image field
  </div>
</div>

CSS

.modalDialog {
  position: fixed;
  font-family: Arial, Helvetica, sans-serif;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 99999;
  opacity: 1;
  -webkit-transition: opacity 400ms ease-in;
  -moz-transition: opacity 400ms ease-in;
  transition: opacity 400ms ease-in;
  pointer-events: auto;
}

.modalDialog:target {
  opacity: 0;
  pointer-events: none;
}

.modalDialog > div {
  width: 400px;
  position: relative;
  margin: 10% auto;
  padding: 5px 20px 13px 20px;
  border-radius: 10px;
  background: #fff;
  background: -moz-linear-gradient(#fff, #999);
  background: -webkit-linear-gradient(#fff, #999);
  background: -o-linear-gradient(#fff, #999);
}

.close {
  background: #606061;
  color: #FFFFFF;
  line-height: 25px;
  position: absolute;
  right: -12px;
  padding:2px;
  border-radius:100%;
  text-align: center;
  top: -10px;
  width: 24px;
  text-decoration: none;
  font-weight: bold;
  -moz-box-shadow: 1px 1px 3px #000;
  -webkit-box-shadow: 1px 1px 3px #000;
  box-shadow: 1px 1px 3px #000;
}

.close:hover {
    box-shadow: 0 0 5px #333333;
    padding: 5px;
    border-radius: 100%;
    transition: 0.1s linear all;
}

.popup-auto-open img{
  max-width:100%;
}

4)  Is important replace where I left pink with the value of the fields you created.

 

Obs: u can use the above codes in your site code, dont need create custom module. But if use HubSpot, is bether one module to inser in templates os sites and blogs and easy customization.

 

Did this post help solve your problem? If so, please mark it as a solution.

Best Regasrds! 🙂

0 Me gusta
dariakg
Participante

How to create pop-up with direct link, not form

resolver

Need this too! How is it possible it's not there yet??

0 Me gusta
Lmartin
Participante

How to create pop-up with direct link, not form

resolver

We also need this 🙂 

0 Me gusta