Free AdviceGet Free Advice
Home | Get advice | Give advice | Topics | Columnists | - !START HERE! -
Make Suggestions | Sitemap

Get Advice


Search Questions

Ask A Question

Browse Advice Columnists

Search Advice Columnists

Chat Room

Give Advice

View Questions
Search Questions
Advice Topics

Login

Username:
Password:
Remember me
Register for free!
Lost Password?

Want to give Advice?

Sign Up Now
(It's FREE!)

Miscellaneous

Shirts and Stuff
Page Backgrounds
Make Suggestions
Site News
Link To Us
About Us
Terms of Service
Help/FAQ
Sitemap
Contact Us


CSS and PHP Question


Question Posted Tuesday March 30 2010, 1:00 am

First of all, here is the header code I'm working with:



<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats please -->

<style type="text/css" media="screen">
@import url( <?php bloginfo('stylesheet_url'); ?> );
</style>

<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />

<link rel="stylesheet" type="text/css" href="<?php bloginfo('url'); ?>/wp-includes/js/transmenu/transmenu.cs…
<script language="javascript" src="<?php bloginfo('url'); ?>/wp-includes/js/transmenu/transmenu.js…

<script language="javascript">
function init() {
//=================================…
// if supported, initialize TransMenus
//=================================…
// Check isSupported() so that menus aren't accidentally sent to non-supporting browsers.
// This is better than server-side checking because it will also catch browsers which would
// normally support the menus but have javascript disabled.
//
// If supported, call initialize() and then hook whatever image rollover code you need to do
// to the .onactivate and .ondeactivate events for each menu.
//=================================…
if (TransMenu.isSupported())
{
TransMenu.initialize();
}
}
</script>

<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_get_archives('type=monthly&format=lin… ?> <?php //comments_popup_script(); // off by default ?>
<?php wp_head(); ?>
</head>
<body onload="init()" >

<div id="container">

<div id="header">
</div><!--//end #header//-->

<ul>
<?php if (function_exists('pixopoint_menu')) {pixopoint_menu();} ?>
</ul>
</div>
</div><!-- /nav -->

<script language="javascript">
// set up drop downs anywhere in the body of the page. I think the bottom of the page is better..
// but you can experiment with effect on loadtime.
if (TransMenu.isSupported()) {

//===================================…
// create a set of dropdowns
//===================================…
// the first param should always be down, as it is here
//
// The second and third param are the top and left offset positions of the menus from their actuators
// respectively. To make a menu appear a little to the left and bottom of an actuator, you could use
// something like -5, 5
//
// The last parameter can be .topLeft, .bottomLeft, .topRight, or .bottomRight to inidicate the corner
// of the actuator from which to measure the offset positions above. Here we are saying we want the
// menu to appear directly below the bottom left corner of the actuator
//===================================…
var ms = new TransMenuSet(TransMenu.direction.down, 1, 0, TransMenu.reference.bottomLeft);

//===================================…
// create a dropdown menu
//===================================…
// the first parameter should be the HTML element which will act actuator for the menu
//===================================…


<?php

$Pgs = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_status='publish' AND post_parent = 0 AND post_type = 'page'");

foreach($Pgs AS $Pg)
{
$ItemsCounter = 0;
?>
var menu<?php echo $Pg->ID; ?> = ms.addMenu(document.getElementById('m<?p… echo $Pg->ID; ?>'));


<?php

$SubPgs = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_status='publish' AND post_parent = '".$Pg->ID."' AND post_type = 'page'");
foreach($SubPgs AS $SubPg)
{
?>
menu<?php echo $Pg->ID; ?>.addItem("<?php echo $SubPg->post_title; ?>", "<?php echo $SubPg->guid; ?>");

<?php
$ItemsCounter++;
}

}

/*
print("<PRE>SubPgs<BR>");
print_r($SubPgs);
print("</PRE>");
*/

?>

//===================================…
// write drop downs into page
//===================================…
// this method writes all the HTML for the menus into the page with document.write(). It must be
// called within the body of the HTML page.
//===================================…
TransMenu.renderAll();
}
</script>

<?php /* Menu for subpages of current page (thanks to K2 theme for this code) */
global $notfound;
if (is_page() and ($notfound != '1'))
{
$current_page = $post->ID;
while($current_page) {
$page_query = $wpdb->get_row("SELECT ID, post_title, post_status, post_parent FROM $wpdb->posts WHERE ID = '$current_page'");
$current_page = $page_query->post_parent;
}
$parent_id = $page_query->ID;
$parent_title = $page_query->post_title;

// if ($wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_parent = '$parent_id' AND post_status != 'attachment'")) {
$Pgs = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_parent = '$parent_id' AND post_type != 'attachment'");
if ($Pgs)
{

?>


<?php
}
}
?>
<div id="wrapper">
<center><!-- [Link](Mouse over link to see full location) Chat Button Link Code --><div style="text-align:center;width:191px;"><… href="javascript:void(window.open('http:… src="[Link](Mouse over link to see full location)… width="191" height="69" border="0" alt="LiveZilla Live Help"></a><noscript><div><a href="[Link](Mouse over link to see full location)… target="_blank">Start Live Help Chat</a></div></noscript><div style="margin-top:2px;"><!-- [Link](Mouse over link to see full location) Tracking Code --><div id="livezilla_tracking" style="display:none"></div><script type="text/javascript">var script = document.createElement("script");script.… src = "[Link](Mouse over link to see full location)[Link](Mouse over link to see full location) Tracking Code --></center>
<?php get_sidebar();?>
<div id="content">




Second of all, here is the second code (the style sheet) I'm working with:




body {
margin:0;
padding:0;
background: #d5fdfb;
background: #50c1bb;
color:#1e4975;
text-align:left;
font-family: Arial, sans-serif;
font-size:12px;
}

#container{
background: #d5fdfb;
border:0px red solid;
width:825px;
margin:0 0 0 0;}

#header {
width: 825px;
height: 275px;
margin: 0 0 0 0 solid #030736;
background: url('[Link](Mouse over link to see full location)… no-repeat;
}


#wrapper{
width:825px;
margin:0 0 0 8px;}

#content {
margin: 0 0 0 40px;
width:780px;
float:left;
}


#sidebar{
float:right;
width:220px;
height:100%;
margin: 0 0 0 1030px;
}

.sidebar{
padding:5px;
margin: 0 0 0 1030px;
border:1px solid #03073;
background-color:#d5fdfb;
}



#sidebar ul {
st-style:none;
padding: 6px 3px;
border-bottom:none;
border-bottom: 1px dotted #2c6a7d;}

#sidebar ul{
st-style:none;
padding: 6px 3px;
margin:0;}

#footer {
border:0px red sod;
margin:10px 0;
padding:0px;
width:825px;
clear:both;
}

.footercol{
border:0px sod #2c6a7d;
width:218px;
padding:15px;
margin:0 5px;
float:left;}

.footercol2{
border:1px sod 2c6a7d;
background-color:#2c6a7d;
width:218px;
padding:15px;
margin:0 5px;
float:right;}

#copyright{
padding:20px 50px;
clear:both;
border-top:10px sod #2c6a7d;
background-color:#d5fdfb;}

/*Nav styng*/

#navigation {
background: #2c6a7d;
width:825px;
color: #d5fdfb;
font-weight:bold;
float:left;
}

#navigation ul {
st-style: none;
margin: 0;
padding: 0;
border: none;}

#navigation {
margin: 0;
float: left;}

#navigation a {
display: block;
text-agn: center;
color: #d5fdfb;
padding: 0px 0px;}

html>body #navigation a {
width: auto;
}

#navigation a:
{
background-color: #d5fdfb;
color: #2c6a7d;
}

/* sub menu */
#subnav {
clear:both;
float:left;
background: #47133c;
}
#subnav ul {
margin: 0px;
padding: 3px 0px 18px 5px;
st-style: none;
font: 11px/100% Arial, Helvetica, sans-serif;
}
#subnav {
border-right: 1px sod #0d4775;
border-left: 1px sod #0d4775;
padding: 5px 7px;
margin: 0px;
float: left;
}
#subnav a, #subnav a:visited, #subnav .page_item {
text-decoration: none;
color: #2c6a7d;
}
#subnav .current_page_item a, #subnav .current_page_item a:visited {
color: #30261c;
}
#subnav a:hover {
text-decoration: none;
color: #FFFFFF;
}


h1{
font-weight:ghter;
border-bottom:1px solid #871a44;
color:#030736;
font-size:18px;}

h2{
font-weight:lighter;
color:#030736;
font-size:16px;}


a {
color:#d6156c;
text-decoration:none;
}

a:hover {
color:#009acd;
text-decoration:none;
}

.clear{clear:both;}

.post, .wrapper{
margin:0 0 10px 0;
padding:15px;
border:1px solid #ccc;
background-color:#FFFFFF;}


.alignright {
float: right;
}

.alignleft {
float: left;
}

.alignleft a, .alignright a{
display: block;
background-color:#871a44;
color:#000000;
padding:8px;}

.alignleft a:hover, .alignleft a:hover{
background-color:#871a44;
color:#d6156c;}


.navigation {
display: block;
text-align: center;
margin-top: 10px;
margin-bottom: 60px;
}


#commentform #author, #commentform #email, #commentform #url {
background: #871a44;
padding: .2em;
border: 1px solid #871a44;

}

.commentlist li, #commentform input, #commentform textarea {
font-weight:normal;
}


.commentlist li .avatar {
float: right;
border: 1px solid #871a44;
padding: 2px;
background: #871a44;
}

.commentlist cite{
font-weight: normal;
font-style: normal;
font-size: 1.1em;
}

.commentlist cite a {
color:#ff3399;
font-weight: normal;
font-style: normal;
font-size: 1.1em;
}

.commentlist p {
font-weight: normal;
line-height: 1.5em;
text-transform: none;
}


.commentmetadata {
font-weight: normal;
margin: 0;
display: block;
}


#commentform input {
width: 170px;
padding: 2px;
margin: 5px 5px 1px 0;
}

#commentform textarea {
width:95%;
border: 1px solid #871a44;
background: #FFFFFF;
padding: .2em;
}

#commentform #submit {
margin: 0;
float: left;
}

.alt {
background-color: #871a44;
border-top: 1px solid #871a44;
border-bottom: 1px solid #871a44;
margin: 0;

padding: 5px;
}


.commentlist {
padding: 0;
text-align: justify;

}

.commentlist li {
margin: 15px 0 3px;
padding: 5px 10px 3px;
list-style: none;
}

.commentlist p {
margin: 10px 0 10px 0;
}


.nocomments {
text-align: center;
margin: 0;
padding: 0;
}


/*styling for wp-cal*/

#wp-calendar {
empty-cells: show;
font-size: 9px;
margin: 0;
width:100%;
}

#wp-calendar #next a {
padding-right: 9px;
text-align: right;
}

#wp-calendar #prev a {
padding-left: 9px;
text-align: left;
}

#wp-calendar a {
display: block;
text-decoration: none;
}

#wp-calendar a:hover {
color: #d6156c;
}

#wp-calendar caption {
color: #666;
font-size: 9px;
text-align: left;
font-weight: normal;
}

#wp-calendar td {
color: #666;
font: normal 10px verdana, "Trebuchet MS", arial, tahoma, sans-serif;
letter-spacing: normal;
padding: 2px 0;
text-align: center;
}

#wp-calendar td.pad:hover {
background: #ddd;
}

#wp-calendar td:hover, #wp-calendar #today {
background: #eaeaea;
color: #d6156c;
}

#wp-calendar th {
font-style: normal;
text-transform: capitalize;
}


Here is my website: [Link](Mouse over link to see full location)


The problem: I need to figure out how to effectively integrate that live chat button into my template and I need to move my content up higher towards the navigation bar so there is only a few pixels worth of problem; have been trying to solve this problem for the past few hours and I can't come up with any solutions.

Any ideas?

Thanks!


[ Answer this question ]
Want to answer more questions in the Technology category?
Maybe give some free advice about: Internet & Web Design?


theymos answered Wednesday April 7 2010, 9:59 pm:
You omitted vital parts of the chat code, so I can't tell what the button is supposed to look like. However, it would probably work to put it in the sidebar:

<div id="sidebar">
<div class="sidebar"><form role="search" method="get" id="searchform"
action="[Link](Mouse over link to see full location);
<div><label class="screen-reader-text" for="s">Search for:</label>
<input name="s" id="s" type="text">
<input id="searchsubmit" value="Search" type="submit">
</div>
</form>

<!--PUT CODE HERE-->

</div>

</div><!--//end #sidebar//-->
<div id="content">

You'll need to figure out how to modify the sidebar in WordPress. The code you pasted is getting it from somewhere else with get_sidebar().

[ theymos's advice column | Ask theymos A Question
]


More Questions:

<<< Previous Question: snooping
Next Question >>> Can i get a job to sponser me?

Recent popular questions:
Want to give advice?

Click here to start your own advice column!

What happened here with my gamer friends?

All content on this page posted by members of advicenators.com is the responsibility those individual members. Other content © 2003-2014 advicenators.com. We do not promise accuracy, completeness, or usefulness of any advice and are not responsible for content.

Attention: NOTHING on this site may be reproduced in any fashion whatsoever without explicit consent (in writing) of the owner of said material, unless otherwise stated on the page where the content originated. Search engines are free to index and cache our content.
Users who post their account names or personal information in their questions have no expectation of privacy beyond that point for anything they disclose. Questions are otherwise considered anonymous to the general public.

[Valid RSS] eXTReMe Tracker