-
AuthorPosts
-
beyondsports Friend
beyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 17, 2008 at 3:09 am #128628please bear with me… we just downloaded the ja barite template and we want to add some content to the header… i know the header right is a compilation of slice’s…. we would like to utilize at the minimum of 3 seperate file’s: left – middle – right…. and at what dimensions / width do i have to work with… what change’s to the css file would i need to make….
thanks
treybeyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 18, 2008 at 3:00 pm #249613Once Again It Would Be Nice To Have Some Support For This Product… Can Someone Help Me …
TreyMay 19, 2008 at 7:30 pm #249781I wonder whether contents you expect to add to the header of JA Barite are images or text. Below are some customization applied for image header. Supposed you change the header image which are cut into 3 slices. In order to load these 3 slices to the header, you need to edit file index.php and file template.css as follows:
In line 100 of file index.php, replace:
<blockquote><div id=”ja-header” class=”clearfix”></blockquote>
With:
<blockquote> <div id=”ja-header”>
<div id=”bg1″></div>
<div id=”bg2″></div>
<div id=”bg3″></div>
<div class=”clearfix”></div></blockquote>In line 926 of file template.css, replace:
<blockquote>#ja-header {
position: relative;
height: 120px;
}</blockquote>With:
<blockquote>
#ja-header {
position: relative;
width:950px; // you can change this value to suit your need
height:120px;
margin:auto;
}#bg1 {
background: url(../images/hbg_01.gif) no-repeat; //Suppose hbg_01 is your 1st slice of header image
height:120px;
width: 350px;
display:inline;
float:left;
}#bg2 {
color: #CCCCCC;
background:url(../images/hbg_02.gif) no-repeat; //Suppose hbg_02 is your 2nd slice of header image
height: 120px;
width: 350px;
display: inline;
float:left;
}#bg3 {
color: #CCCCCC;
background: url(../images/hbg_03.gif) no-repeat; //Suppose hbg_03 is your 3rd slice of header image
height: 120px;
width: 250px;
float:right;
display: inline;
}</blockquote>Please play around with the customization to see if it works for you.
beyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 19, 2008 at 9:04 pm #249790That actually blew it out… royally… heck I am ok with just one graphic across the whole top of the page..
any other idea’s…
TreyMenalto FriendMenalto
- Join date:
- May 2007
- Posts:
- 4736
- Downloads:
- 0
- Uploads:
- 43
- Thanks:
- 2
- Thanked:
- 531 times in 361 posts
May 19, 2008 at 9:55 pm #249801I would say that too, the code could work for him but there is other ways to do it on.
How do you actually want it to be?
beyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 19, 2008 at 11:17 pm #249810well take a look at my site right now: http://unfl.beyondsportsnetwork.com/
i would like to either have 1 graphic across the top or maybe 3 piece’s [ right- middle – left ]…. what would i need to do… i know i have to edit the index.php and cs file…i just dont know how… and if i wanted to add another pix to say the left—that overlaps the top and body left to the left menu bar…
thanks
treybeyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 19, 2008 at 11:33 pm #249814menalto the template’s are great… for us to use them we will need to edit and add header’s… is it pretty generic to edit each template or is each one different ….
thanks
treyMenalto FriendMenalto
- Join date:
- May 2007
- Posts:
- 4736
- Downloads:
- 0
- Uploads:
- 43
- Thanks:
- 2
- Thanked:
- 531 times in 361 posts
May 20, 2008 at 6:02 am #249835You can try the following:
Find this code here in the index.php file for the template:
<!-- BEGIN: HEADER -->
<div id="ja-headerwrap">
<div id="ja-header" class="clearfix"><?php
$siteName = $tmpTools->sitename();
if ($tmpTools->getParam('logoType')=='image') { ?>
<h1 class="logo">
<a href="index.php" title="<?php echo $siteName; ?>"><span><?php echo $siteName; ?></span></a>
</h1>
<?php } else {
$logoText = (trim($tmpTools->getParam('logoText'))=='') ? $config->sitename : $tmpTools->getParam('logoText');
$sloganText = (trim($tmpTools->getParam('sloganText'))=='') ? JText::_('SITE SLOGAN') : $tmpTools->getParam('sloganText'); ?>
<h1 class="logo-text">
<a href="index.php" title="<?php echo $siteName; ?>"><span><?php echo $logoText; ?></span></a>
</h1>
<p class="site-slogan"><?php echo $sloganText;?></p>
<?php } ?><?php if($this->countModules('user4')) : ?>
<div id="ja-search">
<jdoc:include type="modules" name="user4" />
</div>
<?php endif; ?><?php if ($this->countModules('top')) { ?>
<div id="ja-login">
<jdoc:include type="modules" name="top" style="raw" />
</div>
<?php } ?><!-- BEGIN: MAIN NAVIGATION -->
<div id="ja-mainnav" class="clearfix">
<?php $jamenu->genMenu (0); ?>
</div>
<!-- END: MAIN NAVIGATION --><!-- BEGIN: USER TOOLS -->
<?php if ($tmpTools->getParam(JA_TOOL_USER)) { ?>
<div id="ja-usertoolswrap">
<span class="ja-sitetool"> </span>
<div id="ja-usertools" style="width:<?php echo $ja_tool_width; ?>px">
<?php $tmpTools->genToolMenu($tmpTools->getParam(JA_TOOL_USER)); ?>
</div></div>
<?php } ?>
<!-- END: USER TOOLS --></div>
</div>
<!-- END: HEADER -->
Replace it with this:
<!-- BEGIN: HEADER -->
<div id="ja-headerwrap">
<div id="ja-headerm">
<div id="ja-headerl">
<div id="ja-headerr">
<div id="ja-header" class="clearfix"><?php
$siteName = $tmpTools->sitename();
if ($tmpTools->getParam('logoType')=='image') { ?>
<h1 class="logo">
<a href="index.php" title="<?php echo $siteName; ?>"><span><?php echo $siteName; ?></span></a>
</h1>
<?php } else {
$logoText = (trim($tmpTools->getParam('logoText'))=='') ? $config->sitename : $tmpTools->getParam('logoText');
$sloganText = (trim($tmpTools->getParam('sloganText'))=='') ? JText::_('SITE SLOGAN') : $tmpTools->getParam('sloganText'); ?>
<h1 class="logo-text">
<a href="index.php" title="<?php echo $siteName; ?>"><span><?php echo $logoText; ?></span></a>
</h1>
<p class="site-slogan"><?php echo $sloganText;?></p>
<?php } ?><?php if($this->countModules('user4')) : ?>
<div id="ja-search">
<jdoc:include type="modules" name="user4" />
</div>
<?php endif; ?><?php if ($this->countModules('top')) { ?>
<div id="ja-login">
<jdoc:include type="modules" name="top" style="raw" />
</div>
<?php } ?><!-- BEGIN: MAIN NAVIGATION -->
<div id="ja-mainnav" class="clearfix">
<?php $jamenu->genMenu (0); ?>
</div>
<!-- END: MAIN NAVIGATION --><!-- BEGIN: USER TOOLS -->
<?php if ($tmpTools->getParam(JA_TOOL_USER)) { ?>
<div id="ja-usertoolswrap">
<span class="ja-sitetool"> </span>
<div id="ja-usertools" style="width:<?php echo $ja_tool_width; ?>px">
<?php $tmpTools->genToolMenu($tmpTools->getParam(JA_TOOL_USER)); ?>
</div></div>
<?php } ?>
<!-- END: USER TOOLS --></div>
</div> </div>
</div></div>
<!-- END: HEADER -->Then find this:
<style type="text/css">
#ja-header,
#ja-subnav,
#ja-container,
#ja-botsl,
#ja-footer {
width: <?php echo $tmpWidth; ?>;
margin: 0 auto;
}</style>
And add this:
#ja-headerm,
So the code will look like this:
<style type="text/css">
#ja-headerm,
#ja-header,
#ja-subnav,
#ja-container,
#ja-botsl,
#ja-footer {
width: <?php echo $tmpWidth; ?>;
margin: 0 auto;
}</style>
Save the file.
Then open up the template.css file and add this at the very bottom:#ja-headerm {
background:url(../images/m.jpg) repeat-x;
}
#ja-headerl {
background:url(../images/l.jpg) no-repeat 0 0;
}
#ja-headerr {
background:url(../images/r.jpg) no-repeat 100% 0;
}By doing the above you have a image called l.jpg stuck on the left side, a image called r.jpg stuck on the right side and the last image called m.jpg repeating below them.
I attached a image on how it will look(very simple images i used), but you get the idea.
beyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 20, 2008 at 12:57 pm #249891thanks but that is not what i want… forget about the 3 different piece’s… let’s just stick with 1 pix to lay across for the header… i dont want this to just cover the width of the site but the whole width of the screen….picture this the left side is blue and middle and right side are red… in my case my monitor is 1400px wide…. i want the header going across the whole width of my page…
Menalto FriendMenalto
- Join date:
- May 2007
- Posts:
- 4736
- Downloads:
- 0
- Uploads:
- 43
- Thanks:
- 2
- Thanked:
- 531 times in 361 posts
May 20, 2008 at 1:33 pm #249893Then you can just remove this one marked in red here and it should cover the whole screen:
<style type="text/css">
#ja-headerm,
#ja-header,
#ja-subnav,
#ja-container,
#ja-botsl,
#ja-footer {
width: <?php echo $tmpWidth; ?>;
margin: 0 auto;
}</style>
OR find this in the css file:
ja-headerwrap
you have a background image there allready, replace it with yours and youre set.
Maybe you need to change it to background: url(../images/yourimage) no-repeat 0 0; to make it stuck at top left and no repeat or anythingbeyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 20, 2008 at 1:49 pm #249894menalto thanks… i ended up doing a bit of a workaround… i just placed the pix here and took out the ” repeat-x ” to get the placement i was looking for… thanks for the help…
/* HEADER
——————————————————— */
#ja-headerwrap {
background: url(../images/m.png) repeat-x top #CC0000;
color: #CCCCCC;
line-height: normal;
height: 120px;
}
thanks again
treybeyondsports Friendbeyondsports
- Join date:
- May 2008
- Posts:
- 304
- Downloads:
- 0
- Uploads:
- 28
- Thanks:
- 4
- Thanked:
- 2 times in 1 posts
May 20, 2008 at 2:21 pm #249898hey when you get a chance take a look…http://unfl.beyondsportsnetwork.com/
can i pick your brain some more… under the unfl logo on the left if i wanted to place a pix in the white space / next to the all categories menu what would i need to do… since this is a football website– id like to place a football player there… or maybe at some point embed a flash object in that place? is that possible?
see the attached screenshot to see what i am talking about…thanks again for the help…trey
AuthorPostsViewing 12 posts - 1 through 12 (of 12 total)This topic contains 12 replies, has 3 voices, and was last updated by beyondsports 16 years, 6 months ago.
We moved to new unified forum. Please post all new support queries in our New Forum
Jump to forum