Random background image along with child theme

  • Resolved r99photography

    (@r99photography)


    8 years, 3 months ago

    Hello,
    I have tried searching here and on the net, despite many discussions, nothing was useful to solve my situation.
    I use a child theme and I customized the login screen page. Now I would like to create a background with random pictures. This is currently my setup:

    CHILD_THEME: the directory with functions.php, style.css and the folder CUSTOM_LOGIN.

    CHILD_THEME/CUSTOM_LOGIN: it has the custom_login_style.css and the folder BACKGROUNDS, where are stored background pictures to be randomized.

    My reference page was this one: website

    Based on that link, I added in the NAME_CHILD_THEME/functions.php file this code:

    /*** RANDOMIZE BACKGROUND IMAGE ***/
function displayBackground()
{
	$dir = 'custom_login/backgrounds/';
	$cnt = 0;
	$bgArray= array();

	 		/*if we can load the directory*/
	if ($handle = opendir($dir)) {

		/* Loop through the directory here */
		while (false !== ($entry = readdir($handle))) {

		$pathToFile = $dir.$entry;
		if(is_file($pathToFile)) //if the files exists
		{	

			//make sure the file is an image...there might be a better way to do this
			if(getimagesize($pathToFile)!=FALSE)
			{
				//add it to the array
				$bgArray[$cnt]= $pathToFile;
				$cnt = $cnt+1;

			}

		}	

	}
	//create a random number, then use the image whos key matches the number
	$myRand = rand(0,($cnt-1));
	$val = $bgArray[$myRand];

}
closedir($handle);
echo('"'.$val.'"');
}

    Then, in the CHILD_THEME/custom_login_styles.css I added this code:
    background: url(<?php include'../functions.php'; displayBackground();?>);

    When I reload the login page, no background picture is being shown. For some reason my code is not correct. Yeah, I know, it may have many mistakes, but
    I am not either an expert of PHP nor CSS, so please my apologize for this common and probably already discussed issue.
    Thanks for your help.

    Thanks.
    Riccardo

Viewing 4 replies - 1 through 4 (of 4 total)

  • You’re putting PHP inside a CSS file, it’s not going to work. Yo uneed to hook into the login page’s header and output the PHP there. You would need to do something like:

    function my_login_background() {
	?>
	<style>
		body {
			background-image: url(<?php displayBackground(); ?>);
		}
	</style>
	<?php
}
add_action( 'login_head', 'my_login_background' );

    I’m just not sure 100% what the output of displayBackground() looks like, so this might not be 100% correct.

    Thread Starter r99photography

    (@r99photography)

    Hello Jacob and thanks for your reply.
    Unfortunately, your suggestion does not fit my needs. I should edit the file responsible for login, which changes every time a new wordpress core engine being released.
    For that reason, I want to use the functions.php file in the child theme and the respective CSS stylesheet.
    I am sorry, but it is not good for me.

    Thanks.
    Bye.

    Riccardo

    I don’t understand the issue. This is just code you would add to your child theme. What does new releases have to do with it?

    Thread Starter r99photography

    (@r99photography)

    EDIT:
    Ok, for someone also interested in.
    Looking at Nathan Ingram blog and Dan Benjamin’s post here, I got the solution.
    So, recap.

    1. Create in the Child Theme (if available on your theme WP installation) a folder called something like: CUSTOM_LOGIN
    2. Put within: a) your customized logo, b) the CSS stylesheet, c) a folder with backgrounds and ROTATE.php file. The code of Rotate.php file is on links provided above.
    3. In your custom CSS stylesheet point the background image to ROTATE.PHP using this simple code:

    .classe-name {background: url(backgrounds/rotate.php);}

    I don’t know if the code in rotate.php is good or not, too much complex or not, but in my case It works effectively.

    Thanks, hope to be useful to other guys in my same situation.
    Bye.

    Riccardo

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Random background image along with child theme’ is closed to new replies.