Making a customer footer

Ryan Kent

Well-known member
I am just learning to modify XF templates and need some guidance. I am trying to modify the default footer a bit. I am leaving the XF copyright in tact on the left side, and the Home / Top links on the right. As for the rest of the links, I am trying to center them. Ultimately I would like to wind up the appearance of:
Code:
<html>

<head></head>

<body>

<DIV ALIGN=CENTER>

Copyright © 2011 TeraPVP.com, All rights reserved. <br>

<a href="http://www.terapvp.com/community/pages/privacy/">Privacy Policy</a> • <a href="http://www.terapvp.com/community/help/terms/">Terms & Rules</a> • <a href="http://www.terapvp.com/community/misc/contact/">Contact Us</a><br>

</DIV>

</body>

</html>

To start I found the "footer" template. I located the below code and tried to wrap it in a <DIV ALIGN=CENTER> </DIV> but that had no effect. I have that so close yet so far away feeling...

Code:
<ul id="legal">
            <xen:hook name="footer_links_legal">
                <xen:if is="{$tosUrl}"><li><a href="{$tosUrl}">{xen:phrase terms_and_rules}</a></li></xen:if>
                <xen:if is="{$xenOptions.privacyPolicyUrl}"><li><a href="{$xenOptions.privacyPolicyUrl}">{xen:phrase privacy_policy}</a></li></xen:if>
            </xen:hook>
            </ul>
 
Admin CP -> Appearance -> Templates -> EXTRA.css

Add this:

Code:
.footerLegal #copyright
{
	float: none;
}

.footerLegal #legal
{
	float: none;
}

.footerLegal #legal li
{
	float: none;
}

Removing all of the floats from these elements makes everything centered, like so:

Screen shot 2011-02-23 at 10.55.37 AM.webp
 
Thank you Jake. I just added the Flexile style to my site and I am making some other changes. I will put the information you shared to good use very soon!
 
Top Bottom