Hello everyone, I have a pop-up form using the HubSpot pop-up form tool throughout our website: https://cos-bond.com/ The pop-up appears on exit intent. The blog is in HubSpot, but the main website is not (it’s in SANA and i don’t have access to the CSS of the main website). As mentioned in the topic, I want to change the style of this form. I understand that i need to target the appropriate ID (which appears to be leadinModal-777284 in this case), but since the style appears to load inline (on each page) i had no idea how to do this. That is, i can’t change it on the pages of the main website as I don’t have access to the page CSS and i’d rather not have to go through every blog post and at it to the head for each of those. Any help on this would be appreciated. Thank you

Hey @ATA-Daniel I apologize for the delay in answering this post, were you able to find the answer for it? If not, at the moment as you can see in our Knowledge base article: Pop-up forms and non-HubSpot forms FAQ it is not recommended to add your own style to these forms. However if you were to add your own style you would need to create a custom-coded solution for this. I hope this helps, Kindly, Pam

I know you mentioned you don’t have access to the CSS styles. But for anyone finding this post, I wrote a post on how to customize the pop up form styles if you do have access to the CSS. [image] How do you change the styling of a HubSpot pop up form? I recently tried adding a HubSpot popup form but I noticed I didn't like the styles. It wasn't exactly what I was looking for. The form admin does not Est. reading time: 2 minutes

Totally agree, the pop-ups look very poor and need some more ability to control its look, the size of the picture vs the text etc.

Yes. I agree. Popup forms should be very customizable. They look very bad in their naitive format.

Hello @JLadwig To Customize your pop-out form, click on the Form tab in your pop-up. Form body: (optional) add body text to elaborate on the value you’re providing with your pop-up form. Added fields: the default Email field is automatically included. To add additional fields to the form, click + Add another form field. Pop-up forms support the following field types: single-line text, multi-line text, dropdown select, single checkbox, number, date picker, and file. A maximum of four fields can be added to the form.To customize the way a form field appears to visitors, click the pencil icon edit to edit the field label, add placeholder text, or enter a default value. For the Email field, you can specify email addresses and domains to block. Form button text: the form button text from the Callout tab will automatically carry over into this field. To make any changes to the button text on the form step, update it here. Notice and consent / legitimate interest (GDPR): if you have GDPR enabled in your HubSpot account, you can set the notice and consent option for this pop-up form. To customize the default text, click the pencil icon edit. Language: set the form language. This will change the form field labels, Notice and consent/legitimate interest message, and error messages displayed on the form. All other editable fields will need to be translated manually. Set lifecycle stage: choose the lifecycle stage contacts who submit the pop-up form will have. This is set to Lead by default. CAPTCHA: enable CAPTCHA to provide additional protection against spam submissions You can find all these steps in this article here. I hope this information helps. Pam

It sounds like your answer is not about this issue. Form tab is inactive when you are creating a pop-up form. There is a callout tab active only with super poor editing possibilities. You can’t edit Callout text (or header) color, you can’t edit button text color, can’t edit button shape, size or location. No option to upload your own background image etc.

Hello, @asbahs thank you for the extra information provided. You should be able to change the font on the pop-up, but it would require help from an external website designer as they would need to add the code to your CSS. @DanielSanchez our Community Champion explained more about it here. Kindly, Pam

Hi Pam, Fonts are the smallest problem but thank you for the answer.

Hello @asbahs, I would highly recommend you to please post this idea at our ideas forum (here). Our product team, who monitors the forum regularly, can read your specific use case and understand why this would be a useful functionality or change. It also helps other customers facing the same issue to advocate for its implementation on your behalf by upvoting on the thread as well. Thank you, Pam

Hubspot’s pop-ups are VERY weak. Beyond being able to bold, italic, underline or align text - you can’t edit the formatting at all. You’re stuck with the same grey background. You can’t access the HTML or add stying with CSS. I was hoping Hubspot will allow us to stop using Optin Monster, but there is no way I can put these Hubspot popups on our website. I have to renew my Optin Monster subsription :neutral_face:

Pop-Up Form Custom Styling

Marketing & Content Lead Capture Tools

Jake_Lett November 26, 2021, 11:18am 11

I know you mentioned you don’t have access to the CSS styles. But for anyone finding this post, I wrote a post on how to customize the pop up form styles if you do have access to the CSS.

Topic		Replies	Views
Help with Styling/Design of Hubspot Pop-Ups Lead Capture Tools enterprise	1	1843	March 13, 2023
How do you change the styling of a pop up form? Lead Capture Tools forms	6	9174	June 3, 2021
Pop-up form styling Tips, Tricks & Best Practices best-practices , forms	3	2485	March 16, 2023
Customising pop up forms and banners Lead Capture Tools forms	1	3574	October 12, 2022
Help Styling/Design of Hubspot Pop-Ups CMS Development enterprise	1	2297	March 13, 2023

Pop-Up Form Custom Styling

Related topics