Loading an outside page and preserving splitter menu

timwd

I have this code on the main page:

<ons-splitter>
  <ons-splitter-side id="menu" side="left" width="220px" collapse swipeable>
    <ons-page>
      <ons-list>
        <ons-list-item onclick="fn.load('home.html')" tappable>
          Home
        </ons-list-item>
        <ons-list-item onclick="fn.load('settings.html')" tappable>
          Settings
        </ons-list-item>
        <ons-list-item onclick="fn.load('about.html')" tappable>
          About
        </ons-list-item>
      </ons-list>
    </ons-page>
  </ons-splitter-side>
  <ons-splitter-content id="content" page="home.html"></ons-splitter-content>
</ons-splitter>
---page content goes here-----

The pages loaded by that menu are on the same main.html page. How do I link to and load a seperate html page , say News.html in the splitter menu above? Secondly, how do I make the same spliiter menu appear in all outside pages without repeating the code(kind of include).
Thanks.

Loading an outside page and preserving splitter menu browsing