Dear Paul,
1. Change positon order to customise the header:
go to custom these file .xml in templates/sj_plus/layouts
eg: open main-left-right.xml finding and order :
<header html5tag="header" order="1" id="yt_header" autosize="0">
<positions>
<position class="span3" data-tablet="span4" type="feature">@logo</position>
<position class="span3" data-tablet="span4" data-mobile="span4" style="none" type="modules">social</position>
<position class="span3" data-tablet="hidden" data-mobile="hidden" style="none" type="modules">search</position>
<position class="span3" data-tablet="span4" data-mobile="hidden" style="none" type="modules">contact</position>
</positions>
</header>
=>
<header html5tag="header" order="1" id="yt_header" autosize="0">
<positions>
<position class="span3" data-tablet="span4" data-mobile="span4" style="none" type="modules">social</position>
<position class="span3" data-tablet="span4" type="feature">@logo</position>
<position class="span3" data-tablet="hidden" data-mobile="hidden" style="none" type="modules">search</position>
<position class="span3" data-tablet="span4" data-mobile="hidden" style="none" type="modules">contact</position>
</positions>
</header>
2. Change size logo
You can change logo image in this folder : your_site/templates/sj_plus/images/logo.png
and then open templates/sj_plus/css/template_blue.css file, find this code
#yt_header #yt_logoposition h1 a {
display: inline-block;
}
=>
#yt_header #yt_logoposition h1 a {
display: inline-block;
max-width:100%;
width:250px;/*edit my logo dimension*/
height:100px;/*edit my logo dimension*/
}
-----------------------------
#yt_header .row-fluid > div:before {
content: "";
border-left: 1px solid #ddd;
height: 50px;
margin-top: 20px;
float: left;
-webkit-box-shadow: 1px 0 0 #fff;
-moz-box-shadow: 1px 0 0 #fff;
box-shadow: 1px 0 0 #fff;
}
=> edit: height: 50px;
Thanks!
