How Can Move the position of Footer in Magento

How can i change the postion of footer section in magento?

I want to put the footer in the main div of the page.

How can i dothis in magento?

Solution

I'm not sure why you would want to do this, maybe reorganising your page structure would be a better option - a footer is a footer and not really part of the main content.

Nonetheless, this can be easily achieved using layout xml.

EDIT

There are two methods you can employ:

1. Use a local xml file for your base layout overrides. - app/design/frontend/your_package/your_theme/layout/local.xml

This should really be your preferred method, unless there is a good argument against for your particular use case.

<?xml version="1.0"?>
<layout>
    <default>
        <reference name="root">
            <action method="unsetChild">
                <alias>footer</alias>
            </action>
        </reference>
        <reference name="content">
            <action method="insert">
                <alias>footer</alias>
            </action>
        </reference>
    </default>
</layout>

OR...

2. Copy base layout files

copy app/design/frontend/base/default/layout/page.xml to app/design/frontend/your_package/yout_theme/layout/page.xml

Find the footer node which be declared as follows (in an untouched page.xml CE 1.7):

<block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml">
    <block type="page/html_wrapper" name="bottom.container" as="bottomContainer" translate="label">
        <label>Page Footer</label>
        <action method="setElementClass"><value>bottom-container</value></action>
    </block>
    <block type="page/switch" name="store_switcher" as="store_switcher" template="page/switch/stores.phtml"/>
    <block type="page/template_links" name="footer_links" as="footer_links" template="page/template/links.phtml"/>
</block>

it will be a direct descendant of the root node. Move this whole node so that it becomes a child of the main content node:

<block type="core/text_list" name="content" as="content" translate="label">
    <label>Main Content Area</label>

    <block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml" after=">
        <block type="page/html_wrapper" name="bottom.container" as="bottomContainer" translate="label">
            <label>Page Footer</label>
            <action method="setElementClass"><value>bottom-container</value></action>
        </block>
        <block type="page/switch" name="store_switcher" as="store_switcher" template="page/switch/stores.phtml"/>
        <block type="page/template_links" name="footer_links" as="footer_links" template="page/template/links.phtml"/>
    </block>
</block>

Remember to refresh your cache if it is enabled :)

EDIT

To answer the question in the comment regarding block positioning using the second method. You can use the before and after attributes.

i.e.

<block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml" after="your_sibling_block_name">

also, depending on the other layout xml you might also have to edit the sibling block and add a before attribute to it i.e. before="footer"