SocialEngine 4: Customize Your Site Header/Footer

We know it’s absolutely imperative that you have 100% freedom when it comes to giving your SocialEngine-powered site its own unique layout. Editing your site’s global header/footer content is the best starting point, since this HTML appears at the top and bottom of every page. This allows you to wrap the interface and content generated by SocialEngine in your own layout. We’ve carefully designed our Layout Editor in SE4 to help you achieve this easily. There are several ways to go about it; I’ll outline some suggested methods here.

Suggested Method: Layout Editor

The best method for changing your site header/footer is to use the in-built Layout Editor in the SE admin panel.

  • 1
    Login to your SocialEngine administration system
  • 2
    Switch your site into “Development Mode” on your admin panel dashboard.
  • 3
    Under the Layout menu, open the Layout Editor
  • 4
    Click the “Editing: Homepage” link to open the page pull-down, and select Site Header
  • 5
    In the Layout Editor, you should now see a white space with a few widgets inside, most likely “Mini Menu”, “Site Logo”, and “Main Menu”. Drag an HTML Block from the “Available Blocks” area to the right into your layout, and drop it above the “Mini Menu” widget. When you drop it, you’ll be prompted to add a title and HTML. Leave the title blank, and insert any HTML you would like to have appear at the top of every page, then save your changes.
  • 6
    Next, click “Editing: Site Header”, and select your Site Footer. Drop an HTML Block into the white space, below the “Footer Menu” widget (by default). Insert the HTML code you would like to have appear at the bottom of every page.
  • 7
    If you need to make any changes to your global CSS file (to style your new header/footer), you can do so on the Theme Editor page in the Layout menu.
  • 8
    When you’re satisfied with your changes, switch your site back to “Production Mode” on your admin panel dashboard.

Alternative Method: Edit the global template directly

If you need even more control over your layout, you can edit the global template file directly. This is not a recommended method as it may interfere with any future updates as well as the SocialEngine support staff’s ability to troubleshoot any problems that arise with your site. Edit this file at your own risk. The global template file can be found in your SE installation at the path: /application/modules/Core/layouts/scripts/default.tpl

Looking for quality Social Engine Web Hosting? Look no further than Arvixe Web Hosting!

Tags: , , , , , , , , , , , , | Posted under SocialEngine | RSS 2.0

Author Spotlight

Andrew Cross

Andrew Cross

Hi, I'm Andrew. A am a 25, ICT Administrator which offers support to company's around the South Wales Area. I have created a few social sites for myself and other company's. So far 2 out of 3 have been successful using the powerful SocialEngine Script. I continue to try and help the community of SocialEngine by giving Support and Technical Help where possible.

Leave a Reply

Your email address will not be published. Required fields are marked *


× 9 = 81

You may use these HTML tags and attributes: <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>