Insert HTML on Image's Header

CMS & WordPress
1

I’m trying to insert HTML code into wordpress header on elementalsliving.com. The HTML is a sign-up for email newsletter and the code from third party provider. Position for HTML is around top-left of header, same like shop’s logo on right’s header. How do to insert on wordpress header?
Please help me…

Here’s the HTML code:

<!-- BEGIN: Constant Contact Square Email List Button --> <div align="center"> <table width="100" border="0" cellpadding="0" cellspacing="0"> <tr> <td><img src="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tl_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_tl_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_tl_purp.gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_tl_<WBR>purp.gif</a>" width="6" height="6" alt=""></td> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_top_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_top_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_top_purp.gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>top_purp.gif</a>"<WBR>> </td> <td><img src="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_tr_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_tr_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_tr_purp.gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_tr_<WBR>purp.gif</a>" width="6" height="6" alt=""></td> </tr> <tr> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_left_purp.gif</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>left_purp.gif</a><WBR>" width="6"></td> <td bgcolor="#660099" align="center" style="padding:10px;"><a href="<a href="<a href="<a href="<a rel="nofollow" target="_blank" href="http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072">http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">constantcontact.com/d.jsp?llr=</a><WBR>yexh4jdab&p=oi&m=1103067602072</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>" target="_blank">http://<WBR>visitor.r20</a>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">http://constantcontact.com/d.jsp?llr=</a>" target="_blank">constantconta<WBR><a rel="nofollow" target="_blank" href="http://ct.com/d.jsp?llr=">ct.com/d.jsp?llr=</a></a><WBR><WBR>yexh4jdab&p=oi&m=<WBR>1103067602072</a><WBR>"><a href="<a href="<a rel="nofollow" target="_blank" href="http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072">http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">constantcontact.com/d.jsp?llr=</a><WBR>yexh4jdab&p=oi&m=1103067602072</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>" target="_blank">http://<WBR>visitor.r20</a>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">http://constantcontact.com/d.jsp?llr=</a>" target="_blank">constantconta<WBR><a rel="nofollow" target="_blank" href="http://ct.com/d.jsp?llr=">ct.com/d.jsp?llr=</a></a><WBR><WBR>yexh4jdab&p=oi&m=<WBR>1103067602072</a><WBR></a>" target="_blank" style="text-decoration:none; font-weight: bold;  font-family:Arial; font-size:13px; color:#FFFFFF;" width="188">Join Our Email List</a></td> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_right_purp.<WBR>gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>right_purp.<WBR>gif</a>" width="6"></td> </tr> <tr> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_left_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_left_purp.gif</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>left_purp.gif</a><WBR>"></td> <td bgcolor="#660099"align="right"<WBR><WBR>><div  style="margin-top:2"><a href="<a href="<a href="<a href="<a rel="nofollow" target="_blank" href="http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072">http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">constantcontact.com/d.jsp?llr=</a><WBR>yexh4jdab&p=oi&m=1103067602072</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>" target="_blank">http://<WBR>visitor.r20</a>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">http://constantcontact.com/d.jsp?llr=</a>" target="_blank">constantconta<WBR><a rel="nofollow" target="_blank" href="http://ct.com/d.jsp?llr=">ct.com/d.jsp?llr=</a></a><WBR><WBR>yexh4jdab&p=oi&m=<WBR>1103067602072</a><WBR>"><a href="<a href="<a rel="nofollow" target="_blank" href="http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072">http://visitor.r20.constantcontact.com/d.jsp?llr=yexh4jdab&p=oi&m=1103067602072</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">constantcontact.com/d.jsp?llr=</a><WBR>yexh4jdab&p=oi&m=1103067602072</a><WBR>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="http://visitor.r20">http://visitor.r20</a>" target="_blank">http://<WBR>visitor.r20</a>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/d.jsp?llr=">http://constantcontact.com/d.jsp?llr=</a>" target="_blank">constantconta<WBR><a rel="nofollow" target="_blank" href="http://ct.com/d.jsp?llr=">ct.com/d.jsp?llr=</a></a><WBR><WBR>yexh4jdab&p=oi&m=<WBR>1103067602072</a><WBR></a>" target="_blank" style="text-decoration:none; font-weight:bold;  font-family:Arial; font-size:10px; color:#ffffff;">» JOIN NOW</a></div></td> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_right_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_right_purp.<WBR>gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>right_purp.<WBR>gif</a>"></td> </tr> <tr> <td><img src="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bl_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bl_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bl_purp.gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bl_<WBR>purp.gif</a>" width="6" height="6" alt=""></td> <td background="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_bottom_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_bg_bottom_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_bg_bottom_purp.<WBR>gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_bg_<WBR>bottom_purp.<WBR>gif</a>"> </td> <td><img src="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images/visitor/bevel_br_purp.gif">https://imgssl.constantcontact.com/ui/images/visitor/bevel_br_purp.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">constantcontact.com/ui/images/</a><WBR>visitor/bevel_br_purp.gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/images/">http://constantcontact.com/ui/images/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images/</a><WBR>visitor/bevel_br_<WBR>purp.gif</a>" width="6" height="6" alt=""></td> </tr> </table> </div> <!-- END: Constant Contact Square Email List Button --> <!-- BEGIN: SafeSubscribe --> <div align="center" style="padding-top:5px;"> <img src="<a href="<a href="<a rel="nofollow" target="_blank" href="https://imgssl.constantcontact.com/ui/images1/safe_subscribe_logo.gif">https://imgssl.constantcontact.com/ui/images1/safe_subscribe_logo.gif</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a><WBR>images1/safe_subscribe_logo.<WBR>gif</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a>" target="_blank"><a rel="nofollow" target="_blank" href="https://imgssl">https://imgssl</a></a><WBR>.<WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">http://constantcontact.com/ui/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/ui/">constantcontact.com/ui/</a></a><<WBR>WBR>images1/safe_subscribe_<WBR>logo.<WBR>gif</a>" border="0" width="168" height="14" alt=""/> </div> <!-- END: SafeSubscribe --> <!-- BEGIN: Email Marketing you can trust --> <div align="center" style="font-family:Arial,<WBR><WBR>Helvetica,sans-serif;font-<<WBR>WBR>size:10px;color:#999999;"> For <a href="<a href="<a href="<a href="<a rel="nofollow" target="_blank" href="http://www.constantcontact.com/jmml/email-marketing.jsp">http://www.constantcontact.com/jmml/email-marketing.jsp</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://www">http://www</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/jmml/">constantcontact.com/jmml/</a><WBR>email-marketing.jsp</a>" target="_blank"><a href="<a rel="nofollow" target="_blank" href="http://www">http://www</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://www">http://www</a></a>.<<WBR>WBR><a href="<a rel="nofollow" target="_blank" href="http://constantcontact.com/jmml/">http://constantcontact.com/jmml/</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://constantcontact.com/jmml/">constantcontact.com/jmml/</a></a><<WBR>WBR>email-marketing.jsp</a>"><<WBR>a href="<a href="<a rel="nofollow" target="_blank" href="http://www.constantcontact.com/jmml/email-marketing.jsp">http://www.constantcontact.com/jmml/email-marketing.jsp</a>" target="_blank"><a rel="nofollow" target="_blank" href="http://www">http://www</a>.<WBR><a rel="nofollow" target="_blank" href="http://constantcontact.com/jmml/">constantcontact.com/jmml/</a><WBR>email-marketing.jsp</a>" target="_blank">http://<WBR><a href="<a rel="nofollow" target="_blank" href="http://www.constantcontact.com/jmml/">http://www.constantcontact.com/jmml/</a>" target="_blank">ww<WBR><a rel="nofollow" target="_blank" href="http://w.constantcontact.com/jmml/">w.constantcontact.com/jmml/</a></a><<WBR>WBR>email-marketing.jsp</a></<WBR>a>" style="text-decoration:none;<<WBR>WBR>font-family:Arial,<WBR>Helvetica,<WBR>sans-serif;<WBR>font-size:10px;<WBR>color:#<WBR>999999;" target="_blank">Email Marketing</a> you can trust </div> <!-- END: Email Marketing you can trust -->

Here’s the header:

<?php wp_head(); ?>

</head>

<body>
<a href="http://shop.elementalshealthfood.com/" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/elementals_sticker.png" border="0" alt=" " style="position:absolute; z-index:5; top:0px; left: 50%; margin-left:375px;" /></a>
<div id="global_container">
	<img src="<?php bloginfo('template_directory'); ?>/images/header_topleft2.jpg" border="0" alt=" " /><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/header_logo2.jpg" border="0" alt="Pathways Medical and Holistic Centers" /></a><img src="<?php bloginfo('template_directory'); ?>/images/header_topright2.jpg" border="0" alt=" " /><?php include('includes/navigation.php'); ?>

Here’s the css for header:

/* ----------------------------------------------------------------------------------------- Start Home CSS */

#home_header {
	padding: 0px;
	margin: 0px;
	background: url(../images/homeheaderbg.jpg) no-repeat center;
	width: 1034px;
	height: 367px;
}

#home_content {
	float: left;
	width: 1034px;
	padding-left: 5px;
	background: url(../images/fringe_bg.gif) repeat-y;
}

#home_content p {
	margin-left: 25px;
	margin-right: 20px;
}
#left_col, #right_col{
	float: left;
	width: 253px;
}

#center_col p {
	text-align: justify;
	margin-left: 15px;
	margin-right: 15px;
	color: #635e8b;
}
2

Not to sound rude or anything but have you even attempted trying to implement this code yourself and its very straight forward even for a beginner HTML developer.

3

There seems to be something wrong with that code. It’s a gigantic amount of code that will fill up your page. Doesn’t look like a signup form at all. Normally, a simple signup form is just a little bit of code, like you’d get from something like CampaignMonitor. Maybe you should try them instead?

With the layout as you have it now, you could add position: relative to #global_container and set the container of the signup code ( a <form> ?) to position: absolute; top: 10px; left: 10px etc to place it in the top left corner.

4

I have done try before and yes, the results is fill up the header. I think the HTML code is wrong. Btw there’s image on left-top header, that’s header_topleft2.jpg.
I will contact sign-up email provider.

Thanks for your reply guys

5

OOT for the moment,
Now I want to fix page on Holistic Pediatric Appointments with Dr.Hicks | Elementals Living.
On left-submenu for “Holistic Pediatric Appointments with Dr.Hicks” not fill up.
How to fix that?


#staff_list, #subnav {margin:0px 0px 20px 0px; padding:0px;}
	#staff_list ul, #subnav ul {width: 283px; margin:0px; padding:0px;}
	#staff_list li, #subnav li{display: block; margin-left: 0px; margin-bottom: 3px; background: url(../images/twocolnavlistbg.gif) no-repeat; list-style: none; padding:0px;}
	
		#staff_list li ul li, #subnav li ul li {display: block; margin-left: 20px; margin-bottom: 0px; background: url(../images/twocolnavlistbg.gif) no-repeat 0px 0px; list-style: none; padding:0px;}
		#staff_list li:hover, #subnav li:hover{background: url(../images/twocolnavlistbg_over.gif) no-repeat;} 
			
			#staff_list li a, #subnav li a{display: block; width: 238px; padding: 6px 0px 5px 35px; text-decoration: none; color: #635e8b; font-size: 11px; font-weight: bold;}
				#subnav li ul li a{width: 218px; padding: 6px 0px 5px 45px;}
				#staff_list li a:hover, #subnav li a:hover{color: #333333;}
6

“not fill up” is not very clear. If you mean those nav items are too far left, add the bit in red:

#staff_list, #subnav {
  margin: 0 0 20px [COLOR="Red"]11px[/COLOR];
  padding: 0;
}
7

I mean the subnav only for “Holistic Pediatric Appointments with Dr.Hicks” outside from subnav image in blue color. How to fix that subnav?
Sorry if my english is bad cause I’m from Indonesia.

8

That’s a heading. I don’t understand, sorry. :frowning:

9

here’s the screenshot:
In the red color is not correct to display, the a link for “Dr. Hicks” word is outside onto image background (in blue color).

10

Ah, now I see. But that isn’t what appears in the link you posted above. Could you update that page?

But really, because you are using a background image, your best option is to make the text shorter!

11

FYI the site is curently not LIVE site, the error above is on temporary enviroment site.

Do you mean this below code?
Wordpress Page Template:

<?php
/**
 * @package WordPress
 * @subpackage Default_Theme
 */
?>
<?php get_header(); ?>
	<div id="two_column_content">
    	<div id="two_column_left">
            <?php include('includes/search_bar.php'); ?>
            <?php include('includes/navigation_sub.php'); ?>
            <?php include('includes/latest_news.php'); ?>
            <?php include('includes/latest_podcasts.php'); ?>
        </div>
    	<div id="two_column_right">
        	<div id="banner_wrapper"><img src="<?php bloginfo('template_directory');??>/images/banner_lavender.png" alt="Seminars" class="banner_image" width="727" height="200"  /></div>
            
            <?php if (have_posts()) : 
				while (have_posts()) : the_post(); ?>
			
				<h2><?php the_title(); ?></h2>
					
				<?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>

				<?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
	
				<?php endwhile; 
			endif; ?>
			<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
        </div>
    </div>
<?php get_footer(); ?>

Wordpress SubNavigation :

<?php

$this_page = $post->ID;
$parent = $post->post_parent;
$ancestors = $post->ancestors;
$top_level = $ancestors[1];


if($parent == 0){
	$subnav_title_id = $this_page;
}
if($top_level == null && $parent !== null){
	$subnav_title_id = $parent;
}
if($top_level !== null && $parent !== null){
	$subnav_title_id = $top_level;
}

?>
<h3><a href="<?php echo get_permalink($subnav_title_id); ?>"><?php echo get_the_title($subnav_title_id); ?></a></h3>
            <div id="subnav">
					
				<?php		
				
					if($post->post_parent){
						$children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
					}else{
						$children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
					}
					if($top_level !== null){
						$children = wp_list_pages("title_li=&child_of=".$top_level."&echo=0");
					}
					if ($children) { 
						?><ul><?php 
							echo $children;
						?></ul><?php 	
					}
				?>
            </div>
            <br />

Wordpress CSS SubNavigation

/* ----------------------------------------------------------------------------------------- Start Staff Listing */
#staff_list, #subnav {margin:0px 0px 20px 0px; padding:0px;}

	#staff_list ul, #subnav ul {width: 283px; margin:0px; padding:0px;}
	#staff_list li, #subnav li{display: block; margin-left: 0px; margin-bottom: 3px; background: url(../images/twocolnavlistbg.gif) no-repeat; list-style: none; padding:0px;}

		#staff_list li ul li, #subnav li ul li {display: block; margin-left: 20px; margin-bottom: 0px; background: url(../images/twocolnavlistbg.gif) no-repeat 0px 0px; list-style: none; padding:0px;}
		#staff_list li:hover, #subnav li:hover{background: url(../images/twocolnavlistbg_over.gif) no-repeat;} 
			
			#staff_list li a, #subnav li a{display: block; width: 238px; padding: 6px 0px 5px 35px; text-decoration: none; color: #635e8b; font-size: 11px; font-weight: bold;}
				#subnav li ul li a{width: 218px; padding: 6px 0px 5px 45px;}
				#staff_list li a:hover, #subnav li a:hover{color: #333333;}

/* ----------------------------------------------------------------------------------------- Start News Listing */
12

Um, I’m not sure what you’re referring to. I’m just saying that this:

Holistic Pediatric Appointments with Dr.Hicks

is too long. Perhaps try

Appointments with Dr.Hicks

The blue background image is not really suited to repeating vertically, so your only real options are to make the text shorter or the LI wider.

Or you could also add white-space: nowrap to the <a>, but the text may hang out at the end:

#staff_list li a, #subnav li a {
  color: #635E8B;
  display: block;
  font-size: 11px;
  font-weight: bold;
  padding: 6px 0 5px 35px;
  text-decoration: none;
  [COLOR="Red"]white-space: nowrap;[/COLOR]
  width: 250px;
}
13

You’re the rock Mr. Ralph,
It’s work like a charm and I add

 margin-left: -15px;

to work more smooth.

Thanks.

14

please take a look on thelocalscoopnews.com/events, and then under “Upcoming Events” tab click “Read More” link on anything articles/event in that tab. repeat again with another articles/event. So it will always open same location in Google Map with “Surat,Gujarat,India”. This site using Events 2.14 from templatic.
How to fix this issue ?