# Adding custom (Calendly, NeetoCal, etc.) calendar popup to Bricks?

**URL:** <https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377>\
**Category:** How To\
**Tags:** how-to\
**Created:** [February 18, 2025, 6:22am UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377 "2025-02-18T06:22:24Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [February 18, 2025, 6:22am UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/1 "2025-02-18T06:22:24Z")

</div>

So trying to add a custom popup for a scheduling calendar I have.

How does one go around to adding this? I’m trying to navigate adding this custom code popup to Bricks, but every single tutorial or guide I see is just to make popups, I don’t want to make my own custom popup I want to make this calendar below appear when I click on a button.

```auto
<!-- NeetoCal element-click embed code begins -->
  <script>window.neetoCal = window.neetoCal || { embed: function(){(neetoCal.q=neetoCal.q||[]).push(arguments)} };</script>
  <script async
    src="https://XXXX.neetocal.com/javascript/embed.js">
  </script>
  <script>
    neetoCal.embed({
      type: "elementClick",
      id: "XXXX",
      organization: "XXXX",
      elementSelector: "#open-popup-button",
    });
  </script>
  <!-- NeetoCal element-click embed code ends -->

```

Hoping someone can help me thanks.

---

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [February 28, 2025, 10:19pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/2 "2025-02-28T22:19:08Z")

</div>

So does no one know the solution to this? Trying to execute code but nothing happens here.

---

<div class="post-metadata">

**Author:** ![shingen](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/shingen/32/1293_2.png) [@shingen](https://forum.bricksbuilder.io/u/shingen)\
**Post date:** [March 1, 2025, 3:11pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/3 "2025-03-01T15:11:45Z")

</div>

What interactions do you have on your button within Bricks?

---

<div class="post-metadata">

**Author:** ![shingen](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/shingen/32/1293_2.png) [@shingen](https://forum.bricksbuilder.io/u/shingen)\
**Post date:** [March 1, 2025, 3:28pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/4 "2025-03-01T15:28:04Z")

</div>

If you do not have it working yet, I do and can show you how, just let me know.

Cheers

---

<div class="post-metadata">

**Author:** ![danca](https://forum.bricksbuilder.io/letter_avatar_proxy/v4/letter/d/b5a626/32.png) [@danca](https://forum.bricksbuilder.io/u/danca)\
**Post date:** [March 3, 2025, 7:52am UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/5 "2025-03-03T07:52:00Z")

</div>

Hey man,

Did you create a button and add the id #open-popup-button to it?

also, where did you place the code?

---

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [March 3, 2025, 8:50pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/6 "2025-03-03T20:50:47Z")

</div>

I have the interaction set to trigger on click, to “show element”, target “popup”, and the popup being the template popup (that has the code in it in a code box, everything is approved and signed).

---

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [March 3, 2025, 8:51pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/7 "2025-03-03T20:51:16Z")

</div>

The code is in a code box and it’s signed.

---

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [March 3, 2025, 9:01pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/8 "2025-03-03T21:01:50Z")

</div>

Hi Shingen,

So the video you posted in the other topic worked, but one more question: when I put the code box (same settings as you in the video) it pushes my button element aside, how do I stop it from doing that?

Video if anyone stumbled on this topic in the future: [Watch 2025-03-03 13-37-17 | Streamable](https://streamable.com/5mu05w)

---

<div class="post-metadata">

**Author:** ![peteargriffin](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/peteargriffin/32/25180_2.png) [@peteargriffin](https://forum.bricksbuilder.io/u/peteargriffin)\
**Post date:** [March 3, 2025, 9:11pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/9 "2025-03-03T21:11:46Z")

</div>

And another question, how do you keep your button from changing on your example video? When I click my button it turns into very small white text and the button disappears. The calendar comes up but only after the second click.

---

<div class="post-metadata">

**Author:** ![shingen](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/shingen/32/1293_2.png) [@shingen](https://forum.bricksbuilder.io/u/shingen)\
**Post date:** [March 3, 2025, 9:16pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/10 "2025-03-03T21:16:42Z")

</div>

Without and url, I could not tell you. I would need to see what is happening in order to give you feedback.

If the colors are changing, that to me sounds like some css is being applied. If the button is moving, again seems like css is the cause.

Cheers

---

<div class="post-metadata">

**Author:** ![shingen](https://forum.bricksbuilder.io/user_avatar/forum.bricksbuilder.io/shingen/32/1293_2.png) [@shingen](https://forum.bricksbuilder.io/u/shingen)\
**Post date:** [March 3, 2025, 9:42pm UTC](https://forum.bricksbuilder.io/t/adding-custom-calendly-neetocal-etc-calendar-popup-to-bricks/30377/11 "2025-03-03T21:42:26Z")

</div>

You do not want to use the popup code snippet from NeetoCal, as it will cause issues.

See here: [Watch 2025-03-03 14-29-22 | Streamable](https://streamable.com/2kr61e)

Plus the videos shows I have done nothing to my button, it is a plain as vanilla ice cream. =]