Flex Skin Hooks

You can use hooks to interact with the Flex Skin in a programmatic way. This is great for developers or webmasters who need to inject content (or anything else) in a scalable, flexible manner.

Hooks Common to All Templates

hook_top_body — insert anything before the HTML output (just after the opening <body> tag) on every page
hook_bottom_body — insert anything after the HTML output (just before the closing </body> tag) on every page

Template- and Context-specific Hooks

In the Flex Skin, the following elements each have four hooks associated with them by default:

Blog/Archives Templates:

content_container
- content_section
  - home
    - post_image_row
    - post_container
      - content_column
        
        post_headline
        
        post_excerpt
        
        post_footer
- pagination_section
  - pagination_container
- footer_section
  - footer_container

Single Template:

content_container
- byline_section
  - byline_container
- content_section
  - post_columns
    - content_column
      - single
        
        headline_area
    - sidebar_column
      - sidebar
- author_section
  - author_container
- cta_section
- comments_section
  - comments_container
    - comment_list
      - comment_head
- comment_form_section
  - comment_form_container
    - comment_form
- footer_section
  - footer_container

Front Page Template:

content_container
- latest_section
  - latest_container
    - front_latest_posts
- cta_section
- footer_section
  - footer_container

Page Template:

content_container
- content_section
  - post_columns
    - content_column
      - page
        
        headline_area
    - sidebar_column
      - sidebar
- footer_section
  - footer_container

No Sidebar/Landing Template:

content_container
- content_section
  - post_columns
    - content_column
      - page
        
        headline_area
- footer_section
  - footer_container

If each of the above elements can be represented by $hook, then the four hooks available on each element are as follows:

hook_before_$hook (before the opening tag)
hook_top_$hook (just after the opening tag)
hook_bottom_$hook (just before the closing tag)
hook_after_$hook (after the closing tag)

To illustrate, using the header element as an example, these are the four hooks:

hook_before_header (before the opening tag)
hook_top_header (just after the opening tag)
hook_bottom_header (just before the closing tag)
hook_after_header (after the closing tag)

The trackbacks element only includes before and after hooks.

As you can see, the Flex Skin provides a ton of specific hook locations for you to reference. And if you don’t see an available hook where you want to inject some content, you can always create your own hooks wherever you want!