style/bluenightsky/index.en.html.tmpl

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml"
   3       lang="en">
   4   <head>
   5     <meta charset="utf-8" />
   6     <title>$title</title>
   7     <link rel="stylesheet" href="/css/styles.css"
   8           type="text/css" media="screen" />
   9     <link rel="stylesheet" href="/css/print.css"
  10           type="text/css" media="print" />
  11     <script type="text/javascript"
  12             src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
  13     </script>
  14     <script type="text/javascript" src="/js/simpletabs.js"></script>
  15     <link rel="stylesheet" href="lightbox.css"
  16           type="text/css" media="screen" />
  17     <script type="text/javascript" src="/js/jquery.js"></script>
  18     <script type="text/javascript" src="/js/jquery.lightbox-0.5.js"></script>
  19     <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
  20     <script type="text/javascript">
  21       $(function() {
  22       $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
  23       });
  24     </script>
  25   </head>
  26   <body>
  27     <div id="wrapper"><!-- #wrapper -->
  28
  29       <header><!-- header -->
  30         <h1><a href="/">Site name</a></h1>
  31         <h2>Your compelling tag line goes here</h2>
  32         <img src="images/bluenightsky.png" width="940" height="200" alt=""/>
  33         <!-- header image -->
  34       </header><!-- end of header -->
  35
  36       <nav><!-- top nav -->
  37         <div class="menu">
  38           $menu
  39         </div>
  40       </nav><!-- end of top nav -->
  41
  42       <section id="main"><!-- #main content and sidebar area -->
  43         <section id="content"><!-- #content -->
  44           <article>
  45             $article
  46           </article>
  47         </section><!-- end of #content -->
  48
  49         <aside id="sidebar"><!-- sidebar -->
  50
  51           <div class="tabwidget">
  52             <ul class="tabs">
  53               <li><a href="#tab1">Menu</a></li>
  54               <li><a href="#tab2">Popular</a></li>
  55               <li><a href="#tab3">About Me</a></li>
  56             </ul>
  57             <div class="tab_container">
  58               <div id="tab1" class="tab_content">
  59                 <h3>Languages</h3>
  60                 $langmenu
  61
  62                 <h3>Location</h3>
  63                 $levelmenu
  64               </div>
  65               <div id="tab3" class="tab_content">
  66                 <h3>Who I Am</h3> <img src="images/me.png" alt=""
  67                 /><p>Lorem ipsum in libris debitis facilis qui, in usu
  68                 esse falli deseruisse. Vel ut vivendo sensibus
  69                 partiendo, liber philosophia ne vim. Viris oblique
  70                 explicari has et. Nam noster iisque discere te, sale
  71                 doming delectus est te, an debet quando eruditi
  72                 pro. Ad dicant praesent persequeris has, ne vel
  73                 minimum petentium periculis.</p>
  74               </div>
  75             </div>
  76           </div>
  77
  78           <div class="standard">
  79             <h3>Things To Do</h3>
  80             <ul>
  81               <li><a href="#">Create</a></li>
  82               <li><a href="#">Have Fun</a></li>
  83               <li><a href="#">Share With Friends</a></li>
  84               <li><a href="#">Play Games</a></li>
  85               <li><a href="#">Upload</a></li>
  86               <li><a href="#">Download</a></li>
  87             </ul>
  88
  89
  90             <h3>Sponsors</h3>
  91             <img src="images/ad180.png" alt="" /><br /><br />
  92
  93             <h3>Connect With Us</h3>
  94             <ul>
  95               <li><a href="#">Twitter</a></li>
  96               <li><a href="#">Facebook</a></li>
  97               <li><a href="#">LinkedIn</a></li>
  98               <li><a href="#">Flickr</a></li>
  99             </ul>
 100           </div>
 101
 102         </aside><!-- end of sidebar -->
 103
 104       </section><!-- end of #main content and sidebar-->
 105
 106       <footer>
 107         <section id="footer-area">
 108
 109           <section id="footer-outer-block">
 110             <aside class="footer-segment">
 111               <h4>Friends</h4>
 112               <ul>
 113                 <li><a href="#">one linkylink</a></li>
 114                 <li><a href="#">two linkylinks</a></li>
 115                 <li><a href="#">three linkylinks</a></li>
 116               </ul>
 117             </aside><!-- end of #first footer segment -->
 118
 119             <aside class="footer-segment">
 120               <h4>Awesome Stuff</h4>
 121               <ul>
 122                 <li><a href="#">one linkylink</a></li>
 123                 <li><a href="#">two linkylinks</a></li>
 124                 <li><a href="#">three linkylinks</a></li>
 125               </ul>
 126             </aside><!-- end of #second footer segment -->
 127
 128             <aside class="footer-segment">
 129               <h4>Coolness</h4>
 130               <ul>
 131                 <li><a href="#">one linkylink</a></li>
 132                 <li><a href="#">two linkylinks</a></li>
 133                 <li><a href="#">three linkylinks</a></li>
 134               </ul>
 135             </aside><!-- end of #third footer segment -->
 136
 137             <aside class="footer-segment">
 138               <h4>Blahdyblah</h4>
 139               <p>© 2010 <a href="/">site</a> Praesent
 140               libero. Sed cursus ante dapibus diam. Sed nisi.</p>
 141             </aside><!-- end of #fourth footer segment -->
 142
 143           </section><!-- end of footer-outer-block -->
 144
 145         </section><!-- end of footer-area -->
 146       </footer>
 147
 148     </div><!-- #wrapper -->
 149     <!-- Free template created by http://freehtml5templates.com -->
 150   </body>
 151 </html>