Need help with wordpress footer configuration (Site map is displayed wrong)

[wonderland]

Hi,

I'm having problems with word press footers site map.

at the moment it's displayed like this:
[IMG]http://i52.photobucket.com/albums/g9/Rydra/Footer-1.jpg[/IMG]

I would like it displayed like this:
[IMG]http://i52.photobucket.com/albums/g9/Rydra/Footer2.jpg[/IMG]

I've tried looking in footer.php, but there is only this piece of code:

<ul id="bottomLinks">
				
				<?php wp_list_pages('title_li=') ?>
			</ul>

<ul id="bottomLinks"> <?php wp_list_pages('title_li=') ?> </ul>

I've tried looking in .css file also didn't see anything that I could configure to change layout.

Also, When I view page source from internet browser I get this piece of code:

<div id="footer">
		&copy; 2010 BCG. Visas tiesības aizsargātas.
		<ul id="bottomLinks">

				<li class="page_item page-item-442 current_page_item"><a href="http://example.com" title="Sākums">Sākums</a></li>
<li class="page_item page-item-26"><a href="http://example.com/uzturesana" title="Uzturēšana">Uzturēšana</a></li>
<li class="page_item page-item-27"><a href="http://example.com/majas-lapas" title="Mājas lapas">Mājas lapas</a>
<ul>

	<li class="page_item page-item-209"><a href="http://example.com/majas-lapas/bezmaksas-majas-lapa" title="Bezmaksas mājas lapa">Bezmaksas mājas lapa</a></li>
	<li class="page_item page-item-212"><a href="http://example.com/majas-lapas/individuala-majas-lapa" title="Individuāla mājas lapa">Individuāla mājas lapa</a></li>
</ul>
</li>
<li class="page_item page-item-28"><a href="http://example.com/portfolio" title="Portfolio">Portfolio</a></li>
<li class="page_item page-item-22"><a href="http://example.com/par-mums" title="Par mums">Par mums</a></li>
<li class="page_item page-item-17"><a href="http://example.com/kontakti" title="Kontakti">Kontakti</a></li>

<div id="footer"> &copy; 2010 BCG. Visas tiesības aizsargātas. <ul id="bottomLinks"> <li class="page_item page-item-442 current_page_item"><a href="http://example.com" title="Sākums">Sākums</a></li> <li class="page_item page-item-26"><a href="http://example.com/uzturesana" title="Uzturēšana">Uzturēšana</a></li> <li class="page_item page-item-27"><a href="http://example.com/majas-lapas" title="Mājas lapas">Mājas lapas</a> <ul> <li class="page_item page-item-209"><a href="http://example.com/majas-lapas/bezmaksas-majas-lapa" title="Bezmaksas mājas lapa">Bezmaksas mājas lapa</a></li> <li class="page_item page-item-212"><a href="http://example.com/majas-lapas/individuala-majas-lapa" title="Individuāla mājas lapa">Individuāla mājas lapa</a></li> </ul> </li> <li class="page_item page-item-28"><a href="http://example.com/portfolio" title="Portfolio">Portfolio</a></li> <li class="page_item page-item-22"><a href="http://example.com/par-mums" title="Par mums">Par mums</a></li> <li class="page_item page-item-17"><a href="http://example.com/kontakti" title="Kontakti">Kontakti</a></li>

But when I open footer.php, to edit I see this:

<div id="footer">
		&copy; 2010 BCG. Visas tiesības aizsargātas.
		<ul id="bottomLinks">

				<?php wp_list_pages('title_li=') ?>
			</ul>
	</div>

I don't know what to edit in order to sort this display problem.

[etftw]

Try putting this at the end of your CSS file:

.page_item
{
	clear: both;
}

[wonderland]

should I replace .page_item with something ?

[wonderland]

Tried adding this.

It doesn't really solve my problem, now footer is displayed like this:

[IMG]http://i52.photobucket.com/albums/g9/Rydra/BCG_Footer.gif[/IMG]

It's much better, but not what I aimed for .

I just noticed, that this fix totally messed up my navigation though.

[IMG]http://i52.photobucket.com/albums/g9/Rydra/BCG_header.gif[/IMG]

[etftw]

I'm taking a bit of a stab in the dark here, but try changing your footer code to this:

<div id="footer">
		&copy; 2010 BCG. Visas tiesības aizsargātas.
		<ul id="bottomLinks" style="clear: both;">

				<?php wp_list_pages('title_li=') ?>
			</ul>
	</div>

And then change the CSS I gave you to this:

#bottomLinks li
{
	clear: both;
}

Hope that works for you.

[wonderland]

After adding this, navigation doesn't get messed up , which is good :)

But footer is still displayed like this : http://i52.photobucket.com/albums/g9/Rydra/BCG_Footer.gif

[etftw]

Try changing it to

#bottomLinks li
{
	clear: both;
	float: left;
}

Sorry I can't give you one quick answer, I tend to have a very iterative approach to CSS as you can see.

[wonderland]

Float: left was already present

#bottomLinks li{
        display:inline;
        float: left;
        padding-left: 7px;
        padding-right: 8px;
}

All other #bottomlinks related css:

#bottomLinks {
	position:absolute;
	top:12px;
	right:0;}

#topLinks li a, #bottomLinks li a{ 
        background: url(images/bullet_bottom.jpg) no-repeat 0px 50%;
        color: #868686;
        font-size: 11px;
        padding-left: 5px;
        text-decoration: none;
        text-transform: capitalize;

}

[etftw]

Is the footer going to be a fixed size?

[etftw]

OK try this:

#bottomLinks ul
{
	float: left;
}

#bottomLinks li
{
	clear: left;
}

Note: I just edited this code, so try this new edit of it.

[wonderland]

Yes, as a matter of fact, it's already fixed:

#footer {

	border-top:2px solid #333;
	padding:12px 0 35px 0;
	width:960px;
	margin:1px auto;
	color:#868686;
	position:relative;
	font-size:11px;
}

[etftw]

I've just edited the code in my previous post, check it out and see if it works.

[wonderland]

This didn't work either :(

[etftw]

Would it be possible for you to do these links manually or do you need WordPress to generate them? If you can just do them yourself I can give you some code to format it properly.

[etftw]

Check out this sample file I have made, this achieves the layout you want, but it requires you to set the embedded list's items to be of class "subpage" in order for them to appear in a vertical order.

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style>
	#bottomLinks li
	{
		display: block;
		float: left;
		padding-right: 15px;
	}	
	
	.subpage
	{
		clear: both;
	}
</style>
</head>

<body>
<div id="footer">
		&copy; 2010 BCG. Visas tiesības aizsargātas.
		<ul id="bottomLinks">

				<li class="page_item page-item-442 current_page_item"><a href="http://example.com" title="Sākums">Sākums</a></li>
<li class="page_item page-item-26"><a href="http://example.com/uzturesana" title="Uzturēšana">Uzturēšana</a></li>
<li class="page_item page-item-27"><a href="http://example.com/majas-lapas" title="Mājas lapas">Mājas lapas</a>
<ul>
	<li class="page_item page-item-209 subpage"><a href="http://example.com/majas-lapas/bezmaksas-majas-lapa" title="Bezmaksas mājas lapa">Bezmaksas mājas lapa</a></li>
	<li class="page_item page-item-212 subpage"><a href="http://example.com/majas-lapas/individuala-majas-lapa" title="Individuāla mājas lapa">Individuāla mājas lapa</a></li>
</ul>
</li>
<li class="page_item page-item-28"><a href="http://example.com/portfolio" title="Portfolio">Portfolio</a></li>
<li class="page_item page-item-22"><a href="http://example.com/par-mums" title="Par mums">Par mums</a></li>
<li class="page_item page-item-17"><a href="http://example.com/kontakti" title="Kontakti">Kontakti</a></li>
</ul>
</div>
</body>
</html>

If you don't mind managing the page links manually then this should do the trick for you.

[wonderland]

I've been using something like this, but I wanted that php function to stay, because It automatically made changes to footer. But If it's not possible I guess I will just have to live with manual editing .

[etftw]

It may be possible, I just can't think of a way around it though. Sorry I can't be of more assistance :(

[wonderland]

I should be thankful, that you're trying to help me with this ! ;)

I lack knowledge a bit in order to make this work, but I think I can live with manual editing. :)