Replacing Site Name with Logo
Permalink
I'm working on a small, 5-page site using the Plain Yogurt (default) theme. This should be a simple matter, but I haven't been able to solve a problem I'm having, even though I tried everything suggested in the forums about a month ago. So, since I need to sort this out, I'm asking again for help (and thank you in advance!).
Here's the issue: I wanted to replace the site name with a logo, and changed the header file to do that. Here's the problem: While the logo shows up on page one, only a box with "logo" and an "X" shows up on the other four pages. To complicate this, when I'm in EDIT mode, I actually do see the logo graphic on all five individual pages. However, when I log out of EDIT mode, I'm back to the "X". I had a tech look at this, and he couldn't figure it out either. Any ideas on how to fix this?
Here's what I currently have in the HEADER file:
<?php defined('C5_EXECUTE') or die("Access Denied."); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<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">
<div id="headerSpacer"></div>
<div id="header">
<?php if ($c->isEditMode()) { ?>
<div style="min-height: 80px">
<?php } ?>
<div id="headerNav">
<?php
$a = new Area('Header Nav');
$a->display($c);
?>
</div>
<img src="SRGWEBSITELOGO.gif" alt="Logo" />
<?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>
Here's the issue: I wanted to replace the site name with a logo, and changed the header file to do that. Here's the problem: While the logo shows up on page one, only a box with "logo" and an "X" shows up on the other four pages. To complicate this, when I'm in EDIT mode, I actually do see the logo graphic on all five individual pages. However, when I log out of EDIT mode, I'm back to the "X". I had a tech look at this, and he couldn't figure it out either. Any ideas on how to fix this?
Here's what I currently have in the HEADER file:
<?php defined('C5_EXECUTE') or die("Access Denied."); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<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">
<div id="headerSpacer"></div>
<div id="header">
<?php if ($c->isEditMode()) { ?>
<div style="min-height: 80px">
<?php } ?>
<div id="headerNav">
<?php
$a = new Area('Header Nav');
$a->display($c);
?>
</div>
<img src="SRGWEBSITELOGO.gif" alt="Logo" />
<?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>
Good morning. Thanks so much for the quick response. I should have mentioned in my first post that I already tried what you suggest but, oddly, I don't have a "Global Scrapbook." It literally doesn't exist. Weird, and I have no idea why. That's why I went for the coding.
Hi,
you can create a new scrapbook named - Global
and follow the above steps.
or
You can use background property in CSS for id- header or headerspace
you can create a new scrapbook named - Global
and follow the above steps.
or
You can use background property in CSS for id- header or headerspace
Thank you so much! It was absurdly easy once I had your instructions. I'd been under the impression the "Global Scrapbook" was either present or not within the software at start, and so didn't realize I could simply add it. Can't believe I went to all the other effort. Anyway, thanks thanks THANKS as the problem is solved!
You need not to change any code to replace your sitename with logo.
Just follow the steps given below,
1. Go to dashboard ===> Scrapbook.
2. Click on the link to Global Scrapbook
3. You will see an item with
Content: "My_Site_Name".
Click on "Delete" link against it.
4. You can see a button "Add block to scrapbook" on the top
5. Click on it and select => Image
6. Add and upload your logo image.
7. Now you can see the logo in the global scrapbook.
8. And name it as "My_Site_Name".
thats it, you are done.