need a menu with login form

3 replies·opened Aug 24, 2021
A
azermannAug 24, 2021

Hi i need a menu with login form in normal bootstrap i can do it but when i try to use your menu i can't . Can you help me please.

	<nav class="primary-menu ">

						
						
							<ul class="one-page-menu menu-container" data-easing="easeInOutExpo" data-speed="1250" data-offset="65">
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#wrapper"><div>Ana Sayfa</div></a>
								</li>
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#"><div>Hesap</div></a>
								</li>
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#"><div>Çıkış</div></a>
								</li>
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#"><div>Admin Panel</div></a>
								</li>
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#"><div>Gİrİş</div></a>
									<!-- here i need a  collabse for login form or may be a modal-->
								</li>
								<li class="menu-item">
									<a href="#" class="menu-link" data-href="#"><div>İletişim</div></a>
								</li>
							</ul>
						
						</nav><!-- #primary-menu end -->
S
SemiColonWebSTAFFAug 24, 2021

Hello,

This is already possible with the Default Codes. Here is an Example:

<!-- Primary Navigation
============================================= -->
<nav class="primary-menu">

	<ul class="one-page-menu menu-container" data-easing="easeInOutExpo" data-speed="1250" data-offset="65">
		<li class="menu-item">
			<a href="#" class="menu-link" data-href="#wrapper"><div>Home</div></a>
		</li>
		<li class="menu-item">
			<a href="#" class="menu-link" data-href="#section-about"><div>About</div></a>
		</li>
		<li class="menu-item">
			<a href="#" class="menu-link" data-href="#section-works"><div>Works</div></a>
		</li>
		<li class="menu-item mega-menu mega-menu-small">
			<a href="#" class="menu-link"><div>Services</div></a>
			<div class="mega-menu-content" style="max-width: 250px;">
				<div class="row mx-0">
					<ul class="sub-menu-container mega-menu-column col-12">
						<li class="menu-item">
							<form class="p-3 mb-0" autocomplete="off">
								<div class="form-group">
									<label>Username</label>
									<input type="email" class="form-control" placeholder="Email address">
								</div>
								<div class="form-group">
									<label>Password</label>
									<input type="password" class="form-control" placeholder="Password" required="">
								</div>
								<div class="form-group form-check">
									<input class="form-check-input" type="checkbox" value="" id="top-login-checkbox">
									<label class="form-check-label" for="top-login-checkbox">Remember Me</label>
								</div>
								<button class="btn btn-danger w-100" type="submit">Sign in</button>
							</form>
						</li>
					</ul>
				</div>
			</div>
		</li>
		<li class="menu-item">
			<a href="#" class="menu-link" data-href="#section-blog"><div>Blog</div></a>
		</li>
		<li class="menu-item">
			<a href="#" class="menu-link" data-href="#section-contact"><div>Contact</div></a>
		</li>
	</ul>

</nav><!-- #primary-menu end -->

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

A
azermannAug 24, 2021

Thanx that will do it! Have a great day

S
SemiColonWebSTAFFAug 24, 2021

Very Happy to Help! :)

Do let us know if we can help you with anything else.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard