WordPress.org

Forums

Bootstrap Ultimate
[resolved] Best way to customize the header file (3 posts)

  1. hmbaker
    Member
    Posted 11 months ago #

    I need to modify the header file for a client's site. What's the best way for me to change the header into a 1 row 2 column layout. Logo would be in the left column and the right column would be split into 2 sub-rows. Top sub-row has GH, BBB logos and their phone number. The bottom sub-row will have the menu. I've made a copy of header.php and placed it in my child theme folder.

    What's the best way to incorporate what I described into your header.php file?

    thanks!!

  2. eminozlem
    Member
    Theme Author

    Posted 11 months ago #

    I did a similar thing recently. See if it's similar to what you're after: http://s21.postimg.org/v81xmnjp3/sst_Clipboard01.jpg

    Basically you gotta insert a new row between #inner-header and .navbar

    You can use the builtin fontawesome icons with the below markup.See the code, it should give you a some idea

    <div id="inner-header" class="clearfix">
    <!-- 	Start of inserted row-->
                	<div class="container" id="toprow">
                    	<div class="row">
                            <div id="left_contact" class="visible-md visible-lg col-md-6">
                                <span class="tel"><i class="fa fa-phone"></i> +1 00012 42 66 46</span>
                                <span class="mail"><i class="fa fa-envelope-o"></i> info@company.com</span>
    
                            </div>
                            <div id="right_social" class="visible-md visible-lg col-md-3 pull-right">
                                <ul class="social-links">
                                    <li><a href="http://www.facebook.com/#" target="_blank"><i class="fa fa-facebook-square fa-2x"></i></a></li>
                                    <li><a href="https://twitter.com/#" target="_blank"><i class="fa fa-twitter-square fa-2x"></i></a></li>
                                    <li><a href="javascript:void(0)" target="_blank"><i class="fa fa-google-plus-square fa-2x"></i></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
    		<!-- 	End of inserted row -->	<div class="navbar ....
  3. eminozlem
    Member
    Theme Author

    Posted 11 months ago #

    havent heard from you over 2 weeks, marking as resolved.

Reply

You must log in to post.

About this Theme

About this Topic