# Dev Diary Ep72 - New Modal Component **URL:** \ **Category:** Elements\ **Created:** [April 2, 2025, 1:27pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028 "2025-04-02T13:27:14Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 2, 2025, 1:27pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/1 "2025-04-02T13:27:14Z")
Hello again, Yesterday we shipped [Elements 0.7.1](https://forums.realmacsoftware.com/t/elements-0-7-1-23429-released/47020/2), and today we’re demoing a new component that has been on the request list for quite a while. It’s the humble Modal. As with all our components, we’ve made sure it’s really flexible and able to cover a lot of use cases. Watch today’s video to learn more. **The Modal Component will be added to a future build of Elements, very soon!** [![](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/c/d/cd64cbdd72b6425215eb0fb91ad14114d19e5a55.jpeg "Dev Diary Ep72 - New Modal Component") ](https://www.youtube.com/watch?v=Ye1Eyfyh3DE) ## Get Elements for macOS Elements is now [available in Early Access](https://docs.realmacsoftware.com/elements-docs/get-early-access). You can visit the [elementsapp.io website](https://www.elementsapp.io/purchase/?utm_source=realmacsoftware-forum) to purchase a license today. ## Thanks for Your Feedback As always, keep the feedback coming. Your input has made all the difference so far. Thank you! See you soon, Dan & Team Realmac. ---
**Author:** ![sbchasin](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/sbchasin/32/26943_2.png) [@sbchasin](https://forums.realmacsoftware.com/u/sbchasin)\ **Post date:** [April 2, 2025, 2:02pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/2 "2025-04-02T14:02:43Z")
@dan Is the dropdown component I spied in the background mean that dropdown menus are on the horizon?? 🥳 Modal component looks great, and I even have a place for it in my website!! ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 2, 2025, 2:08pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/3 "2025-04-02T14:08:07Z")
> [@sbchasin](#): > > @dan Is the dropdown component I spied in the background mean that dropdown menus are on the horizon?? 🥳 Maybe… 😉 > [@sbchasin](#): > > Modal component looks great, and I even have a place for it in my website!! Awesome! ---
**Author:** ![AnasHyeee](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/anashyeee/32/27982_2.png) [@AnasHyeee](https://forums.realmacsoftware.com/u/AnasHyeee)\ **Post date:** [April 2, 2025, 2:39pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/4 "2025-04-02T14:39:57Z")
I like function of **Modal Component** we can use it for many purposes, and looks great 👏🏻 ---
**Author:** ![Flash](https://avatars.discourse-cdn.com/v4/letter/f/f475e1/32.png) [@Flash](https://forums.realmacsoftware.com/u/Flash)\ **Post date:** [April 2, 2025, 2:40pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/5 "2025-04-02T14:40:26Z")
So I love this! Perfect for navigation. Can I enter the built in navigation to this, I suspect yes. Can I allow it to scroll overflow? This may be a great way to build the vertical navigation that I have been waiting for! ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 2, 2025, 2:58pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/6 "2025-04-02T14:58:11Z")
Yes to all of the above, and that’s… `The Power of Elements™`😆 ---
**Author:** ![Flash](https://avatars.discourse-cdn.com/v4/letter/f/f475e1/32.png) [@Flash](https://forums.realmacsoftware.com/u/Flash)\ **Post date:** [April 2, 2025, 3:01pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/7 "2025-04-02T15:01:18Z")
Vertical menu? ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 2, 2025, 3:24pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/8 "2025-04-02T15:24:15Z")
oh sorry, not just yet with the built in navigation component. You could “easily” build a custom component to list out all your pages… You could build it manually, like this example, but it’s not ideal for a large site. ![CleanShot 2025-04-02 at 4 .22.35@2x](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/e/9/e9bfd7b300fa5cc9edb20939ead4f2e8f4f818a3.png) We probably need to build another navigation component, one that can be used vertically… ---
**Author:** ![Flash](https://avatars.discourse-cdn.com/v4/letter/f/f475e1/32.png) [@Flash](https://forums.realmacsoftware.com/u/Flash)\ **Post date:** [April 2, 2025, 3:32pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/9 "2025-04-02T15:32:38Z")
> [@dan](#): > > We probably need to build another navigation component, one that can be used vertically… Yes please. I pretty much need this! ---
**Author:** ![Flash](https://avatars.discourse-cdn.com/v4/letter/f/f475e1/32.png) [@Flash](https://forums.realmacsoftware.com/u/Flash)\ **Post date:** [April 2, 2025, 4:13pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/10 "2025-04-02T16:13:10Z")
@dan Way back in the day—think RapidWeaver versions 1, 2, and 3—the navigation had the ability to hide all tier 3 pages that weren’t related to the currently active tier 2 page. This wasn’t just CSS wizardry; it was hardcoded into the HTML. The advantage of this approach was that search engines only saw the silo of links attached to the active tier 2 page. Ideally, navigation in Elements would function the same way. ---
**Author:** ![RoKe](https://avatars.discourse-cdn.com/v4/letter/r/90ced4/32.png) [@RoKe](https://forums.realmacsoftware.com/u/RoKe)\ **Post date:** [April 2, 2025, 4:23pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/11 "2025-04-02T16:23:31Z")
This looks really great. Early in the video you mention creating a gallery, but you didn’t show that. Can I create a modal like the left-hand dog photo that has pulls up a whole gallery of photos? With clickable next/prev. symbols? With automatic scolling? Or is there another way (element) to set that up that I missed in all the videos? Thanks! ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 2, 2025, 5:14pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/12 "2025-04-02T17:14:06Z")
> [@RoKe](#): > > Early in the video you mention creating a gallery, but you didn’t show that. Can I create a modal like the left-hand dog photo that has pulls up a whole gallery of photos? With clickable next/prev. symbols? With automatic scolling? Or is there another way (element) to set that up that I missed in all the videos? Yes, the included Gallery Component already does that! ---
**Author:** ![RoKe](https://avatars.discourse-cdn.com/v4/letter/r/90ced4/32.png) [@RoKe](https://forums.realmacsoftware.com/u/RoKe)\ **Post date:** [April 2, 2025, 6:33pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/13 "2025-04-02T18:33:08Z")
Thanks! I was sure it had to be there already 😀. ---
**Author:** ![joeace](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/joeace/32/25504_2.png) [@joeace](https://forums.realmacsoftware.com/u/joeace)\ **Post date:** [April 2, 2025, 6:51pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/14 "2025-04-02T18:51:49Z")
Yes, I have a large website waiting on a vertical navigation component. ---
**Author:** ![handshaper](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/handshaper/32/27373_2.png) [@handshaper](https://forums.realmacsoftware.com/u/handshaper)\ **Post date:** [April 2, 2025, 8:03pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/15 "2025-04-02T20:03:22Z")
@dan This new component looks really good and I certainly have a need for it. There was one feature that I thought was missing from this component. That was the ability to display the modal on a timer. So it would popup and if not closed by the user would stay on screen for a certain period of time before closing. I have modals I use on my Classic sites that depend on this feature of a modal. Maybe there is some other way of doing this in Elements, but I have not discovered it yet. Great to see more components showing up, Elements is getting more and more well rounded by the day. ---
**Author:** ![KipV](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/kipv/32/33413_2.png) [@KipV](https://forums.realmacsoftware.com/u/KipV)\ **Post date:** [April 2, 2025, 11:28pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/16 "2025-04-02T23:28:04Z")
How is this version of the modal different from the one that was available in those very first builds of elements? ---
**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\ **Post date:** [April 3, 2025, 6:38am UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/17 "2025-04-03T06:38:21Z")
I’d have to go back and take a look at the first modal we built (it’s been a while!), but this new modal takes a much more **flexible, composable** approach. As with all our built-in components, we’ve aimed to make it as versatile as possible. As you saw in Dan’s video, **anything** can be used as the modal trigger (previously it was a hardcoded button), and you can add **any component** as the modal itself. This gives you tons of flexibility—whether you’re building a simple image popup, a slide-in panel, or something more complex 🙂 ---
**Author:** ![KipV](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/kipv/32/33413_2.png) [@KipV](https://forums.realmacsoftware.com/u/KipV)\ **Post date:** [April 3, 2025, 3:20pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/18 "2025-04-03T15:20:03Z")
Oh good! That is a feature that has worked best with a lot of flexibility. ---
**Author:** ![luckylindy](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@luckylindy](https://forums.realmacsoftware.com/u/luckylindy)\ **Post date:** [April 3, 2025, 9:42pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/19 "2025-04-03T21:42:08Z")
Brilliant, young Dan! 😊 I am a rabid weaver (get it?) of modals on my sites. Use many of them and this surpasses the RW Classic (stacks-based) implementations I’ve used. Can’t wait to try it out. All I need now is a Tabs component and I shall be in Nirvana. Way to go, you + team! ---
**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\ **Post date:** [April 3, 2025, 9:46pm UTC](https://forums.realmacsoftware.com/t/dev-diary-ep72-new-modal-component/47028/20 "2025-04-03T21:46:12Z")
> [@luckylindy](#): > > Brilliant, young Dan! 😊 I am a rabid weaver (get it?) of modals on my sites. Use many of them and this surpasses the RW Classic (stacks-based) implementations I’ve used. Can’t wait to try it out. Awww, thanks! I’m glad to hear you like it! > [@luckylindy](#): > > All I need now is a Tabs component and I shall be in Nirvana. It’s on the list 😉