Scribd
Upload
13 views2 pages

Botstrap Grid Menu Bar

The document outlines the header section of a website, including contact information, social media links, and logo images. It features a navigation menu that is responsive and collapsible for different screen sizes. The layout is structured using Bootstrap classes for a clean and organized appearance.

Uploaded by

compnetworxxx
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
13 views2 pages

Botstrap Grid Menu Bar

The document outlines the header section of a website, including contact information, social media links, and logo images. It features a navigation menu that is responsive and collapsible for different screen sizes. The layout is structured using Bootstrap classes for a clean and organized appearance.

Uploaded by

compnetworxxx
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd

<header>

<section class ="headertop">


<div class="container">
<div class="row">
<div class="headertoptext text-left col-xl-10 col-md-8 col-sm-8 col-6">
<p><i class="fa fa-phone"></i> +91 990 317 6377</p>
<p><i class="fa fa-envelope"></i> [email protected]</p>
</div>
<div class="headertoptext text-right col-xl-2 col-md-4 col-sm-4 col-6">
<font color="#FFFFFF"><a href=" "><i class="fa fa-facebook
facebook "></i></a></font>
<font color="#FFFFFF"><a href=""><i class="fa fa-twitter facebook
"></i></a></font>
<font color="#FFFFFF"><a href=""><i class="fa fa-instagram
facebook"></i></a></font>
<font color="#FFFFFF"><a href=""><i class="fa fa-youtube
facebook"></i></a></font>
</div>

<!--div class="search-icons col-xl-2 col-md-2 col-sm-2 col-2"><font


color="#FFFFFF"><a href=" "><i class="fa fa-search facebook
"></i></a></font></div-->
</div>
</div>

</section>

<section class="header">
<div class="container">
<div class="row">
<div class="text-left loggrr col-xl-12 col-md-12 col-sm-12 col-
12"><img src="<?php bloginfo( 'stylesheet_directory' ); ?>/assets/images/logo1.png"
class="img-responsive" /></div>
</div>
<div class="container">
<div class="row">
<div class="text-right fdgd col-xl-12 col-md-12 col-sm-12 col-
12"><img src="<?php bloginfo( 'stylesheet_directory' ); ?>/assets/images/logo2.png"
class="" /></div>
</div>
</div>
</section>

<!-- Bootstrap Navigation -->


<section class="manuheader"><!--gives backgroundcolor to menubar-->

<div class="container">

<!---tutotrial-->

<div class="align">

<!-- Navigation -->


<div class="row">
<div class="navbar-header col-xl-4 col-md-4 col-sm-4 col-4 ">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-
target=".navbar-collapse">
<span class="sr-only">Toggle
navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>

<a class="navbar-brand" href="/"><img src="<?php


bloginfo( 'stylesheet_directory' ); ?>/assets/images/logo.png" alt="Bootstrap to
Wordpress"></a>
</div>
<div col-xl-8 col-md-8 col-sm-8 col-8>

<?php wp_nav_menu( array(


'theme_location' => 'primary',
'container' =>'nav',
'container_class' =>' navbar-collapse collapse',
'menu_class' =>'nav ',//customnavbar settinggs
'menu_class' =>' nav navbar-nav navbar-left nav',
//botstrap navbar menu link aligh each other

) ); ?>
</div>
</div>
</div>
</div>

</section>

</header>

You might also like