Webmaster Forum

Go Back   Webmaster Forum > Web Development > Blogging Forum

Blogging Forum Discuss general blogging issues here - design, integration, posting, trackbacks, ETC. Also discuss blogs you like.


Reply
 
Thread Tools Display Modes
Share |
  #1  
Old 03-03-2006, 08:23 AM
Julie's Avatar
Julie Julie is offline
v7n Mentor
 
Join Date: 02-23-04
Location: Ohio
Posts: 11,127
iTrader: 0 / 0%
modifying template

Ok, here's the blog in question.

See the header that says "Blogging Blogs"? I want to change that header image to something other than just a boring old rectangular box. I want to maybe stick in a couple banners next to the title or something.... or create a custom header with images and stuff. How would I alter the header code to do this?
 
Reply With Quote

Advertisement

Advertisement

  #2  
Old 03-03-2006, 02:25 PM
JuggoPop's Avatar
JuggoPop JuggoPop is offline
Senior Member
 
Join Date: 10-09-03
Posts: 4,278
iTrader: 0 / 0%
first the link is here: http://googlibrarian.blogspot.com (had an extra quote)

I can answer your question, but I need you to post a copy of the template code here. I used to use blogger and understand all that jazz, but I don't remember how that template looks off-hand. (code wise)
 
Reply With Quote
  #3  
Old 03-03-2006, 02:29 PM
Julie's Avatar
Julie Julie is offline
v7n Mentor
 
Join Date: 02-23-04
Location: Ohio
Posts: 11,127
iTrader: 0 / 0%
Oopps. Sorry about that.

Here's the code:


</div>

<p class="post-footer">

<em>posted by <$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em> &nbsp;
<BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentF ormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
<$BlogItemControl$>
</p>

</div>

<!-- End .post -->

<!-- Begin #comments -->
<ItemPage>

<div id="comments">

<BlogItemCommentsEnabled><a name="comments"></a>

<h4><$BlogItemCommentCount$> Comments:</h4>

<dl id="comments-block">
<BlogItemComments>

<dt class="comment-data" id="c<$BlogCommentNumber$>"><a name="c<$BlogCommentNumber$>"></a>

At <a href="#c<$BlogCommentNumber$>" title="comment permalink"><$BlogCommentDateTime$></a>,

<$BlogCommentAuthor$> said...

</dt>

<dd class="comment-body">

<p><$BlogCommentBody$></p>
<$BlogCommentDeleteIcon$>

</dd>

</BlogItemComments>

</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>

</BlogItemCommentsEnabled>
<BlogItemBacklinksEnabled>
<a name="links"></a><h4>Links to this post:</h4>
<dl id="comments-block">
<BlogItemBacklinks>
<dt class="comment-title">
<$BlogBacklinkControl$>
<a href="<$BlogBacklinkURL$>" rel="nofollow"><$BlogBacklinkTitle$></a> <$BlogBacklinkDeleteIcon$>
</dt>
<dd class="comment-body"><$BlogBacklinkSnippet$>
<br />
<span class="comment-poster">
<em>posted by <$BlogBacklinkAuthor$> @ <$BlogBacklinkDateTime$></em>
</span>
</dd>
</BlogItemBacklinks>
</dl>
<p class="comment-timestamp"><$BlogItemBacklinkCreate$></p>
</BlogItemBacklinksEnabled>


<p style="padding-left:20px;">
<a href="<$BlogURL$>">&lt;&lt; Home</a>
</p>
</div>

</ItemPage>

<!-- End #comments -->

</Blogger>



</div></div></div>

<!-- End #main -->









<!-- Begin #sidebar -->

<div id="sidebar">

<!-- Begin #profile-container -->
<center><a href="http://www.internet-marketing-blog.com/2006/03/01/clean-up-on-aisle-three/"><img src="http://www.googlelibrarian.com/images/green.gif" border="0"></a></center>
<br>
<script src="http://mapstats.blogflux.com/button.js.php?id=15411" language="JavaScript" type="text/javascript"></script>
<noscript><a href="http://mapstats.blogflux.com/15411.html"><img src="http://mapstats.blogflux.com/button.php?id=15411" alt="Blog Flux MapStats: Stats and Counter for Blogging Blogs" border="0" /></a></noscript>
<!-- End #profile -->



<!-- Begin .box -->

<div class="box"><div class="box2"><div class="box3">

<MainOrArchivePage>
<h2 class="sidebar-title">Notice:</h2>
The Google Librarian blog has moved to the <a href="http://www.googlelibrarian.com/wordpress">Google Librarian</a> website. Please update your bookmarks.
<br>
<h2 class="sidebar-title">My Stuff</h2>
<ul>
<li><a href="http://www.googlelibrarian.com">Google Librarian</a></li>
<li><a href="http://www.googlelibrarian.com/wordpress">Librarian Blog</a></li>
<li><a href="http://www.googlepages.us">Google Pages</a></li>
<li><a href="http://www.oasis-news.com">Oasis News</a></li>
</ul>

<h2 class="sidebar-title">Cool Blogs</h2>
<ul>

<li><a href="http://www.internet-marketing-blog.com">John Scott's IMB</a></li>
<li><a href="http://www.n7v.net/v7ndotcom-elursrebmem/">NeO Blog</a></li>
<li><a href="http://www.toddw.info">Todd W</a></li>
<li><a href="http://www.mystical-twilight.com/">Colleen's Wordpress Themes</a></li>
<li><a href="http://trappercase.wordpress.com">The Trap</a></li>
<li><a href="http://www.juggopop.com">JuggoPop's Worthless Blog</a></li>
</ul>
<h2 class="sidebar-title">Recommended Sites</h2>
<ul>

<li><a href="http://www.v7n.com">v7n</a></li>
<li><a href="http://www.doseuk.com/">Funny Slogan T-Shirts</a></li>
<li><a href="http://crackheadlighters.com/">Crazy T-Shirts</a></li>


</ul>
</MainOrArchivePage>

<h2 class="sidebar-title">Previous Posts</h2>
<ul id="recently">
<BloggerPreviousItems>
<li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItem Title$></a></li>
</BloggerPreviousItems>
</ul>

<MainOrArchivePage>
<h2 class="sidebar-title">Archives</h2>
<ul class="archive-list">
<BloggerArchives>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</BloggerArchives>
<ArchivePage><li><a href="<$BlogURL$>">Current Posts</a></li></ArchivePage>

</ul>
</MainOrArchivePage>


<!--

<p>This is a paragraph of text that could go in the sidebar.</p>

-->

</div></div></div>

<!-- End .box -->




</div>

<!-- End #sidebar -->









<!-- Begin #footer -->

<div id="footer"><div><div><hr />



<p><!-- This is an optional footer. If you want text here, place it inside these tags, and remove this comment. -->&nbsp;</p>



</div></div></div>

<!-- End #footer -->








</div>

<!-- End #content -->



</body>

</html>
 
Reply With Quote
  #4  
Old 03-03-2006, 03:13 PM
JuggoPop's Avatar
JuggoPop JuggoPop is offline
Senior Member
 
Join Date: 10-09-03
Posts: 4,278
iTrader: 0 / 0%
your missing some of it... starts with the closing of a division tag

also, put it in code brackets...

Code:
like this (if you don't mind)
(the mods might care)
 
Reply With Quote
  #5  
Old 03-03-2006, 03:21 PM
Julie's Avatar
Julie Julie is offline
v7n Mentor
 
Join Date: 02-23-04
Location: Ohio
Posts: 11,127
iTrader: 0 / 0%
Sorry about that. I didn't know about the code option. It must have cut off some of it on default or something. Blah, and now it won't let me post it all in here.. says the message is too long.

Here's the code for my template attached:
Attached Files
File Type: txt templatecode.txt (15.6 KB, 191 views)
 
Reply With Quote
  #6  
Old 03-03-2006, 03:46 PM
JuggoPop's Avatar
JuggoPop JuggoPop is offline
Senior Member
 
Join Date: 10-09-03
Posts: 4,278
iTrader: 0 / 0%
If you want to change the grey box at the top to another color to use as your bg of the header change this:

Code:
/* Blog Header ----------------------------------------------- */ @media all { #header { background:#456 url("http://www.blogblog.com/rounders/corners_cap_top.gif") no-repeat left top; margin:0 0 0; padding:8px 0 0; color:#fff; } #header div { background:url("http://www.blogblog.com/rounders/corners_cap_bot.gif") no-repeat left bottom; padding:0 15px 8px; } } @media handheld { #header { background:#456; }
You need to change the hex value and if you want to keep the corners rounded you will need to edit the two corners_cap images and then change the ref url.

I used this type of layout once and just got rid of the bg color and the rounded images, but I replaced the whole header with one image... which I don't think you want to do.

You will also need to edit this area:

Code:
<!-- Blog Header --> <div id="header"><div> <h1 id="blog-title"> <ItemPage><a href="<$BlogURL$>"></ItemPage> <$BlogTitle$> <ItemPage></a></ItemPage> </h1> <p id="description"><$BlogDescription$></p> </div></div>
If I remember correctly you can just place your logo and banner codes between the DIV tags. Be sure to link your logo the same way they linked the title in the above code. (replacing <$BlogTitle$> with the image but keeping the <ItemPage> tags and the href that they used.

That should do it. Hope that helps.
 
Reply With Quote
  #7  
Old 03-04-2006, 08:24 AM
Julie's Avatar
Julie Julie is offline
v7n Mentor
 
Join Date: 02-23-04
Location: Ohio
Posts: 11,127
iTrader: 0 / 0%
Awesome...thanks!!!
 
Reply With Quote
Go Back   Webmaster Forum > Web Development > Blogging Forum

Reply


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Modifying Adsense stacy131 Contextual Networks 8 01-18-2009 04:26 AM
Modifying a (old) large Database Rick(4)F. Coding Forum 3 04-06-2007 12:50 PM
Modifying php bb forum realestate Web Design Lobby 9 07-30-2004 04:50 PM
Modifying DreamWeaver? LazyJim Web Design Lobby 2 01-19-2004 10:31 AM


V7N Network
Get exposure! V7N I Love Photography V7N SEO Blog V7N Directory


All times are GMT -7. The time now is 03:55 AM.
Powered by vBulletin
Copyright 2000-2014 Jelsoft Enterprises Limited.
Copyright © 2003 - 2018 VIX-WomensForum LLC