A good idea On Demand Web Components

"Mini Wheel"

Releasing from redeveloping the wheel.

Mini Wheel won't let you do it again yourself.

By using Mini Wheel

You can embed easily a "Nav(nav header)" and "Scroller(back to top button)" to your own site.

So you can create a part of your site very easily and quickly.

Nav

Scroller

👀 Demo Preview

Nav(nav header)

Insert the below link and script tags to inside of head tag of your site.

  <link rel="stylesheet" href="https://mini-wheel.pro/asset/css/mw_nav_default_theme.css" data-turbo-track="reload">
  <script type="module" src="https://cdn.skypack.dev/@hotwired/turbo@7.1.0"></script>
  <script type="module" src="https://mini-wheel.pro/asset/js/mw_nav.js"></script>
</head>

Insert and custom the turbo-frame tag to inside of body tag of your site.

<body>
  <turbo-frame class="mw_ly_navContainer" id="mw_nav" target="_top"
    src="https://mini-wheel.pro/nav?logo=%2flogo.png&brand=Brand&items[]=%2f:🏠%20%20Home&items[]=%2fabout.html:🏢%20%20About&items[]=%2faccess.html:🗺%20%20Access">
  </turbo-frame>

Scroller(back to top button)

Insert the below link and script tags to inside of head tag of your site.

  <link rel="stylesheet" href="https://mini-wheel.pro/asset/css/mw_scroller_default_theme.css" data-turbo-track="reload">
  <script type="module" src="https://cdn.skypack.dev/@hotwired/turbo@7.1.0"></script>
</head>

Insert the turbo-frame tag to inside of body tag of your site.

  <turbo-frame class="mw_ly_scrollerContainer" id="mw_scroller" target="_top" src="https://mini-wheel.pro/scroller"></turbo-frame>
</body>

🎉 That's all. 🎉

💰 Pricing

It's free for now.🎉

You can donate me if you could. Thank you for your supporting 😉