Web Site
Developers

Web Page Templates - II

A Short Review

In the previous article web page templates, as written the template applicability was limited to static pages. This was an appropriate choice for the OpenSourceToday site. Most of the content were articles and citations, that were rarely altered once added. Nonetheless changes were made, however, that left an odd mix of form and formats. Therefore, it was obvious some alterations were necessary to avoid similar transgressions in the future.

The means to avoid previous problems lay in adding dynamic content. I found the use of the simplest php scripting matched my current needs. This route may not suffice in the longer term, however, as an interim solution it works. That is, in most cases, I now need only change one text file to exhibit altered content. Nonetheless, new content may take just a bit more effort. My previous alternative required hand re-coding multiple files even for small changes. Or as I had done in the past, neglect the older publications until I had the time to redo them properly. Neither was a good solution.

New Site, New Demands

This site began while OpenSourceToday was running; the purpose was to remove the obvious bloat in the front pages. First, another external site was setup, then content pulled off the first pages to improve appearances. The new site was then supposed to link to those removed banners without changing the articles' physical locations. The gain would be better appearance and overall site consistency. Moreover, there was the possibility of gaining increased attention with cross linked content.

Once it was certain OpenSourceToday was dead, I focused on the new site. Many changes were needed to creat a stand alone site. The re-organization resulted in increasing the page count as well as altered page content. This again forced changes to the templates that were thought compeleted. Moreover, without a firm, final picture further alterations were unavoidable. Furthermore, previously created pages had to be found and recoded by hand. None of this can be described as pleasant work prospects.

Early Steps Towards Dynamic Content

Prior to the shutting down of the OpenSourceToday site, I had tired of the excessive hand coding necessary to maintain a barely functional site. I was spread too thin to carry the load. My responsibility were supposed to have been building the site and coding. The major fraction of the content was to provided by the professional, core writer. Having to write and edit were extra tasks took too much energy. I concluded that this was a losing battle. Therefore, I began serious study of methods to short circuit some of the maintenance tasks.

I began a project to automate input from a html form processed with a php script to load a database directly on the site. This would have generated article listings, automatic links, and minimizing the work required placing content into a template. Moreover, the tools were only a browser and email to effect content addtion remotely. The the html form and an explanation of my choices building the data structure were nearly completed when the decision to abort the site was made. Nonetheless, I intend to complete the write up, since dynamic content is my new focus.

It is apparent, I have given thought to employing techniques generating dynamic web pages. Moreover, I have investigated thee tools. What I describe below is much less than my earlier goals, however, it has appeal of being extremely simple scripting code. See if it meets your needs.

Evolving Content on the Home Page
Left Central Column

Succinctly, at least, the main or home page for this site the page is a template. Previously it had a separate template designed, coded and stored for use. Despite not moving the entire content out of the page, those areas likely to be changed soon or often now are external files.

On the home page, explicit code for the content in header remains. The first graphic below shows the left most column containing a bit of the header followed by the logos and the site menu in the center and the team listing at the bottom all come from calls to external files. Despite, the empty space beneath the last item in left column the expected growth in the top two will force change. Here is that cut off view:

      Upper left of B/ST site's home page

     Fig. 1 Upper left side of Home Page 

Note the cut off logo at the top is in the header section, hence, of no interest now. Focus first on the set of logos that are destined to grow in number. Here is the code [1.] for the two div sections cited, i.e. the entire header and the top, left (logos) column (down to the first dividing line):

        <div id="header-square-edge">
         <h1>>Web Site <br />>Developers</h1>
	 <div id="head-left-logo">>
	    <img src="http://bst-softwaredevs.com/images/BST-cascade-VII.jpg" alt="B/ST Logo" align="left" />>
	 </div> <!-- end left header with logo -->
      </div>
      <div id="col-left">
         <?php
	    readfile($logos . "/sites.txt");
	 ?>

	    <h3>__________________________________</h3>

	    ... 

The code is that bit between the <?php and ?>. It is simply reading one text file stored in a subdirectory defined by the variable $logos. The path is defined in the <head> tag section using the php global variable: $_SERVER['DOCUMENT_ROOT']. Moreover, should I wish to change the sites logo list, I only need to alter sites.txt file. Therefore, the next time the front page is displayed the new content will be shown.

While the remaining items in the this column are subject to alteration and removal, the code is identical. The differences are only the differing path and file name. Only the double dividing lines are hard coded into the template's left, middle column. Thus, it is more instructive to a more complex example, as contained in the footer.

Evolving Content - Footer Columns

The footer section has three distinct areas, but only one, the central section, with two navigation bars has new structure. In hind sight I should have opted for a bit more complexity. The navigation bar at the top connects to several submenus on techniques and problems related to coding web pages. The area beneath contains text and another navigation bar. It was my error not to split the simple text content from the navigation bar. In any case, here is a view of the entire footer region:

      Bottom Half of Home Page

     Fig. 2 Lower half of Home Page 

and a blow up of the central footer:

      Central Footer with Menus

     Fig. 3 Central Footer with Menu Bars 

There is nothing new in the corner graphics, regarding the code. They differ only in the names the text files and where they are stored. In contrast, however, in the central footer, there are two different remotely stored files in the template. Indeed, it should have been at least three distinct files, if not four. Despite the reservations, the growth in complexity is limited. The change is no more than stringing on another (or more) readfile() functions. It makes sense to divide content more finely than done. In any case, expect the home page footer region to look quite different than shown, soon.

Here is the code in the central footer:

          <div id="bottom-central">
	   <?php
	      readfile($navigate . "/navigate-menu.txt");
	      readfile($text . "/central-footer.txt");
	   ?>
	   
	</div>  <!-- end bottom-central-->  

Both navigation bars will be expanded in the foreseeable future. Moreover, the text shown in the graphics will be removed or altered. In the case of the items in the central, left column the changes may well be more drastic due to space limitations. Therefore, the home page template will be altered extensively. Nonetheless, the current code should suffice, with minor changes.

Further Use of Simple, Dynamic Content Code

The main navigation bar in the central footer matches the links in the left, central column. These links lead to submenu listings grouped on topics. The major component in the submenus is a listing with links to articles listed in the center, wide column under the header. The entire listing is read from an external text file with the same php code exhibited previously. Thus, the model sufficent to function down another level.

Here is the submenu called by the Tags link:

      Tags Submenu Page

     Fig. 4 Tags Submenu Page 

Where the Simple Model Fails

Do not get carried away with the simplicity of the model, because it fails for this site on the next level. Once again the articles are locked into a static template, hence, almost any change will once again require laborious effort to effect changes across the entire content. For the interim, I accept the trade off, but only temporarily.

However, lets assume I need to make a big change to the submenu templates. Notice it's plural, that may force some redoing some hand coding on every template. Not likely, but certainly possible. However, we are talking about a limited set, with relatively simple changes. It would be comprised of adding or moving php code. Therefore, not as onerous a chore as changing the static templates. I already have many more articles than menus pages. Thus, any format change of the article set would be a difficult task.

Future Course and Acknowledgments

A new menu item Dynamic (Content) will appear shortly. My plan is to write an introductory article outlining my near term plans. Perhaps the work I mentioned above will appear early as an article, but that is not a certainty. Nonetheless, it is certain the effort to more general code and flexible templating is the prime goal.

These ideas and the path evolved with the help of several individuals with whom I discussed several problems. One was Phil Howard, the owner of Linux Home Page. He showed me how to get by one problem on a shared access site. Another is Jeffrey Grunstein [2.], who is a heavy user of Java, php and javascript to create dynamic, interacte site for the Federal Reserve. He urged that I use templates in a flexible manner, e.g. separating the header and footer areas into separate templates when generating pages. I did not go that route, however, I think the suggestion expanded by view to be receptive to simpler, more direct solutions. Finally, Elliot Richmond, was the individual who set me on the course of my current endeavors regard template coding. It was he that asked if I could make an alteration in one location that would propagate through the site, as a Microsoft tool claimed it could do. I have seen skilled work by MS, however, I too have seen them ruin the better option by their need to put their stamp on the result. Therefore, I am skeptical of their keeping it clean. Nonetheless, it is a goal worthy of pursuit.

Corrections, suggested extension or comments write: How-To-Guy. If the mailto does not work, use this: hcohen[-At-]bst-softwaredevs.com.

     © Herschel Cohen, All Rights Reserved

Return to Home or Template Page
____________________________________________________________________

    1.  Note the php does not survive transformation
      to web page source.  Only the content of text file is seen.  Return

    2.  If you are a member of www.linkedin.com, look
      him up.  Jeffrey also works on Unix systems and speciallied databases.
      Return