Member Avatar for Zill_1

I wonder if anyone knows how to set the menu block on the side instad of the top in Mobirise builder?
I really do need this option but can't find it anywhere.

  • 3 Contributors
  • 3 Replies
  • 307 Views
  • 1 Hour Discussion Span
  • Latest Post Latest Post by rproffitt

Dani AI

Generated

Short answer: Mobirise’s built‑in Menu block is a top header (the Menu block lives in the header area and is treated as the site menu), so there isn’t a one‑click “move header to left/right” toggle. To get a docked left/right navigation you’ll either use a theme/block that already includes a sidebar, or add your own sidebar with a Custom HTML block or the Code Editor extension. (mobirise.com)

Practical options and a simple workflow:

  • Look in the Blocks list or the Mobirise template library for “side / sidebar / vertical menu” blocks and add that block if present — this is the quickest route. (mobirise.com)
  • If no sidebar block exists for your theme, use the Code Editor (or the Custom HTML block that appears when Code Editor is installed) to paste a Bootstrap off‑canvas / vertical nav or your own HTML/CSS. The Code Editor lets you insert head/body snippets and edit block HTML/CSS, but it’s an extension (All‑in‑One kit or paid add‑on). (mobirise.com)
  • If you only need a compact mobile compromise, the standard hamburger/collapsed menu expands to a sidebar on many Bootstrap templates — useful if your priority is mobile behaviour rather than a persistent desktop sidebar. (mobirise.com)

Minimal example you can paste into a Custom HTML block (or into the exported HTML if you prefer editing outside Mobirise):

<nav class="my-sidebar">
  <ul>
    <li><a href="#home">Home</a></li>
    <li><a href="#about">About</a></li>
  </ul>
</nav>

<style>
.my-sidebar{position:fixed;left:0;top:0;height:100vh;width:220px;background:#222;color:#fff;padding:1rem;}
body{margin-left:220px;}
.my-sidebar a{color:#fff;text-decoration:none;display:block;padding:.5rem 0;}
</style>

Cautions and tips: editing block HTML/CSS can make that block harder to edit visually later (the app warns about this), and Mobirise’s header/menu behaviour can be global across pages — back up your project first and test on mobile and keyboard navigation. If you’re not comfortable with code, pick a sidebar template/block or hire a quick helper — it’s the cleanest path. (mobirise.com)

Helpful: asked the original question, ’s hamburger suggestion is a valid mobile compromise, and ’s follow‑ups about UX are on point — the right approach depends on whether you need a permanent desktop sidebar or just mobile drawer behavior.

Recommended Answers

All 3 Replies

Member Avatar for rproffitt

That's funny given it's April 1st.

Member Avatar for Dani

Why is it funny? What am I missing?

commented: Imagine how much space left on a mobile screen with a menu on the left. Happy April 1st. +15
Member Avatar for rproffitt

In case you were wondering why I thought it funny is simply because of the effect on the average mobile user. Also, I see no support for such a menu. Maybe try the Hamburger menu instead. If you feel this is a gross oversight, tell them at https://forums.mobirise.com/

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.