Developing (v7+)

header.php help

Permalink February 13, 2013 at 1:50 PM

Hi.

Don't know what I'm doing wrong, but my social icons in the right corner won't link to external sites. I'm scratching my head but not enough I guess. :0) Can any body help please?

Here is the code:

<?php  defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<!-- Site Header Content //-->
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
<?php  Loader::element('header_required'); ?>
</head>
<body>
<div id="page">
<br />
<br />
<div id="headerSpacer"></div>

Viewing 15 lines of 82 lines. View entire code block.

 
<?php  defined('C5_EXECUTE') or die(_("Access Denied.")); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
 
<!-- Site Header Content //-->
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('main.css')?>" />
<link rel="stylesheet" media="screen" type="text/css" href="<?php echo $this->getStyleSheet('typography.css')?>" />
 
<?php  Loader::element('header_required'); ?>
 
</head>
<body>
<div id="page">
<br />
<br />
<div id="headerSpacer"></div>
<div id="header">
 
      <?php  if ($c->isEditMode()) { ?>
      <div style="min-height: 80px">
      <?php  } ?>
      <table width="104" border="0" align="right" cellpadding="0" cellspacing="0">
          <tr>
            <td><table border="0" cellspacing="0" cellpadding="0" width="140" align="right">
              <tbody>
                <tr>
                  <td width="28"><a title="Graviton Music Services Facebook" href="https://www.facebook.com/GravitonMusicServices" target="_blank"><img src="http://graviton-musicservices.com/themes/gms/images/facebook_32.png" border="0" alt="Facebook" width="28" height="28" /></a></td>
                  <td width="10"> </td>
                  <td width="28"><a title="Graviton Music Services MySpace" href="http://www.myspace.com/gravitonmusicservices" target="_blank"><img src="http://graviton-musicservices.com/themes/gms/images/myspace_32.png" border="0" alt="Myspace" width="28" height="28" /></a></td>
                  <td width="10" align="right" valign="bottom"> </td>
                  <td width="28"><a title="Graviton Music Services Twitter" href="http://www.twitter.com/GravitonMS" target="_blank"><img src="http://graviton-musicservices.com/themes/gms/images/twitter_32.png" border="0" alt="Twitter" width="28" height="28" /></a></td>
                  <td width="10"> </td>
                  <td width="28"><a title="Graviton Music Services Youtube Channel" href="http://www.youtube.com/user/GravitonMusicService" target="_blank"><img src="http://graviton-musicservices.com/themes/gms/images/youtube_32.png" border="0" alt="Youtube" width="28" height="28" /></a></td>
                </tr>
              </tbody>
            </table></td>
          </tr>
          <tr>
            <td> </td>
          </tr>
          <tr>
            <td><table border="0" cellspacing="0" cellpadding="0" width="140" align="right">
                <tbody>
                  <tr>
                    <td width="28"> </td>
                    <td width="10"> </td>
                    <td width="28"> </td>
                    <td width="10"> </td>
                    <td width="28"> </td>
                    <td width="10"> </td>
                    <td width="28"> </td>
                  </tr>
                </tbody>
            </table></td>
          </tr>
        </table>
      <div id="headerNav">
         <?php 
         $a = new Area('Header Nav');
         $a->display($c);
         ?>
      </div>
 
      <span id="logo"><a href="http://www.graviton-musicservices.com/"><img src="<?php echo $this->getThemePath()?>/images/logo.png" title="Graviton Music Services" alt="Graviton Music Services" /></a></span>
      <?php 
      // we use the "is edit mode" check because, in edit mode, the bottom of the area overlaps the item below it, because
      // we're using absolute positioning. So in edit mode we add a bit of space so everything looks nice.
      ?>
 
      <div class="spacer"></div>
 
      <?php  if ($c->isEditMode()) { ?>
     </div>
    <?php  } ?>
 
      <div id="header-area">
         <div class="divider"></div>
         <div id="header-area-inside">
         <?php          
         $ah = new Area('Header');
         $ah->display($c);         
         ?>   
         </div>   
 
         <?php  if ($ah->getTotalBlocksInArea() > 0) { ?>
            <div class="divider"></div>
         <?php  } ?>
      </div>
</div>

Thank you in advance.

M

Kurtopsy replied on Feb 13, 2013 at 1:54 pm Permalink Reply

In the sitemap you can click on a page and at the bottom you can add an external link.

graviton replied on Feb 13, 2013 at 2:16 pm Permalink Reply

Hi Kurtopsy,

thanx for fast help.
Can you go more in to details please?

Thank you for you time man!

M

Kurtopsy replied on Feb 13, 2013 at 2:25 pm Permalink Reply

Hi graviton,

When you make the external link you can name it. The URL will look like this... yourDomain.com/externalLinkName

Looks like you're hard coding this, so just put that in your href.

diorist replied on Feb 13, 2013 at 2:15 pm Permalink Reply

Can you provide a link to the live page? It'd be helpful to see what's displaying, in addition to what's behind it.

graviton replied on Feb 13, 2013 at 2:24 pm Permalink Reply

Hi diorist,

sure, here is the link:

http://www.graviton-musicservices.com/index.php...

Thanx for help.

graviton replied on Feb 13, 2013 at 2:37 pm Permalink Reply

I'm still chasing my own tale... :(

Kurtopsy replied on Feb 13, 2013 at 2:50 pm Permalink Reply

So hard coding it doesn't work?? Plan B: Make it an area, put a content block in and add the image. Click the image and click the add link button. Choose the external link you created earlier.

graviton replied on Feb 13, 2013 at 2:43 pm Permalink Reply

It's weird, cause in footer is working ok...

irsah replied on Feb 13, 2013 at 2:46 pm Permalink Reply

Hi,

Wow you guys are fast.. Nice site.. but I think your header nav div is position on top (overlapping) your logo/banner/social icons div/table.

Try to reduce height or remove it and see what happens... *edit* I Mean comment it out with a test page...

graviton replied on Feb 13, 2013 at 2:55 pm Permalink Reply

Hi irsah,

thanx for help. I'm scratching my head how to do it right...

irsah replied on Feb 13, 2013 at 2:56 pm Permalink Best Answer Reply

I think the Fb iframe is overlapping... because your search bar works...

graviton replied on Feb 13, 2013 at 3:07 pm Permalink Reply

You were right man! Fb iframe is overlapping!
Thanx amigo!

irsah replied on Feb 13, 2013 at 3:10 pm Permalink Reply

Your Welcome.. glad to help out...

diorist replied on Feb 13, 2013 at 3:17 pm Permalink Reply

I think this would fix it:

#page #header #headerNav {
overflow: visible;
position: absolute;
right: 0;
top: 40px;
width: 100%;
z-index: 2;
}

#headernav iframe element.style {
border: medium none;
float: left;
height: 80px;
width: 450px;
}

graviton replied on Feb 13, 2013 at 3:26 pm Permalink Reply

paste into main.css?

diorist replied on Feb 13, 2013 at 3:35 pm Permalink Reply

#page #header #headerNav is in main.css. The iframe style is defined in the element itself.

graviton replied on Feb 13, 2013 at 3:34 pm Permalink Reply

We are getting there... would be perfect if we can get Fb like more to the top...

diorist replied on Feb 13, 2013 at 3:41 pm Permalink Reply 1 Attachment

Not sure what you mean. Granted, though, I only tested in FF. In that browser, with the style changes ( plus another 20 on the #headernav top spacing), your buttons look aligned. The FB button just opens a new tab. See attached ss.

graviton replied on Feb 13, 2013 at 3:50 pm Permalink Reply 1 Attachment

hm, I tested in Firefox, Chrome and Opera, and all are showing the same, please check the attachment picture. I used your code for main.css.

Is it possible to hardcode like_button block somehow that it wont overlap social icons?

diorist replied on Feb 13, 2013 at 4:20 pm Permalink Reply

Oh, right. Forgot to pause Ghostery...seeing it now.

Can you put the fb Like button in the same table as the other social icons? That should separate them and align them automatically, right? Plus, it would put fb like in a different div than your search box.

I may be thinking about this wrong, but the problem seems to be that, if the search is aligned right and fb like is aligned top, that div is always gonna overlap and obscure the links in your other buttons.

irsah replied on Feb 13, 2013 at 5:39 pm Permalink Reply

Yes, agreed here... good point.. should take in consideration.

graviton replied on Feb 14, 2013 at 3:11 pm Permalink Reply

Thanx for your time guys.

I simple redesign template by removing soc. icons at the top of the site. Not as I planed, but you have to compromise sometimes...

Thanx agin,

M.

Forums

Developing (v7+)

header.php help

Code

Post Reply

Delete Post

Mark Post as Spam

Destroy Spammer

Sign In?