RevSlider Fullscreen as homescreen

CFP

Hi Air,
fist thanks for all your support!

I have set a slide album as my main page. So where can I edit the .php file so that I can set the RevSlider as the fullscreen slider?
Code: <?php putRevSlider("home") ?>

I tried it in the header.php below "a13_theme_header();"
The RevSlider appears but below that also the album slider which is set in the settings.
I need only the RevSlider and I have no clue where to edit that.

Thank you again! Until tomorrow!

Air

Hello:-)

In your case I would create new template from page.php, and remove everything what is not needed by you, and then insert there what you need. How to create template is explained here https://developer.wordpress.org/themes/template-files-section/page-template-files/page-templates/

With kind regards.

CFP

What I need is only to change in the "Front page view" (.php file?) the code for showing the specific selected album to the slider code...

But hey, it's ok thanks.

Air

Then you can try to edit front-page.php and under if($fp_variant == 'page'){ insert what you need, like header footer and slider :-)

Of course you have to select then "Page" as your front page.

With kind regards.

CFP

Thank you for your help. Tried to insert the code below that line. But nothing works. The whole site does not load after insertion.

So I have to learn more about PHP. I thought that would be easier...

Air

Show me code you changed, not whole file but part you inserted. Have you enabled debug mode in WP for time you are working on code?

To make sure anything works in your if() add there as first line(in if) var_dump('my code works, almost!'); and check if you will see it.

With kind regards.

CFP

Here is my code:

    if($fp_variant == 'page'){
        //it makes use of real page templates instead of front-page.php
        $page_template = basename(get_page_template(), '.php');
        if($page_template !== 'page.php'){
			$var = get_page_meta(get_the_ID(), 'slider_id', true);
			
			if (empty($var)) {
            get_template_part( $page_template );
			}
			
			elseif (isset($var)) {
			putRevSlider( get_page_meta(get_the_ID(), 'slider_id', true) );
			}
        }
        else{
            get_template_part( 'page' );
        }
    }

CFP

I don't want to ruin the theme I just want to have the ability (with the meta tags) to set a RevSlider as a main page behind the existing menu and footer like (now) in the blogposts.

Air

It wont display anything, cause you are only giving it to display slider, no header no footer.

Air said: insert what you need, like header footer and slider :-)

Try more like this:

...
			elseif (isset($var)) {
			    get_header();
			    putRevSlider( get_page_meta(get_the_ID(), 'slider_id', true) );
			    get_footer();
			}
...

See page.php for more parts you may need.
But for most make sure that your condition actually runs at all.

With kind regards.

CFP

Ok, thank you. I guess I have done it but I had to delete everything in this if().

But now there is a css problem. On the desktop it works great. But on mobile devices there is a gap under the slider.
First there was a gap on top and I fixed it with:

.page-id-682 #mid::before {
height: 0px;
}


Also for the mobile:
@media only screen and (max-width: 1024px) {
.page-id-682 #mid::before {
height: 0px !important;
}
}

Is there a way to fix this?

Air

Live link if you want me to know what you mean and help :-)

CFP

http://www.friedsamphotography.com

Now I have on the desktop size that the slider (in height) is now under the footer, so it is scrollable wich I do not want to. And in "iPhone Landscape" you can scroll the slider up with a white gap underneath.

CFP

I had to take it back. Could not leave the website like this.

It would be very handy if you can show me only the code sentence, where the front page single gallery is shown. So that I can change only this code line.

Because the single album is fullscreen and as I like the slider should be.

Air

I don't know exactly what you mean, and need. I assume you want some magic to happen, but I will wait till you explain more.

Remember that Revolution slider has its own setting for setting slider full screen.

With kind regards.

CFP

Yeah I love some magic
I know that the RevSlider do have its own settings. And it is set just right that it will fit like it should

I don't know how to explain further. It's all about the first page. I need the exact equivalent of your (photon) front page looking if it set to display a single album in the slider full screen mode. Only instead of your album the RevSlider one.

Maybe my thinking is a little to easy for that and it is more complicated to integrate it. Or it is very easy and my explanation is to complicated

I think there must be somewhere a code line wich calls the dedicated single album, right?
This is what I want to change to the RevSlider one. So that the front page will not call the photon single album to show right on the front page, it should call the RevSlider instead. But to keep the rest the same also in the same position (menu, footer, etc.).

And it should call the RevSlider only if I add a custom meta tag (slider_id) to the main page. Otherwise it should do that for which it is predicted to do. Call the single album, call the album gallery and so on.

Air

Like I said before set your front page to be page. http://apollo13.eu/docs/photon/#!/adding_frontpage

Rest you have done in code. Don't confuse your self with single album, you are and should be using page now.

All "magic" is done in front-page.php

With kind regards.

CFP

I got it to work in desktop mode. The only "issue" I have was that the RevSlider (in height) was behind the footer. So I could scroll down. This I have fixed in the settings of the RevSlider itself. I have set it to ignore the height of the footer. But! On mobile devices like on my iPhone then it hast a huge gap underneath the slider. The height of the gap was the height of the ignored footer in the RevSlider settings.

But I see I have to experiment a lot more on this to get it right.

Air

If you can then set some hidden page with this slider so I can take a look. If this page is not currently your front page, you can easily give me link to it.

With kind regards.

CFP

Now I have set it on my page: http://www.friedsamphotography.com
Take a look.

But you can still scroll a tiny bit on the desktop view...
And with Firefox you will see it also in the desktop view. It doesn't fit.

Air

Try such custom CSS, however I am not sure if it will work. It is try for desktop resolution

body.home #mid {
    padding-bottom: 0;
}

CFP

Awesome. That works. Had to add also margin-top: 0; but now its perfect. Thank you.

front-page.php

	if($fp_variant == 'page'){
		//it makes use of real page templates instead of front-page.php
		$var = get_post_meta(get_the_ID(), 'slider_id', true);
		
		if (empty($var)) {
        $page_template = basename(get_page_template(), '.php');
        if($page_template !== 'page.php'){
            get_template_part( $page_template );
        }
        else{
            get_template_part( 'page' );
        }
		}
		
		elseif (isset($var)) {
		get_header();
		putRevSlider( get_post_meta(get_the_ID(), 'slider_id', true) );
	    get_footer();
		}
		
	}

CSS (page-id-682 is the page itself, in my case the 682)

.page-id-682 #mid::before {
	height: 0px !important;
}

body.home #mid {
    padding-bottom: 0 !important;
    margin-top: 0 !important;
}

And in the RevSlider you have to exclude ".footer"

Air

That is great :-)

Instead of page-id selector you could use body.home, so you don't need to look for your page ID:-)

With kind regards.

CFP

Ok thanks.

To complete this changes it would be great if you can tell me where the function is when I hit the top right button to hide everything but not the content itself?

Air

O yeah.

You will be interested in js/script.js line ~1155:

fullScreen : function(){

A bit lower you will find:

//if this is album or albums list we act a bit different
if( $body.is('.single-album, .albums-list-page, .posts-list, .single-product, .post-type-archive-product, .tax-product_cat') || G.full_screen_behaviour === 'content' ){
	to_hide = to_hide.not(mid);
}

You can add there your .home selector and it should work fine, like this:

//if this is album or albums list we act a bit different
if( $body.is('.home, .single-album, .albums-list-page, .posts-list, .single-product, .post-type-archive-product, .tax-product_cat') || G.full_screen_behaviour === 'content' ){
	to_hide = to_hide.not(mid);
}

With kind regards.

CFP

Yeah thats it.
Is there a way to include it in the child theme?
I add this to the functions.php but it does not override the parent theme one.

function custom_script_fix()
{
    wp_dequeue_script('apollo13-scripts');
	wp_enqueue_script('child-apollo13-scripts', get_stylesheet_directory_uri().'/js/script.js', array(), true );
}
add_action('wp_enqueue_scripts', 'custom_script_fix');

Air

Try changing last line to:

add_action('wp_enqueue_scripts', 'custom_script_fix', 28);

However I am afraid it could break everything cause dependencies of script are lost in this case.

I believe you will have to do same tactic I did in a13_child_style() function in functions.php in child theme and first copy dependencies. However it might use some other variable then $wp_styles. I never did it, so you have to dig around to see is there anything similar for scripts also.

Good luck!

If you wont be able to do it then I will dig around.

With kind regards.

CFP

I tried a lot, also with a different delay time. But it will break the whole script.
The child theme functions.php will load before the parent one. But I did not dare not to load the parent one.

So I will continue to try to find a solution here. But for now I did the changes right in the parent one.

Air

I will take a look how to do it, cause I am also interested. I don't promise it will be today, but hopefully soon.

With kind regards.

CFP

Ok. I think it might be better to put these changes right in the functions.php. Only this particular one without loading the whole script with changes inside. Its better for future updates. So that only the ".home" will be added right out of the functions.php to the script function itself.