Random full background the lost php

matthewoliver / 2010-02-20 16:00:30   

Verena,

I had the problem as you, I only wanted to have the random background on the main page. What I did was adding a black background image to each exhibit, as my theme is mostly black. You can add a white one, but I had to manually add the images and select background color.

As for your resizing, I don't really know. When I go on your site the image is small and top left but if I resize my browser window, the image will resize itself to full background...

If I were you I'd start over from scratch. That's what I did and it now works well. If you haven't seen it, here it is: http://matthewoliver.fr have a look at the page source code, maybe it will help.Matthew Oliver

verena / 2010-02-23 15:52:51   

Hi there,
matthewoliver kindly helped out when I felt quite abandoned by the forum. Thanks.

I got rid of the random background images in my exhibits because I added in each exhibit a plain white background jpg. That's how matthewoliver solved it. It works, only that sometimes you see the little icon top left while the image is loading. I guess this isn't the 'smoothest' way to avoid the background images in the exhibits?! But I'm glad at least it works like that.

But I still have problems with the images not resizing to the screen size. Sometimes I see two pictures lying one on another and I allways have the scrollbars on my main page...

Does anyone have an idea what I can do about the resizing problem?

I really would be happy if someone could have a quick look at it.

Thanks a lot.
Verena

Webpage

arsondpi / 2010-02-23 16:12:48   

you're not using the expanding menus js (you're using the nine) and this breaks the code.

Delete

  1. expandingMenu(0);expandingMenu(1);expandingMenu(2);expandingMenu(3);expandingMenu(4);expandingMenu(5);expandingMenu(6);expandingMenu(7); 

and it will work.

Actually you're using two background images - one for the body and another one for the <div id='the-background'> ...Not that it creates any serious problems but it eats up on your bandwidth...

verena / 2010-02-23 21:34:47   

Hi arsondpi,

that was helpful, I deleted this line and the images resize now! Great.

Is there a way to get rid of the scroll bars on the main page? I don't see them on other sites with random background images.

About me using two background images: I was afraid, that this is eating upon my bandwidth. But how can I change that? When I delete the white background image I have the random background images on all my exhibits. When I delete the div, it doesn't work either.

Sorry for maybe dumb questions, I thought I had gotten a little into it, but in this case I feel quite far away again...

Any helpful advices?
V.

arsondpi / 2010-02-24 09:46:31   

I think you need to track back to what you did... I honestly don't know what's wrong.

I get 33 errors when I validate your page.
The first error for example is an normal image tag before the closing head tag of your page - why?

Maybe if you fix your page these may go away...

verena / 2010-02-24 19:41:04   

Ok. I will go for it.

But can you (or anyone else) tell what is the correct way to keep the random background images off the exhibits? I didn't find an answer in the forum so far.

Thanks-
V.

verena / 2010-02-26 19:33:31   

Hi, it's me again. I'm lost again. I redid my index file, but nothing changed. What I did:
_uploaded the random.full.background.php to the plugin folder
_added this to my index.php:

  1. plug:front_dyn_js />
  2. plug:backgrounder color='<%color%>', tile='<%tiling%>' />
  3. script type='text/javascript' src='<%baseurl%><%basename%>/site/js/full_background.js'></script>
  4. plug:random_full_background />
  5. /head>
body class='section-'>
div id='the-background'>
div id="wrapper">
div id='menu'>
div class='container'>

_added the #the-background and #wrapper to my stylesheet

Still I have two pictures lying on top of each other and I have the scroll bars.

Does anyone have an idea, where to look for the error? So far I got everything solved with this great help from the forum but in this case it seems to be under a spell or something. I did the validator, as arsondpi recommended, but the strange thing is, that the "" that are supposed to be missing, aren't missing in my file.. How come?

Sorry if this is bothering, but I'm trying hard to get it solved.

Thanks for any advice.
V.

this is the site

verena / 2010-02-27 12:15:44   

Anyone???

gcolefla / 2010-02-27 23:54:15   
  1. I think your problem may be you edited the wrong index.php file. I had to edit the file in ndxz-studio/site/sample folder. The other themes don't have index files to edit. On line 28 you will see
  2. <plug:backgrounder color='<%color%>', img='<%bgimg%>', tile='<%tiling%>' />
  3. It goes right after this and before </head> I believe. 
verena / 2010-02-28 16:39:43   

thanks, gcolefla, for looking at my code! I did edit the right index file but when I change the position of the code as you told, I indeed get rid of the two pictures superimposed, but they obviously cover my whole menu, because then my menu is gone. mmh.. Is there a way between these two??

thanks for any helpful advices.
V.

verena / 2010-03-02 10:10:47   

Hi,
I saw that one page earlier 'handbuilt' had the same problem with the two pictures superimposed. He solved it, but unfortunately didn't tell how. I assume it depends where I put my code in the index file. I put

  1. plug:random_full_background />

after

plug:front_dyn_js />
plug:backgrounder color='', tile='' />
script type='text/javascript' src='/site/js/full_background.js'>

Is this the correct way? If anyone could tell, I would be very glad!
V.

  1. <a href="http://www.verenapostweiler.de/">Webpage</a>
verena / 2010-03-05 12:03:11   

yeahhhh, I got it to work. For all those, who have the same problems as I had (scroll bars, two pictures superimposed): I did arsondpis step by step instruction and instead of calling the full background plugin I called the random full background plugin. But that doesn't work. So the 'important' part of my index file now looks like this:

script type='text/javascript' src='/site/js/full_background.js'>
/head>

  1. body class='section-<%section_id%>'>
  2. div id='the-background'>plug:random_full_background />/div>
  3. div id="wrapper">
  4. div id='menu'>
  5. div class='container'>

Basically: everything the same as in arsondpis tutorial, only I deleted the line with 'plug:backgrounder..' and changed the name of the plugin in the background div.

I'm not sure if this is the correct way, but at least it works. Huh, that was hard for me. Thanks to all, who helped out!
V.

p.s. sorry for showing the code in this messy way, in the preview I never see, if it will be shown as code or not...

yeah

verena / 2010-03-05 12:09:30   

but: the one thing left is, that I get the background image on every exhibit. I avoided this by uploading a white jpg as background image on every exhibit. I guess this eats upon the bandwidth and isn't the smoothest way, but it works. If there is a smarter solution, please let me know.
V.

verena / 2010-03-05 12:44:27   

... I just checked my site on Safari and there I don't get the scaling, which looks quite odd with some pictures... Does anyone have an idea, how I can fix this?
I would be glad.
V.

Webpage

onid / 2010-03-12 04:34:41   

hi,

first of all thank you indexhibit. its really fantastic what you do.

i am trying also to make the random full background image on my page.
my problem is that the image size is scaled too large.
there are also three notice just before the image load:

Notice: Undefined index: randombg in /indexhibitv070e/ndxz-studio/lib/parse.php on line 71

Notice: Undefined variable: size in www/indexhibitv070e/ndxz-studio/site/plugin/plugin.random_full_background.php on line 39

Notice: Undefined variable: size in /indexhibitv070e/ndxz-studio/site/plugin/plugin.random_full_background.php on line 39

i would be really happy if somebody can help me with this problems. i am sitting too long infront of this, without making a step forward.

here the link.

d.

onid / 2010-03-12 15:54:51   

I saw that some people have manage this random full background. can somebody help me with the size? the plugin doesn´t define the size. please..i would be really glad

onid / 2010-03-12 22:57:26   

ok, i did it by my own. this croping of the picture depends of the different resolution settings.
so i returned the size manually in the random full background file, to get rid of the notice and saved all pictuers in the same size.

  1. return "<img src='$url' width=1024 height=768 alt='' />";

now it works. i am happy with that.

richardn / 2010-03-13 00:18:30   

Doesn't work on my Safari... image first appears below the menu... then, if the browser window is resized, the image fills the whole window, but covers the menu...

sawatzki / 2010-06-11 21:54:39   

Hi folks, long time no see... ;-)

I put together a little tutorial for the full screen random background plugin. I'll try to post it here:
-----------------------------------------------------------
Step-By-Step to Random Full Background Images
by Sawatzki

1:     First of all, there are some files that have to be copied to your server:

    1.1: The Indexhibit-Plugin "plugin.random_full_background.php"
    --> This file goes into the folder "/ndxz-studio/site/plugin/"

    1.2: The javascript-file, that resizes the images: "full_background.js"
    --> This file goes into the folder "/ndxz-studio/site/js/"
    
    1.3: A folder containing the images to choose from.
    --> Create a folder called "bgbig" on the root level* of your website and upload some images to it.
    * "root level" = where you installed indexhibit.
    --> If you already have a folder with images you want to use, read the comment in the code at step 2.A.2.

2: Now, we have to modify both our main site "index.php" and "style.css". These are located inside your theme folder.
If you never changed your theme in the advanced settings of Indexhibit, you are still using the standard theme called "eatock".
If you did change it through indexhibit, it will propably be called "sample". If you made your own theme folder, then that's the one we will look at...

    2.A: Edit "index.php"
    
        2.A.1: Open "../ndxz-studio/site/(your theme)/index.php" in your favorite editor
        and find the end of thesection.
        Insert the following code just before "< em >":

        2.A.2: Two lines down, you will find the opening body-tag.
        
        Insert the following code just after "< em >":

            
2.A.3: Find the tag at the end of the file and insert the following code just before it:
            
    
        
    2.B: Edit "style.css"        
        2.B.1: Open "../ndxz-studio/site/(your theme)/style.css" in your favorite editor
        and add the following lines to it a line before "#menu { ...":    
            
            #the-background {
                position: fixed;
                overflow: hidden;
                z-index:1;
                width: 100%;
                height:100%;
                top:0;
                left:0;
            }

#wrapper {
            position: absolute;
            z-index: 2;
            width: 100%;
            height: 100%;
            top: 0;
            left:0;
            }

That's it. It should work now. Hopefully... no guarantee... ;-)                    

P.S. The file ../ndxz-studio/site/(your theme)/ie.css should be modified accordingly, I didnt have time to do this yet...

sawatzki / 2010-06-11 21:56:12   

hmm... somehow, I dont seem to be able to post the way it should be...

sawatzki / 2010-06-12 08:42:52   

Ok, I put the instructions and plugins in a .dmg.

Go get it here:

http://rapidshare.com/files/398117057/Random_Full_Background.dmg

sawatzki / 2010-06-12 09:14:47   

Step-By-Step to Random Full Background Images
by Sawatzki

1:     First of all, there are some files that have to be copied to your server:

    1.1: The Indexhibit-Plugin "plugin.random_full_background.php"
    --> This file goes into the folder "/ndxz-studio/site/plugin/"n

    1.2: The javascript-file, that resizes the images: "full_background.js"
    1.2.a:
    --> This file goes into the folder "/ndxz-studio/site/js/"
    
    1.3: A folder containing the images to choose from.
    --> Create a folder called "bgbig" on the root level* of your webserver and upload some images to it.
    * "root level" = where you installed indexhibit.
    --> If you already have a folder with images you want to use, read the comment in the code at step 2.A.2.

    1.4: I have included jquery 1.4.2. Please update your version by moving and replacing the existing jquery.js into "/ndxz-studio/site/js/".

sawatzki / 2010-06-12 09:22:16   

2: Now, we have to modify both our main site "index.php" and "style.css". These are located inside your theme folder.
If you never changed your theme in the advanced settings of Indexhibit, you are still using the standard theme called "eatock".
If you did change it through indexhibit, it will propably be called "sample". If you made your own theme folder, then that's the one we will look at...

  1. ¬†¬†¬†¬†2.A: Edit "index.php"
  2.     
  3. ¬†¬†¬†¬†¬†¬†¬†¬†2.A.1: Open "../ndxz-studio/site/(your theme)/index.php" in your favorite editor 
  4. ¬†¬†¬†¬†¬†¬†¬†¬†- At the end of the <head> section, find the following line: 
  5. ¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†<plug:backgrounder color='<%color%>', img='<%bgimg%>', tile='<%tiling%>' />
  6. ¬†¬†¬†¬†¬†¬†¬†¬†- Change it to: 
  7. ¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†¬†<!-- <plug:backgrounder color='<%color%>', img='<%bgimg%>', tile='<%tiling%>' /> -->
  8. ¬†¬†¬†¬†¬†¬†¬†¬†- And insert the following code just before "</head>":

            
            

        2.A.2: Two lines down, you will find the opening body-tag.
        
        Insert the following code just after "":

                
            
            
                     2.A.3: Find the -tag at the end of the file and insert the following code just before it:
            
    
        
    2.B: Edit "style.css"        
        2.B.1: Open "../ndxz-studio/site/(your theme)/style.css" in your favorite editor
        and add the following lines to it a line before "#menu { ...":    
            
            #the-background {
                position: fixed;
                overflow: hidden;
                z-index:1;
                width: 100%;
                height:100%;
                top:0;
                left:0;
            }

            #wrapper {
                position: absolute;
                z-index: 2;
                width: 100%;
                height: 100%;
                top: 0;
                left:0;
            }    

That's it. It should work now. Hopefully... no guarantee... ;-)                    

P.S. The file ../ndxz-studio/site/(your theme)/ie.css should be modified accordingly, I didnt have time to do this yet...

sawatzki / 2010-06-12 09:25:39   

OK, I GIVE UP. This Forum-system SUCKS BIG TIME!!!

Sorry for the rant...

but, please, do yourselves and us a favor and get a decent forum system up and running here!
What about a plain old phpBB? It makes posting, searching and formatting sooooo much easier.

djuve / 2010-06-13 11:03:06   

Thanks for taking the time to put up these instructions, sawatzki. Works like a charm!

christiandelia / 2010-07-15 04:21:31   

Hello guys,
it's possible to find a defenivly version ?
anybody say different way to make it right this trick...
but i need help.

Please, anybody see my index.php and a style.css ???
my URL

christiandelia / 2010-07-15 04:21:36   

Hello guys,
it's possible to find a defenivly version ?
anybody say different way to make it right this trick...
but i need help.

Please, anybody see my index.php and a style.css ???
my URL

christiandelia / 2010-07-15 04:21:50   

Hello guys,
it's possible to find a defenivly version ?
anybody say different way to make it right this trick...
but i need help.

Please, anybody see my index.php and a style.css ???
my URL

flashbar / 2010-07-20 21:00:05   

Please,
Can someone please post or explain their solution for applying the Random Full Background to ONLY the main page and excluding the exhibit sites. This has been the point of this thread multiple times, but it the solution is unclear, to me at least.
I have the random and full size plugins working, but my main page background operates like I'd like my exhibits to, and vice versa.

site

flashbar / 2010-07-20 21:02:55   

Please,
Can someone please post or explain their solution for applying the Random Full Background to only the MAIN page and excluding the exhibit sites. This has been the point of this thread multiple times, but it the solution is unclear, to me at least.
I have the random and full size plugins working, but my main page background operates like I'd like my exhibits to, and vice versa.

site

arsondpi / 2010-07-20 22:38:04   

Did you read this post?
The one with the rapidshare link...

tomcardoso / 2010-07-21 02:29:41   
  1. Hey guys, just wondering if any of you have tested this out with the plugin applying to the main page only. I've read through the code and noticed that Sawatzki added some notes about how to make this work (mainly, consists of, at the very beginning, uncommenting:
  2. if ($rs['url'] == '/') 
  3. {
  1. and then later uncommenting
  2. }
  3. else
  4. {

at the very end of the plugin.random_full_background.php file.

However, when I do this I just get a straight-up 500 error. Otherwise, it works, so it seems like there's a problem with running that code the way it is, though I'm not sure what the problem is. I've tried a couple of things, but I'm wondering if the process used to apply the code to the main page only is slightly different? I'm no php expert, so I'm not really sure what's going on.

Thanks!

tomcardoso / 2010-07-21 02:33:23   

Ugh, sorry about that. But in better news, I think I've actually just realized the answer. After validating the plugin over and over, I think I've figured it out: that else statement around line 80 is erroneous. Instead, keep the else statement commented out and add a single closing bracket "}" right before the return statement at the very end of the file, and if you've uncommented the "if ($rs['url'] == '/') {" at the very beginning, it should all work like a charm. Can anyone confirm that this is correct and I'm not just talking out my butt?

ir0nma1den / 2010-07-25 22:19:01   

I'm having 2 problems with this:

first, my background images do not resize to the browser specifications, they remain at 100%.

second, I also have the background image on all exhibits. I only want it on the main.

I'm not quite understanding tomcardoso's fix. Could someone please upload plugin.random_full_background.php with the fix?

ir0nma1den / 2010-07-25 22:19:39   

I'm having 2 problems with this:

first, my background images do not resize to the browser specifications, they remain at 100%.

second, I also have the background image on all exhibits. I only want it on the main.

I'm not quite understanding tomcardoso's fix. Could someone please upload plugin.random_full_background.php with the fix?

http://www.alexdarvishian.com

ir0nma1den / 2010-07-27 00:44:08   

Wooo!

thank you tomcardoso, you were not talking out of your butt; completely right.

I still have problems with the random images not resizing to the browser.

Can someone take a look?

http://www.alexdarvishian.com

charlieg27 / 2010-07-27 03:04:43   

First of all, massive thanks to sawatzki for taking the time to write a great turorial and package all the files... Finally got it working after trawling around the threads for a while trying to find a solid solution to the random full size image question.

Everything is working fine, I have just one small problem... I'm getting a scrollbar on the right hand side of the browser (tested in FF and Chrome) even though the content is not stretching the page... and using the scrollbar doesn't seem to have any effect on the BG image or the content.

Changing the 'wrapper' div style in the CSS inserting an overflow property as 'hidden' does do the trick as you would expect it to... However I do need the page to scrollable when the user is browsing in a smaller window than my content.

Any ideas why there's always a scrollbar even though everything fits fine within the page?

charlieg27 / 2010-07-27 03:07:08   

First of all, massive thanks to sawatzki for taking the time to write a great turorial and package all the files... Finally got it working after trawling around the threads for a while trying to find a solid solution to the random full size image question.

Everything is working fine, I have just one small problem... I'm getting a scrollbar on the right hand side of the browser (tested in FF and Chrome) even though the content is not stretching the page... and using the scrollbar doesn't seem to have any effect on the BG image or the content. You can see what I mean here: www.cmgdesign.co.uk/index

Changing the 'wrapper' div style in the CSS inserting an overflow property as 'hidden' does do the trick as you would expect it to... However I do need the page to scrollable when the user is browsing in a smaller window than my content.

Any ideas why there's always a scrollbar even though everything fits fine within the page?

charlieg27 / 2010-07-27 14:58:18   

So i've been tearing my hair out all day trying to figure out what is causing this glitch, and i've tried changing overflow properties etc everywhere to test what happens. In almost all cases it has no effect, or if it does hide the scrollbar, it also hides the content if the user has their browser not 'high' enough. As an example of this plugin working properly, I compared my code both in styles.css and index.php with verena's site and nothing seems different (except for that her site is only loading the image on her main page, which is probably irrelevant). Also the code in the plugins seems to be the same (ie unchanged except paths to the image folder).

Anyone able to take a quick look and let me know if i'm missing something? It's driving me crazy! For now I might try making the image slightly smaller, but I can't see how it could possibly be effecting the pages in this way...

www.cmgdesign.co.uk/index

(problem described in post above, vertical scrollbar appearing on all pages with small space to scroll)

L124C41 / 2010-07-29 21:00:20   

Hello everyone,
I need help to find it is exactly what I have to change to get background image on the home page.No just want the images are repeated in all the exhibits.
Because it is so easy so simple that I do not get it to work. :(

Thanks

L124C41 / 2010-07-29 21:13:38   

Hello everyone,
I need help to find it is exactly what I have to modify in the plugin "rnd-full-background" to get background image on the home page only and only on the home page.
Because it is so easy so simple that I do not get it to work.

Thanks

ir0nma1den / 2010-08-05 21:56:43   

I still cannot figure this out. Why do my background images not resize to the browser, but instead remain at 100%? I've checked everything, and I cannot find the problem.

Help?

http://www.alexdarvishian.com/

lpng / 2010-08-06 11:04:28   

Thanks for the dmg, I could easily switch from the classic full background scalable to the full random background scalable by commenting parts of my index.php and replacing them with your plugin. Sweet and easy, thanks swatzki : )

lpng / 2010-08-06 11:04:47   

Thanks for the dmg, I could easily switch from the classic full background scalable to the full random background scalable by commenting parts of my index.php and replacing them with your plugin. Sweet and easy, thanks sawatzki : )

Hicklet / 2010-08-10 00:38:14   

Thanks sawatzki
Finally managed to get somewhere with the random background, although I keep getting a error message quickly before the image loads, see here if anyone can give me a clue, i'm guessing I've got two plugins trying to work and one isn't?

thanks for indexhibit!

Hicklet / 2010-08-10 09:03:46   

Sorry right link this time...

dbutaeye / 2010-08-12 13:33:51   

Hello
I'm new (and french, sorry for the english...) and first of all I thank everybody who work here. Indexhibit is a wonderful thing that allows me to envisage the website I was dreaming about since long. So I have a question about this random full background : since one day now, I try to center the fullframe picture for the cases where the proportions of the picture and the window are not the same. Does someone know how to do that? Thanks so much... I'm sorry if this question has been already solved, I haven't found it.
My site : damien

charlieg27 / 2010-10-01 19:03:46   

Hello again everyone.

Fairly simple probably, but I want to add the effect i'm using on my indexhibit site (the random background effect, which scales to fit the size of the window) on my splash page for my indexhibit site. The splash page is completely outside of indexhibit's file/formatting structure etc, which may well mean it's actually a lot simpler than implementing it on indexhibit.

It would be just one standard HTML page and the only content will be an overlaid flash swf file, so it won't be complex in terms of the build.

betsbillabong / 2010-10-08 15:52:15   

Hi everyone,

I've been wrestling with the random_full_background.php plug-in all week. Huge thanks to Sawatzki for providing the .dmg and instructions and to ArsonDPI who helped me with some issues. I still had trouble, but I think I have it all figured out.

A couple of things I learned that may be helpful for others having trouble getting the plugin to resize the pages or limiting the plugin to the main page only:

(1) If you are using the expanding menu code, put the script that lists the numbers of windows that you close at the very end of your code, just before (/head). Sawatzki's instructions tell you to put the full_background.js at the very end, but when you switch them it works, at least for me.

(2) THANK YOU TOM CARDOSO! above for helping me to limit the random full background to my main page only. The commented instructions in the random_full_background.php, while extremely helpful and organized, I think are actually wrong. Like Tom, I was also getting straight-out errors when changing that code. So to reiterate his advice:

- first, un-comment the code at the top, as per instructions
- second, do NOT un-comment the code at the end (the brackets with the 'else') keep it commented
- third, add a single closing bracket ( like this: } ) just above 'return;' so it should like this at the end:


}
return;
}



I hope that helps someone! And I hope I don't need to recode this for a long time ;-)

BB

betsbillabong / 2010-10-08 16:26:38   

Actually, I thought I was done but I'm not. One last thing:

I found that after enabling the 'main page only' function of the random_full_background.php by the steps above, that I was unable to select background images from the indexhibit interface.

So - I uncommented the default background color/image plug:

(plug:backgrounder color='', img='', tile='' /)

And this is mostly working. But the pictures that I choose as background the normal way, ie selecting 'choose file' in the pale yellow square of the exhibit interface, do not get resized.

Does anyone know if it's possble to resize them?

Website in progress here

Zipped index.php here

Zipped full_random_background.php with changes here

Thank you...

This thread has been closed, thank you.