Help with wordpress theme

Discussion in 'HTML & Website Design' started by ricks, Jun 11, 2009.

  1. #1
    Want to paste an ad code in the header so that it appears in the empty white space in front of the blog title and description. ( Below subscribe link)

    View the theme in action: www dot vikasrikhye dot com

    The header:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes(); ?>>
    
    <head profile="http://gmpg.org/xfn/11">
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    
    <title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>
    
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
    <link rel="alternate" type="application/atom+xml" title="<?php bloginfo('name'); ?> Atom Feed" href="<?php bloginfo('atom_url'); ?>" />
    <link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    <!--[if IE 6]><script type="text/javascript" src="<?php bloginfo('template_url'); ?>/javascripts/basic.js"></script><script> DD_belatedPNG.fix('img, .sidebar li, #footer li');</script><![endif]-->
    <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>
    
    <?php wp_head(); ?>
    </head>
    
    <body>
    <div id="nav">
    	<div class="container">
    		<?php if (wp_list_pages('echo=0')) { ?>
    		<ul id="custom-pages">
    			<?php wp_list_pages('depth=2&title_li=0&sort_column=menu_order'); ?>			
    		</ul>
    		<? } ?>
    		<div id="rss">
    			<a href="<?php bloginfo('rss2_url'); ?>">subscribe</a> <a href="<?php bloginfo('rss2_url'); ?>"><img src="<?php bloginfo('template_url'); ?>/images/rss_icon.gif" class="icon" alt="RSS Feed" /></a>
    		</div>
    		<div style="clear:both"></div>
    	</div>
    </div>
    
    <div class="container">
    	<div id="header">
    		<div id="title">
    			<h1><a href="<?php bloginfo('url'); ?>/"><?php get_name(); ?></a></h1>
    			<p id="subtitle"><?php bloginfo('description'); ?></p>
    		</div>
    		<div style="clear:both"></div>
    	</div>
    	
    
    Code (markup):
    The Stylesheet

    /*
    Theme Name: The Essayist
    Description: A Wordpress theme for a more serious writer.
    Version: 1.3
    Author: squarefour LLC
    Author URI: http://www.squarefour.net
    Tags: tan, red, black, two-columns, fixed-width, threaded-comments, right-sidebar
    
    The Essayist is a classy, light theme (< 100k) for the more serious writer. Wigetized sidebar on the right
    and in the footer. Threaded comments are also built in as well to fuel deeper discussions.
    Tested in Firefox / IE6/7 / Safari. Designed by squarefour, but feel free
    to modify if needed.  All we ask is that you maintain our link in the footer.  Enjoy!
    */
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	outline: 0;
    	font-weight: inherit;
    	font-style: inherit;
    	font-size: 100%;
    	font-family: inherit;
    	vertical-align: baseline;
    }
    /* remember to define focus styles! */
    :focus {
    	outline: 0;
    }
    body {
    	line-height: 1;
    	color: #1F1F1F;
    	background:url('images/background.jpg');
    }
    ol, ul {
    	list-style: none; 
    }
    /* tables still need 'cellspacing="0"' in the markup */
    table {
    	border-collapse: separate;
    	border-spacing: 0;
    }
    caption, th, td {
    	text-align: left;
    	font-weight: normal;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
    	content: "";
    }
    blockquote, q {
    	quotes: "" "";
    }
    
    a {
    	color:#923737;
    	text-decoration:none;
    }
    
    a:hover {
    	text-decoration:underline;
    }
    
    em, i {
    	font-style:italic;
    }
    
    bold, strong {
    	font-weight:bold;
    }
    
    .bold {
    	font-weight:bold;
    }
    
    .italic {
    	font-style:italic;
    }
    
    th {
    	font-weight:bold;
    	text-align:center;
    }
    
    
    .container {
    	width:960px;	
    	margin:0 auto;
    }
    
    #nav {
    	color:#fff;
    	font-size:0.8em;
    	font-family:'Georgia';
    	font-style:italic;
    	line-height:28px;	
    	padding:0 10px;
    	background-color:#36322a;
    	min-height:28px;
    }
    
    #nav a {
    	color:#fff;
    }
    
    
    #nav ul#custom-pages {
    	float:left;
    	width:850px;	
    }
    
    #nav li {
    	float:left;	
    }
    
    #nav li a {
    	display:block;
    	padding-right:20px;
    }
    
    #nav li ul li a:hover {
      background-color: #fff;
    	color:#000;
      text-decoration: none;
    	border-bottom:1px #fff solid;
    }
    
    #nav li ul {
      list-style: none;
      position: absolute;
      width: 150px;
      left: -999em;
    }
    
    #nav li:hover ul {
      left: auto;	
    }
    
    #nav li:hover {
      position: static;
    }
    	
    #nav li li {
      float: left;
      margin: 0;
      padding: 0;
      width: 150px;
    }
    	
    #nav li li a {
      width: 150px;
      height: 24px;
    	display:block;
      line-height: 24px;
      color: #fff;
      border-bottom: 1px solid #131f27;
      background: #5C5A58;
      margin: 0;
      padding:6px 20px 6px 20px;
    }
    
    
    #nav #rss {
    	float:right;
    	text-transform:uppercase;
    	_position:relative;
    	_top:7px;
    }
    
    #nav img.icon {
    	position:relative;
    	top:2px;
    	padding-left:5px;
    }
    
    .container #content {
    	font-family:'Baskerville','Georgia';
    	clear:both;
    }
    
    .container .navigation {
    	clear:both;
    	margin:10px 0;
    }
    
    .navigation .alignleft {
    	float:left;
    }
    
    .navigation .alignright {
    	float:right;
    }
    
    img.centered {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    img.alignright {
    	padding: 4px;
    	margin: 0 0 1em 1em;
    	display: inline;
    }
    
    img.alignleft {
    	padding: 4px;
    	margin: 0 1em 1em 0;
    	display: inline;
    }
    	
    a img.alignright {
    	float:right; 
    	margin:0 0 1em 1em
    }
    
    a img.alignleft {
    	float:left; 
    	margin:0 1em 1em 0
    }
    
    a img.aligncenter {
    	display: block; 
    	margin-left: auto; 
    	margin-right: auto
    }
    
    #footer {
    	clear:both;	
    	background-color:#1e1b16;
    	margin-top:30px;
    	color: #e1d8b4;	
    }
    
    #footer #breaker {
    	background-color:#36322a;
    	height:20px;	
    	border-bottom:1px #444038 solid;
    }
    
    #footer .section {
    	float:left;
    	width:290px;	
    	font-size:0.8em;
    	margin:10px 0;
    	padding:0 15px;
    	line-height:22px;	
    	min-height:155px;
    }
    
    #footer #credits {
    	font-size:0.7em;
    	font-style:italic;
    	padding:10px 0;	
    }
    
    #footer li.left {
    	display:inline;
    }
    
    #footer a {
    	color:#e1d8b4;
    	font-weight:bold;
    }
    
    #footer a:hover {
    	text-decoration:underline;
    }
    
    #footer .footer h3 {
    	font-size:1.8em;
    	color:#f3c36f;
    	margin-bottom:20px;
    }
    
    #footer .footer img {
    	margin-right:11px;
    	margin-bottom:10px;
    	border:5px #fff solid;
    }
    
    input.button {		
    	height:38px;
    	width:150px;
    	border:0;
    }
    
    input.cancel {
    	background-color:brown;
    	color:#fff;
    }
    
    input.submit {
    	background-color:#76A52A;
    	color:#fff;
    }
    
    .wp-caption {
    	border: 1px solid #ddd;
    	text-align: center;
    	background-color: #f3f3f3;
    	padding-top: 4px;
    	margin: 10px;
    	-moz-border-radius: 3px;
    	-khtml-border-radius: 3px;
    	-webkit-border-radius: 3px;
    	border-radius: 3px;
    }
    
    .wp-caption img {
    	margin: 0;
    	padding: 0;
    	border: 0 none;
    }
    
    .wp-caption p.wp-caption-text {
    	font-size: 11px;
    	line-height: 17px;
    	padding: 0 4px 5px;
    	margin: 0;
    }
    
    .aligncenter,
    div.aligncenter {
       display: block;
       margin-left: auto;
       margin-right: auto;
    }
    
    .alignleft {
       float: left;
    }
    
    .alignright {
       float: right;
    }
    
    
    
    .container #header {
    	border-bottom:3px solid #E0D9B8;
    	width:960px;
    }
    
    .container #header #title a {
    	color:#000;
    }
    
    .container #header #title {
    	clear:both;
    	font-family:'Times','Georgia';
    	margin:18px 0 25px 0;
    	font-size:2.9em;
    	float:left;
    }
    
    .container #header #title #subtitle {
    	text-transform:uppercase;
    	font-size:9px;
    	text-align:right;
    	margin:5px 0;
    	letter-spacing:2px;
    	font-family:'Gill Sans', 'Verdana';
    }
    
    .container #header #twitter {
    	float:right;
    	width:450px;
    	line-height:22px;
    	margin:25px 0 35px 0;
    	text-align:right;	
    }
    
    .container #header #twitter #time {
    	font-size:11px;
    	font-style:italic;
    }
    
    .container #header #twitter #message {
    	font-size:14px;
    }
    
    #posts  {
    	margin:20px 0;
    }
    
    #posts #left {
    	float:left;
    	width:710px;
    	min-height:175px;
    	padding:0px 10px;
    	border-right:3px solid #E0D9B8;
    }
    
    #posts #left .date {
    	float:left;	
    	font-family:'Georgia';
    	width:50px;
    	height:51px;
    	text-align:center;
    	color:#848282;
    	line-height:26px;
    }
    
    #posts #left .date .background {
    	background:url('images/date_background.png') no-repeat top center;
    }
    
    #posts #left .date .day {
    	font-size:24px;
    	font-weight:bold;
    }
    
    #posts #left .date .month {
    	font-size:14px;
    	text-transform:uppercase;
    	letter-spacing:3px;
    }
    
    
    #posts #left .date-small {
    	float:left;
    	width:50px;
    	font-family:'Georgia';
    	height:32px;
    	text-align:center;
    	color:#848282;
    	line-height:15px;
    }
    
    #posts #left .date-small .background {
    	background:url('images/date_background_small.png') no-repeat top center;
    }
    
    #posts #left .date-small .day {
    	font-size:12px;
    	font-weight:bold;
    }
    
    #posts #left .date-small .month {
    	font-size:9px;
    	text-transform:uppercase;
    	letter-spacing:2px;
    }
    
    #posts #left .post {
    	clear:both;
    	margin:0px 0 40px 0;
    }
    
    #posts #left .post .detail {
    	float:left;
    	padding:0 15px 0 20px;
    	width:625px;
    }
    
    #posts #left .post .detail h1.title {
    	font-size:2.4em;
    	font-weight:bold;
    	font-variant:small-caps;
    	margin-bottom:5px;
    }
    
    #posts #left .post .detail h4.subtitle {
    	font-size:12px;
    	font-family:'Georgia','sans-serif';
    	float:left;	
    	width:498px;
    	line-height:18px;
    	font-style:italic;
    }
    
    #posts #left .post .detail div.comments {
    	font-size:12px;
    	font-family:'Georgia','sans-serif';
    	float:right;
    	font-style:italic;
    }
    
    #posts #left .post .detail .article {
    	clear:both;
    	font-size:14px;
    	margin-top:10px;	
    	line-height:22px;
    }
    
    #posts #left .post .detail-small {
    	float:left;
    	padding:0 15px 0 20px;
    	width:625px;
    }
    
    #posts #left .post .detail-small h1.title {
    	font-size:1.2em;
    	font-weight:bold;
    	font-variant:small-caps;
    	margin-bottom:5px;
    }
    
    #posts #left .post .detail-small h4.subtitle {
    	font-size:12px;
    	float:left;
    	width:498px;
    	line-height:18px;
    	font-family:'Georgia','sans-serif';
    	font-style:italic;
    }
    
    #posts #left .post .detail-small div.comments {
    	font-size:12px;
    	float:right;
    	font-family:'Georgia','sans-serif';
    	font-style:italic;
    }
    
    #posts #left .post .detail-small .article {
    	clear:both;
    	font-size:14px;
    	position:relative;
    	top:10px;	
    	line-height:22px;
    }
    
    #posts #right {
    	float:left;
    	padding-left:20px;
    	width:200px;		
    }
    
    .container .sidebar {
    }
    
    .container .sidebar div {
    	margin-bottom:35px;
    }
    
    .container .sidebar h3 {
    	color:#8d6218;
    	letter-spacing:2px;
    	font-size:0.8em;
    	padding-bottom:8px;
    	border-bottom:3px #e0d9b8 solid;
    	text-transform:uppercase;
    }
    
    .container .sidebar ul {
    	margin:10px 0;
    	font-size:0.9em;
    	line-height:22px;
    }
    
    .container .sidebar li {
    	background:url('images/star_icon.png') no-repeat center left;
    	padding-left:15px;	
    }
    
    .container .sidebar ul ul {
    	margin:0px 0 0 15px;
    }
    
    
    .container #search-bar {
    	clear:both;
    	margin-bottom:0px;
    }
    
    .container #search-bar #input {
    	float:left;
    	margin-bottom:20px;
    }
    
    .container #search-bar #icon, .container #search-bar #bar {
    	float:left;
    	margin-bottom:0;
    }
    
    .container #search-bar #icon {
    	float:left;
    	position:relative;
    	top:7px;
    	left:5px;
    }
    
    .container #search-bar #input input.field {
    	border:3px #ebe4d9 solid;
    	line-height:45px;
    	width:171px;
    	font-size:15px;
    	height:20px;
    	background-color:#f9f8f1;
    }
    
    .container #search-bar #date {
    	float:right;
    	line-height:45px;
    	font-weight:bold;
    	font-style:italic;
    	color:#737372;
    }
    
    .sidebar #calendar_wrap {
    	margin:10px 0;
    }
    
    .sidebar #calendar caption, .sidebar #wp-calendar caption {
    	text-align:center;
    	font-weight:bold;
    	margin-bottom:10px;
    }
    
    .sidebar table#wp-calendar {
    	border-spacing:1px 1px;
    }
    
    .sidebar table#wp-calendar td {
    	padding:6px;
    	text-align:center;
    	background-color:#D2CDB0;
    }
    
    .sidebar table#wp-calendar td#today {
    	background-color:#fff;
    }
    
    #footer li li { 
    	background:url('images/star_icon_white.png') no-repeat center left;
    	padding-left:15px;
    }
    
    #footer #calendar_wrap {
    	margin:10px 0;
    }
    
    #footer #calendar caption {
    	text-align:center;
    	font-weight:bold;
    	margin-bottom:10px;
    }
    
    #footer table#wp-calendar {
    	border-spacing:1px 1px;
    }
    
    #footer table#wp-calendar td {
    	padding:6px;
    	text-align:center;
    	background-color:#3F392F;
    }
    
    #footer table#wp-calendar td#today, #footer table#wp-calendar td#today a {
    	background-color:#fff;
    	color: #000;
    }
    
    #archive h2.pagetitle {
    	font-size:2.0em;
    	font-weight:bold;
    	margin:10px 0 20px 0;
    }
    
    
    .container #single #post {
    	border:4px #dad7cd solid;
    	background-color:#fff;
    	clear:both;
    }
    
    .container #single #post h2.title {
    	font-size:2.8em;
    	color:#8d6218;
    	font-family:'Georgia';
    	font-style:italic;
    	padding:15px;
    }
    
    .container #single #user-bar {
    	background-color:#f1efe8;
    	min-height:45px;
    	height:auto !important;
    	height:45px;
    	
    	line-height:45px;
    	padding:0 15px;
    	font-style:italic;
    }
    
    .container #single #user-bar #user {
    	float:left;
    	width:780px;
    }
    
    .container #single #user-bar #comment-no {
    	float:right;
    	_position:relative;
    	_top:15px;
    }
    
    .container #single #post .article {
    	padding:15px;
    	clear:both;
    	font-size:1.2em;
    	line-height:1.5em;
    	font-family:'Baskerville','Georgia';
    }
    
    .article blockquote, #extra #comments blockquote {
    	font-style:italic;
    	clear:both;
    	color:#666666;
    	font-size:0.9em;
    	font-family:'Georgia';
      margin:0 30px;
    }
    
    .article p {
    	margin:1em 0;
    	overflow:hidden;
    }
    
    .article img {
    }
    
    .article h1,
    .article h2,
    .article h3,
    .article h4,
    .article h5,
    .article h6 {
    	margin:20px 0;
    }
    
    .article h1 {
    	font-size:2.0em;	
    }
    .article h2 {
    	font-size:1.8em;
    }
    .article h3 {
    	font-size:1.4em;
    }
    .article h4 {
    	font-size:1.2em;
    }
    .article h5 {
    	font-size:1.0em;
    }
    
    .article h6 {
    	font-size:0.8em;
    }
    
    .article ol {
    	list-style-type:decimal;
    }
    
    .article li, #extra #comments .comment div li {
    	margin-left:45px;
    }
    
    .article ul, #extra #comments .comment div ul {
    	list-style-type:square;
    }
    
    .article table {
    	border-spacing:5px 5px;
    }
    
    .article table th {
    	background-color:#F1EFE8;
    	font-weight:bold;
    	text-align:center;
    	font-size:0.8em;
    	padding:2px 10px;
    }
    
    .article table td {
    	font-size:0.8em;
    }
    
    .article pre, #extra #comments pre, #extra #comments code {
    	white-space: pre-wrap;
    	white-space: -moz-pre-wrap !important;
    	white-space: -pre-wrap;
    	white-space: -o-pre-wrap;
    	word-wrap: break-word;
    	background-color:#F5F5F5;
    	border:1px #DADADA solid;
    	font-size:12px;
    	font-family:'Courier New', 'Courier';
    	padding:5px;
    	margin:10px 0;
    }
    
    #extra #comments .comment div li {
    	padding:0;
    }
    
    .container  .pagination {
    	float:right;
    	padding:10px 0 10px 10px;
    }
    
    
    #extra {
    	margin:10px 0;
    	clear:both;
    }
    
    #extra label {
    	width:85px;
    	float:left;
    }
    
    #extra input.field {
    	border: 1px solid #D4D4D4;
    	width:250px;
    	height:22px;
    	font-size:16px;
    }
    
    #extra textarea {
    	border: 1px solid #D4D4D4;
    	width:500px;
    	height:160px;
    }
    
    #extra #comment-reply div {
    	margin:20px 0;
    }
    
    #extra #comments h3 {
    	font-size:2.0em;
    }
    
    
    #extra #left {
    	border-right:3px solid #E0D9B8;
    	width:620px;
    }
    
    #extra #right {
    	width:325px;
    }
    
    #extra #left, #extra #right {
    	float:left;
    	min-height:295px;
    }
    
    #extra #reply-back {
    	text-align:right;
    	width:587px;
    }
    
    #extra .no-comments {
    	margin:10px 0;
    }
    
    #extra #feed-links {
    	
    	min-height:280px;
    	line-height:35px;
    	padding-left:15px;
    }
    
    #extra #feed-links p {
    	margin:0px 0 10px 0;
    }
    
    #extra #comments {
    	font-size:1.2em;	
    }
    
    #extra #comments ul li {
    	padding:15px;
    	margin:15px 0;
    	line-height:1.5em;
    }
    
    #extra #comments ul li p {
    	margin:10px 0 15px 0;
    	clear:both;
    }
    
    #extra #comments .comment-meta {
    	display:block;
    }
    #extra #comments .comment-author cite {
    	line-height:30px;
    	float:left;
    }
    
    #extra #comments ul li .comment-meta a {
    	font-size:0.7em;	
    	font-style:italic;	
    	
    }
    
    #extra #comments ul li .text {
    	line-height:28px;
    }
    
    #extra #comments ul li.even {
    	background-color:#EFEFE0;
    	border:3px solid #CFCFB5;
    }
    
    #extra #comments ul li.odd {
    	background-color:#fff;
    	border:3px solid #CFCFB5;
    }
    
    #extra #comments li.even img.avatar {
    	border:5px #fff solid;
    }
    
    #extra #comments li.odd img.avatar {
    	border:5px solid #CFCFB5;
    }
    
    #extra #comments ul.children li.even img.avatar {
    	border:5px #fff solid;
    }
    
    #extra #comments ul.children li.odd  img.avatar {
    	border:5px solid #CFCFB5;
    }
    
    #extra #comments blockquote {
    }
    
    #extra #comments .comment-author {
    	margin-bottom:5px;	
    	font-size:24px;
    }
    
    #extra img.avatar {
    	float:left;
    	height:48px;
    	width:48px;
    	margin-right:10px;
    }
    Code (markup):
    I thought of these modifications , but was not sure.

    For header:

    <div id="rightsidead">
    
    Paste Ad code
    
    </div>
    Code (markup):
    For stylesheet:

    #rightsidead {
    float : right;
    width : 500px;
    overflow : hidden;
    margin-top : -85px;
    padding-left : 300px;
    position: relative;
    z-index:1000;
    }
    Code (markup):
    It that OK? If yes then where exactly should the codes be pasted? If no then what will be a better option.

    Kindly Guide, Thanks.
     
    ricks, Jun 11, 2009 IP