BuddyBoss Home – Web Support Forums Themes Boss. theme [Request] The Boss should have a Landing Page in parallax

Viewing 10 posts - 1 through 10 (of 10 total)
  • Question

    #40985
    @cristiano

    The Boss should have a Landing Page in parallax, could be a plugin or a custom page.

    Answers

    #40988

    Alyssa
    Participant
    @alyssa-buddyboss

    @cristiano I’ll pass this along to the developers but aren’t there any plugin that can help you accomplish this?

    #45558
    @localp

    Hi @tjchester, am I correct in my understanding that in order to build a landing page, I will have to set a static front page and alter the child theme’s style.css? Or is there a CSS file that is specifically applied to the default Front Page that I am not aware of?

    My goal is to have a landing page similar to this: http://demos.bavotasan.com/arcade/
    From the login page and beyond would be the default Boss. theme.

    Also, is it not better to cut down on the number of plugins used to avoid potential future conflicts with the theme upgrades? I feel that providing a parallax scrolling option for a landing page is a reasonable request.

    #45601
    @vapvarun

    Hi @localp, It is already added as suggestion for our theme, You can easily create landing pages using any page builder plugin, like
    https://wordpress.org/plugins/siteorigin-panels/
    http://codecanyon.net/item/visual-composer-page-builder-for-wordpress/242431

    Regards
    Varun Dubey

    #45631
    @localp

    Hi @vapvarun, thank you so much for your reply!

    What is the best-practice way to create a landing page without using a plugin?
    I actually prefer to learn the nitty-gritty parts of WordPress, and would love to have input from the pros 🙂

    #45646
    @vapvarun

    Hi @localp, other themes are also using page builder or their inbuilt page builder. Our theme do not come with any page builder.
    Regards

    #45698

    Alyssa
    Participant
    @alyssa-buddyboss

    @localp best practices you may want to create a custom page template in WordPress, see codex here: http://codex.wordpress.org/Pages#Creating_Your_Own_Page_Templates

    #47163
    @localp

    Is there any way that I can edit my replies?

    In any case, I’ve changed the code above (after line 57 in functions.php) to this, without deregistering anything BoddyBoss-related:

    if ( !is_admin() ) {
    	function register_fullpagejs_scripts_styles() {
    		wp_register_script('fullpagejs_js', get_stylesheet_directory_uri().'/js/jquery.fullPage.min.js', array('jquery','jquery-ui-core') );
    		wp_register_style('fullpagejs_css', get_stylesheet_directory_uri().'/css/jquery.fullPage.css');
    	}
    	function run_fullpagejs_front_page() {
    		register_script();
    		if( is_page('front-page') ) {
    			wp_enqueue_script('fullpagejs_js');
    			wp_enqueue_script('fullpagejs_css');
    		}
    	}
    	add_action('wp_enqueue_scripts','run_fullpagejs_front_page');
    }

    My front-page.php is this, a cut-and-paste to test out the sample code included in the fullPage.js plugin:

    <?php
    /**
     * Template Name: Front Page Template
     *
     * Description: A page template that provides a key component of WordPress as a CMS
     * by meeting the need for a carefully crafted introductory page. The front page template
     * in BuddyBoss consists of a page content area for adding text, images, video --
     * anything you'd like -- followed by front-page-only widgets in one or two columns.
     *
     * @package WordPress
     * @subpackage Boss
     * @since Boss 1.0.0
     */
    
    get_header(); ?>
    
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    	<title>No Anchor links - fullPage.js</title>
    
    	<!--[if IE]>
    		<script type="text/javascript">
    			 var console = { log: function() {} };
    		</script>
    	<![endif]-->
    
    	<script type="text/javascript">
    		jQuery(document).ready(function() {
    			jQuery('#fullpage').fullpage({
    				sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE']
    			});
    		});
    	</script>
    
    </head>
    <body>
    
    <div id="fullpage">
    	<div class="section " id="section0">
    		<h1>fullPage.js</h1>
    		<p>No Anchor Links (#)</p>
    		<img src="imgs/fullPage.png" alt="fullPage" />
    	</div>
    	<div class="section" id="section1">
    		<div class="intro">
    			<h1>More Simple yet</h1>
    			<p>Sections won't contain anchor links. It's more simple to configure but a bit more restrictive.</p>
    		</div>
    	</div>
    	<div class="section" id="section2">
    		<div class="intro">
    			<h1>URL without /#</h1>
    			<p>But back button won't work!</p>
    		</div>
    	</div>
    </div>
    
    </body>
    </html>

    After all this, I am getting a blank white page.

    Here are my current questions:

    1. What happened to the BuddyBoss header and footer? Is there some kind of conflict that I need to resolve?

    2. Do I need this in my HTML for the fullPage.js to work?

    <script type="text/javascript">
    	jQuery(document).ready(function() {
    		jQuery('#fullpage').fullpage({
    			sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE']
    		});
    	});
    </script>

    Thank you!

    #47193
    @localp

    Sorry @vapvarun and @tjchester, there was an error in the functions.php code that I posted earlier… I’ve also modified it to deregister the WordPress default jQuery to avoid the noConflict error.

    function load_cdn() {
    	if ( !is_admin() ) {
    		wp_deregister_script('jquery');
    		wp_deregister_script('jquery-ui-core');
    		wp_enqueue_script('jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js', array(), '1.11.3');
    		wp_enqueue_script('jquery-ui', 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js', array(), '1.11.4');
    	}
    }
    add_action('init', 'load_cdn');
    
    function register_fullpagejs_scripts_styles() {
    	if ( !is_admin() ) {
    		wp_register_script('fullpagejs_js', get_stylesheet_directory_uri() . '/js/jquery.fullPage.min.js', array('jquery','jquery-ui') );
    		wp_register_style('fullpagejs_css', get_stylesheet_directory_uri() . '/css/jquery.fullPage.css');
    	}
    }
    add_action('init', 'register_fullpagejs_scripts_styles');
    
    function run_fullpagejs_front_page() {
    	if( is_page('front-page') ) {
    		wp_enqueue_script('fullpagejs_js');
    		wp_enqueue_script('fullpagejs_css');
    	}
    }
    add_action('wp_enqueue_scripts','run_fullpagejs_front_page');

    The snippet in my second question above is now:

    <script type="text/javascript">
    	$(document).ready(function() {
    		$('#fullpage').fullpage({
    			sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE']
    		});
    	});
    </script>

    Attached is what I see now (the header and footer is back!), but it looks like the jQuery plugin/CSS aren’t kicking in. Am I doing something wrong, or is there a child theme behavior that I’m not aware of?

    Thank you again!

    #47226
    @vapvarun

    Hi @localp
    instead of
    if( is_page(‘front-page’) ) this will only work if your page slug is front-page

    use
    https://codex.wordpress.org/Function_Reference/is_page_template
    or
    https://codex.wordpress.org/Function_Reference/is_front_page

    Regards
    Varun Dubey

Viewing 10 posts - 1 through 10 (of 10 total)
  • The question ‘[Request] The Boss should have a Landing Page in parallax’ is closed to new replies.