scoop
Hi everybody,
I was looking to have a Tailwind UI navbar and mobile menu with a menu toggle button phx-click={JS.toggle(to: "#mobile-menu")} in live.html.heex.
So I understand LiveView.JS isn’t available in the live template out of the box. I’m guessing that there’s a reason for that. Hence, I haven’t tried setting that up before trying to find this already being done by more skilled people. I very much want it to be “done right”.
Also, as a follow on, if one would go that route I guess one would also like to use handle_event for events from the live template.
Regarding having common callbacks for all live views I think this post hints at a possible solution: Tracking inactivity in a Phoenix LiveView app - #5 by davidmeh.
Wiser people of the community – should one go in this direction at all?
Is there an apparent solution to this?
Feels like there’s an apparent solution but I’m sorry that I haven’t been able to find it.
Thanks in advance for any response and take care 
Where Next?
Trending in Questions
Other Trending Topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Error tracking, logs, APM, uptime and cron monitoring in one dev-friendly platform. Find and fix problems before your users notice.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #library
- #deployment
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #podcasts
- #javascript
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ai
- #ecto-query
- #elixirconf-us
- #blog-post
- #elixir-ls
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #elixirconf-eu
- #api
- #forms
- #metaprogramming
- #hex
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Error tracking, logs, uptime, and Just Enough APM. Built for developers.
Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!
Practical resources that improve the lives of professional developers.
Master modern tools, write cleaner code, and tackle real-world challenges.
**Building the future of software with AI, trust, and human connection.**
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"
Showing Posts 1 to 4- Show Best Posts
- Show All (oldest first)
- Show All (newest first)
cmo
Hey mate.
One option is to do away with the
live.html.heexaltogether and create a layout component that you use in your liveviews. The layout component will include your navigation bar and whatever else you want, with the inner content being the page contents.You can see it talked about here:
scoop
That makes sense.
Thank you very much!
chrismccord
It’s available in the live template. What version are you on?
scoop
Rookie mistake – resolved by referring to Phoenix.LiveView.JS instead of just JS. Sorry.
Getting a reply from Chris McChord made my day however