Revision [11255]

This is an old revision of WikkaSkinOptimization made by DarTar on 2005-10-04 15:40:06.

 

A new layout for Wikka?

Last edited by DarTar:
cleaning up page
Tue, 04 Oct 2005 15:40 UTC [diff]


For several (mainly "historical") reasons, the HTML output produced by Wikka does not allow optimal control on the layout. Here's a proposal for a more structured template:
 


  1. <!-- BEGIN doc open -->
  2. <!DOCTYPE....>
  3. <!-- END doc open -->
  4. <!-- BEGIN head (only head section) -->
  5.     <!-- head elements here -->
  6. </head>
  7. <!-- END head -->
  8. <!-- BEGIN body (whole body section) -->
  9. <body>
  10. <!-- BEGIN page header -->
  11.     <div id="page"> <!--new wrapper, was called //container// in previous draft-->
  12.         <div id="header"> <!--//id// instead of //class//-->
  13.             <h1 id="hn_main">PageTitle</h1>
  14.             <ul id="main_menu">' <!-- See WikkaMenus -->
  15.                 <li>menu item</li>
  16.                 ...
  17.             </ul>
  18.         </div><!-- end div "header" -->
  19. <!-- END page header -->
  20. <!-- BEGIN page content -->    
  21.         <div id="content"> <!--currently called //page//, //id// instead of //class//-->
  22.         The quick brown fox jumps over the lazy dog
  23.         The quick brown fox jumps over the lazy dog
  24.         The quick brown fox jumps over the lazy dog  (main content)
  25.         The quick brown fox jumps over the lazy dog
  26.         The quick brown fox jumps over the lazy dog
  27.         </div><!-- end div "content" -->
  28.         <div id="comments"> <!--new wrapper-->
  29.             <div id="commentheader"> <!--//id// instead of //class//-->
  30.             </div>
  31.             <div id="commentlist">
  32.                 <div class="comment">
  33.                 </div>
  34.                 <div class="comment">
  35.                 </div>
  36.                 ...
  37.             </div><!-- end div "commentlist" -->
  38.             <div id="commentform"> <!--//id// instead of //class//-->
  39.                 <!-- (form here) -->
  40.             </div><!-- end div "commentform" -->
  41.         </div><!-- end div "comments" -->
  42. <!-- END page content -->
  43. <!-- BEGIN page footer -->
  44.         <div id="footer"> <!--//id// instead of //class//-->
  45.             <ul id="extra_menu"> <!-- See WikkaMenus -->
  46.                 <li>menu item</li>
  47.                 ...
  48.             </ul>
  49.             <div class="smallprint">
  50.             </div>
  51.             <div id="microtime"> <!--new id for formatting (or masking) the microtime information-->
  52.             </div>
  53.         </div><!-- end div "footer" -->
  54.     </div><!-- end div "page" -->
  55. <!-- END page footer -->
  56. </body>
  57. <!-- END body -->
  58. <!-- BEGIN doc close -->
  59. </html>
  60. <!-- END doc close -->


Hope it's clear what I'm trying to do... if not, let me know. We definitely should move to a better structure, both in generated code as well as in which parts of PHP code do the generating. More later... --JavaWoman

Small tweak: wrapped comments in a div as well which may help in styling. And main heading properly a h1, with id. Small id name changes. --JavaWoman


CategoryDevelopmentDiscussion CategoryLayout
There are 18 comments on this page. [Show comments]
Valid XHTML :: Valid CSS: :: Powered by WikkaWiki