Welcome to the Cookbook

loading...

4.9.3.1 Layout Changes

First, we'll include the Prototype library in the header, set up our status indicator image (spinner.gif), and set up our main content wrapper DIV, "content".

Here’s what a layout including those elements might look like (partially):

<head>
    <title><?php echo $title_for_layout; ?></title>
        <?php echo $javascript->link(array('prototype')); ?>
        <style type="text/css">
                div.disabled {
                        display: inline;
                        float: none;
                        clear: none;
                        color: #C0C0C0;
                }
        </style>
</head>
<body>
<div id="main">
        <div id="spinner" style="display: none; float: right;">
                <?php echo $html->image('spinner.gif'); ?>
        </div>
        <div id="content">
                <?php echo $content_for_layout; ?>
        </div>
</div>
</body>
</html>
  1. <head>
  2. <title><?php echo $title_for_layout; ?></title>
  3. <?php echo $javascript->link(array('prototype')); ?>
  4. <style type="text/css">
  5. div.disabled {
  6. display: inline;
  7. float: none;
  8. clear: none;
  9. color: #C0C0C0;
  10. }
  11. </style>
  12. </head>
  13. <body>
  14. <div id="main">
  15. <div id="spinner" style="display: none; float: right;">
  16. <?php echo $html->image('spinner.gif'); ?>
  17. </div>
  18. <div id="content">
  19. <?php echo $content_for_layout; ?>
  20. </div>
  21. </div>
  22. </body>
  23. </html>