Fullscreen
Loading...
 
border

Now using ... [toggle]

Now using darkshine.css.
Space-sensitive layout of page-top options
Print

Look_and_Feel_options_schematic

TikiWiki has had an admin interface to display site identity options flexibly, but in previous releases these items were generally just added in a vertical stack, since there wasn't any particular "top" to the page.

But for themes that have a specific area for site identity items, stacking won't work. Instead, the items must be placed side-by-side. This page describes the method being used to place these items, which include the logo, banner ad, search form, log-in form Look & Feel options, and the div that holds custom code data.

Following the logic of the tiki-site_header.tpl template file, this is how items are displayed:



Custom code with and without a banner ad


(if custom code is used)
   (if there is an ad banner)
   <div id="sitead" class="floatright">
      (Banner is displayed here.)
   </div>
   <div id="customcodewith_ad">
      (Here will be parsed the 400px-wide custom site header code.}
   </div>


(else)
   <div id="customcode">
      (Full-width custom code area here.)
   </div>
(/if)

Absolute-positioned search, fullscreen button and login shown here are options for all configurations.

(else)

...Look & Feel options with no custom code:

Displaying a logo, with or without an ad banner

(if there is a logo and the logo left or right)
   <div class="clearfix" id="sioptions">
   (if logo is at left)
      (if there is an ad)
         <div id="sitead" class="floatright">
           (Ad goes here.)
         </div>
      (/if)
      <div id="sitelogo" class="floatleft">
         (Logo goes here.)
      </div>
   (/if)


   (if logo is at right)
      {if there is an ad)
         <div id="sitead" class="floatleft">
            (Ad goes here.)
         </div>
      (/if)
      <div id="sitelogo" class="floatright">
            (Logo goes here.)
      </div>
   (/if)
   </div>
(/if)



Logo centered, and there is an ad: to work in small vertical space, the ad (halfbanner) is floated left; a second banner zone is floated right

   (if logo and logo is centered}
      <div class="clearfix" id="sioptionscentered">
         (if there is an ad banner)
         <div id="bannertopright" class="floatright">
            ({banner zone='topright'} ad goes here.)
         </div>
      <div id="sitead" class="floatleft">
         (Ad goes here.)
      </div>
      (/if)
   <div id="sitelogo">
      (Logo goes here.)
   </div>	
</div>
(/if)



No logo but there is an ad, so ad is centered.

  (if no logo)
      (if there is an ad)
      <div style="text-align:center">
         (Ad goes here.)
      </div>
      (/if)
   (/if)

(/if)~pp~
Finally, tiki-site_header.tpl has code for the login form:
~pp~
   (if site header login)
      (Site header log-in form goes here.)
   (/if)
(/if}


This is the method used for new themes including Darkroom, Feb12, The News, and Tikinewt, in Branch 2.0, and for themes listed on http://themes.tikiwiki.org/Themes_for_TW2 (cache). There are variations in some cases due to theme-specific space configurations, etc.

Very possibly this code could be improved, and I'd welcome that.


Created by: Gary. Last Modification: Wednesday, October 15, 2008 02:58:31 EST by Gary.

Tags This Page Has [toggle]

Shoutbox [toggle]

Anti-Bot verification code: Random Image
Enter the code you see above:

Gary, 07:22 EST, Mon, Jan 05, 2009: Sorry, Anonymous, but I don't know what you mean by "this"? TikiWiki? I didn't do anything special to get the menus to work.
Anonymous, 19:54 EST, Wed, Dec 31, 2008: It would be nice if you could tell us... A) How to get and install this on our wiki, and B) What we have to do to make the javscript menus work after we've installed it...
Gary, 11:54 EST, Sat, Nov 01, 2008: Iframe plugin is now at [[Link]
Anonymous, 19:07 EST, Thu, Oct 30, 2008: can i get the iframe plugin download link. its not working.
Gary, 20:42 EST, Thu, Oct 16, 2008: Well, more interesting than random characters, but not really the direction I was hoping for. ;-)
Anonymous, 02:18 EST, Thu, Oct 16, 2008: Fart. Enjoy the smell
8675309, 16:29 EST, Thu, Oct 09, 2008: shout it
Anonymous, 01:11 EST, Thu, Oct 09, 2008: test
Anonymous, 09:20 EST, Fri, Oct 03, 2008: test
Gary, 00:27 EST, Fri, Oct 03, 2008: I wish testers would write something more interesting. ;-)
border