Preloading the site and pages question

[ozzie]

hi Guys, I hope this is the correct section to be posting this.
I am referring to  version 1.4.1 CMSMS in particular.

I am attempting to preload the site so that upon refreshing the browser or coming to the site for the first time the site "enters" already loaded.
IN other words the site remains hidden until all information including images are fully downloaded where upon the site then becomes visible.

I have stumbled upon a java script that is said to do the job and unfortunately I can not get it up.

Page loading ... Please wait.




Free JavaScripts provided
by The JavaScript Source

This script is a free script care of Javascriptsource.com

It seems when installed as instructed to create a significant smarty string syntax problem

Can any one suggest either a fix or and alternative that is compatible?
or is it not feasable to preload version 1.4.1?
Any help would be appreciated.
note: my personal level of HTML and especially Java scripting knowledge is at best beginner level so for me it is just a copy and paste job as I have no real idea of what I am working with.

[Dee]

Try surrounding the Javascript code with {literal} {/literal} tags as described here.

Regards,
D

[ozzie]

Thanks!
Wrapping the script in literal has allowed the site to load but shows no effect by the addition of the script. hmmmm...

any ideas?

[Dee]

Thanks!
Wrapping the script ... shows no effect by the addition of the script. hmmmm...

any ideas?

It looks like the script should work fine, it does here with Firefox.
You did put the "hidepage" div with the loading message at the top of your template?
I'm assuming you can see that message if you leave out the OnLoad="loadImages()" from the body tag?
Any Javascript errors? Can you supply us with a link?

Regards,
D

[ozzie]

What I have done is highlighted in Blue:

{process_pagedata}



{* Change lang="en" to the language of your site *}






{sitename} - {title}
{* The sitename is changed in Site Admin/Global settings. {title} is the name of each page *}

{metadata}
{* Don't remove this! Metadata is entered in Site Admin/Global settings. *}

{stylesheet}
{* This is how all the stylesheets attached to this template are linked to *}

{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}
{* Relational links for interconnections between pages, good for accessibility and Search Engine Optmization *}


{literal}

=b){nw=b+"px";}if(w



#pagewrapper {width:expression(P7_MinMaxW(800,900));}
#container {height: 1%;}


{/literal}
{* The min and max page width for Internet Explorer is set here. For other browsers it's in the stylesheet "Layout: Left sidebar + 1 column" *}





{* The above JavaScript is required for CSSMenu to work in IE *}
{literal}








{/literal}








    {* start accessibility skip links *}
   
      {anchor anchor='menu_vert' title='Skip to navigation' accesskey='n' text='Skip to navigation'}
      {anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}
   
    {* end accessibility skip links *}


   
    {* Horizontal ruler that is hidden for visual browsers by CSS *}


   {* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet  "For template: Left menu + 1 column" *}
   
           {cms_selflink dir="start" text="$sitename"}
   
   
   {* End Header *}


 

   {* Start Breadcrumbs *}
   
        {breadcrumbs starttext='You are here' root='Home' delimiter='»'}

   
   
   {* End Breadcrumbs *}
{* Start Bc02 *}
   
       

   
   
   {* End Bc02 *}



   {* Start Content (Navigation and Content columns) *}
   

      {* Start Navigation *}
     
{global_content name='navvert'}
             
      {* End Navigation *}


      {* Start Content Area *}
     
         {print showbutton=true script=true}
 

         {content}

    {* Start relational links *}


{anchor anchor='main' text='^ Top'}

         
            {cms_selflink dir="previous" label="Previous page: "}

            {cms_selflink dir="next"}
         
         {* The label parameter doesn't need to be there if you're using English, but is here to show how it's used if you don't want the English text "Previous page" *}
{* End relational links *}
     
     


     
     
  {* End Content Area *}


   
   {* End Content *}
{* Start Footer01. Edit the footer in the Global Content Block called "footer" *}
   
   

      
   {* End Footer  *}



   {* Start Footer. Edit the footer in the Global Content Block called "footer" *}
   
      {global_content name='footer'}
      
   {* End Footer  *}


{* end pagewrapper *}

The script appears to have nill effect [once it was wrapped in the litereal criteria]
the site under development is  www.bizzymatecms.com

I have fiddleds with page transitional effects to try and get 1st loading and browser refresh, sorted out but so far to no avail.

As I am flying blind [ I have very little knowledge of Java ] I may have added to the script to template incorrectly.

[Dee]

You missed step 3 (adding the "hidepage" div), after

Code: Select all

</__body onload="loadImages()">

add

Code: Select all

<div id="hidepage" style="position: absolute; left:5px; top:5px; background-color: #FFFFCC; layer-background-color: #FFFFCC; height: 100%; width: 100%;">
<table width=100%><tr><td>Page loading ... Please wait.</td></tr></table></div> 

Regards,
D

[ozzie]

ok and wow, an effect!

thanks Dee you have been most helpful.

Unfortunately it leaves the navigation block exposed while the rest of the site is hidden....but much better on "refreshing the browser [ IE7]