Starting out with editing templates. Where do I start?

[Stuart Wright]

Hello folks.
I need, for a start, to make our footer look like this:



I've not done any template editing before and I notice that there are hooks in them. Should I use the footer hooks to add the HTML of this template and EXTRA.css to add the necessary css?

Might it be a good idea at this point to ask an experienced styler for help with this project?

 

[Dan]

I would create 2 new templates for this

newfooter & newfooter.css

and use the template hooks to replace the footer content with newfooter.

Once you migrate to xf 1.2, you could use the included template modification/merge system instead of the hooks

 

[Paul B]

You could do that with a single HTML template and associated CSS template.
Either as an add-on or just manually inserted into the templates.

Presumably the content static is static, which means you don't need any ACP options for updating it?

 

[Chris D]

I would do as @ExtraLicense suggests and create two new templates, but I wouldn't go to the trouble of learning how to use hooks to programatically add it to the template.

Instead, as Brogan suggests, manually inserting into the templates would be a good idea.

We never used to recommend this because manually edited templates and upgrades could be a nightmare. But actually, with the diff/merge and outdated template handling in 1.2, it should no longer be a major concern.

So, create your new templates in the Admin CP (e.g. avforums_footer and avforums_footer.css) and populate them with your HTML and CSS code.

Then in the XenForo footer template (or perhaps at the bottom of PAGE_CONTAINER - depends on the positioning you need), you can simply do this:

<xen:include template="avforums_footer" />

That will include your footer template.

In your footer template, you will need this to call your footer css:

<xen:require css="avforums_footer.css" />