MainTemplate.html

<!DOCTYPE HTML>
<html><head>
  <title>Main Template Page</title> <!-- Page title. This appears in the browser tab and status bar. -->
  <link rel=stylesheet type=text/css href=css/style.css> <!-- Stylesheet. Don't change this. -->
  <link rel=stylesheet type=text/css href=css/service.css> <!-- Service page stylesheet. Remove to revert to default WebTV page theme. -->
  <link rel="shortcut icon" href=Icon.png> <!-- Page icon. Used as the tab bar icon. -->
  <link rel=apple-touch-icon href=images/AppleTouchIcon.png> <!-- Apple touch icon. Used when adding the page to the home screen on iOS. -->
  <script src=js/main.js></script> <!-- Main functionality script. Don't change this. -->
  <meta charset="UTF-8"> <!-- Meta tags. These tell the browser exactly how to handle the page. -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="application-name" content="WebTV HD">
</head><body> <!-- Sound effects. These are responsible for the sounds you hear when clicking on stuff. -->
<audio id=clickSound src=audio/click.mp3 preload=auto></audio> <!-- Generic click sound. Plays when you click most links or icons. -->
<audio id=inputSound src=audio/inputClick.mp3 preload=auto></audio> <!-- Input click sound. Plays when you click on some sort of input (like a checkbox or radio button). -->
<audio id=submitSound src=audio/submitClick.mp3 preload=auto></audio> <!-- Submit click sound. Plays when you click on a button. -->
<audio id=errorSound src=audio/error.mp3 preload=auto></audio> <!-- Error sound. Doesn't really have a use, but could be used for when the page runs into an error. -->
<audio id=panelUp src=audio/up.mp3 preload=auto></audio> <!-- Panel-up sound. Plays when the sidebar is opened on mobile devices. -->
<audio id=panelDown src=audio/down.mp3 preload=auto></audio> <!-- Panel-down sound. Plays when the sidebar is closed on mobile devices. -->
<div id=selectionbox></div> <!-- Selection box. Doesn't matter where you put this. -->

<div class=sidebar> <!-- Sidebar. -->
  <div class=sidebar-contents> <!-- Sidebar content container. -->
    <img class="sidebar-logo clickable" src=images/WebTVJewel.svg alt="WebTV Logo." onClick="linkHandler('Home.html');"> <!-- Sidebar logo. -->
    <div class=sidebar-border></div> <!-- Sidebar border. Separates links and WebTV logo. -->
    <div class="sidebar-link clickable">Link</div> <!-- Sidebar link. -->
    <div class=sidebar-border></div>
  </div>
  <div class="bottom-right-image home"></div> <!-- Bottom-right image. Change the sub-class to change the image. -->
  <div class=sidebar-shadow></div>
</div>

<!-- Note: if you want to add a link, please don't use href - that causes the browser to navigate away before the click sound can be played. -->
<!-- Instead, use this code snippet: <a class=clickable onClick="linkHandler('https://example.com/page');"> -->

<div class=main-content> <!-- Main content. Put stuff here! -->
  <h1>Template</h1>
  <p>Template page for stuff outside of a <code>wtv-service</code> folder.</p>
  
  
  
  
  
  
</div> <!-- End main content. Don't put stuff outside of here. -->
</body></html>