Adding a footer menu to Buddypress fun

Hi

Please can someone tell me how I can add a menu to the footer of my site running using buddypress fun?

I can’t seem to find a solution anywhere, only the 2 header menu options.

Thanks

Sally

  • aristath
    • Recruit

    Hello again @sally,

    how I can add a menu to the footer of my site running using buddypress fun?

    The BuddyPress Fun theme does not support custom menus in the footer.

    If you want to do this you would basically have to custom-code this and add a custom widget area to the footer… are you using a child theme?

    Please advise,

    Ari.

  • Sally
    • The Crimson Coder

    Thanks Ari, Ok I now have a shortcode, but where do I find what to surround the shortcode with in the editor so it knows I want this to be in the footer? At the moment all I have in there is

    /*

    Theme Name: bp-fun

    Theme URI: http://wordpress.org/themes/bp-fun

    Description: Buddy Press Fun Theme

    Author: WPMU

    Author URI: http://wpmu.com

    Template: bp-fun

    Version: 1.4.5

    */

    @import url(“../bp-fun/style.css”:wink:;

    /* =Theme customization starts here


    */

    So I presume I put the shortcode ^here^, but just not sure how it will know I mean it to be for the footer :slight_smile:

  • Patrick
    • Support Monkey

    Hi @sally

    To begin with, the code you just posted above is not a child-theme. That is the style-sheet for the BP-Fun theme itself.

    To make things as easy as possible for you, our themes come with a child-theme included in theme. For the BP-Fun theme, first download it to your computer if you haven’t already.

    Then unzip it and open the bp-fun folder inside. Inside that, you’ll find another folder called themes. Open it. Inside that is the ready-made child-theme called bp-fun-child.

    That is the child-them you want to customize, upload to your site and enable.

    To add custom menu functionality to the footer of your child-theme, you’ll need to copy the footer.php file from bp-fun to bp-fun-child.

    Then add the following where you want the menu to appear in the child-theme footer:

    <?php wp_nav_menu( array( 'theme_location' => 'footer-nav', 'menu_class' => 'nav-menu' ) ); ?>

    Best place would likely be just under where you see this:

    <div id="footer">

    Next, you need to register your new menu. In a text editor like Notepad++, create a file called functions.php and paste the following in it:

    <?php

    if ( function_exists( 'register_nav_menus' ) ) {
    register_nav_menus( array(
    'footer-nav' => __( 'Footer Navigation',TEMPLATE_DOMAIN ),
    ) );
    }

    ?>

    Now you can upload your bp-fun-child theme, including your custom footer and functions files, to your site and enable it.

    When you go to Appearance > Menus, you will now see that you can assign a custom menu to the Footer Navigation.

    Note that we haven’t yet added any style rules to the new menu, so everything will display in a single column. That’s the next step; but first, get the thing to display in your child-theme.

    We’ll work from there.

    :slight_smile:

  • Sally
    • The Crimson Coder

    Thanks Patrick,

    I think I’ve done everything you asked me to… well in a fashion as I had already installed the child theme, I was just having a mental block when showing you that code. So anyway, I’ve added to the child theme I had, and the menu now displays in the footer, but in addition to this I also have some ugly black text appearing on all pages suddenly :disappointed: Any ideas what I’ve done wrong here?

    Thanks!

    Sally

  • Jack Kitterhing
    • Code Norris

    Hi there Sally,

    Hope you’re well today and sorry to hear of the issues your having here, do you have access to the wp-admin at all?

    If you do, can you disable the child theme and the stop spammer registration plugin please, and then see if it’s working correctly?

    If you don’t have access this can be done via the cPanel > file manager :slight_smile:

    Thanks!

    Kind Regards

    Jack.

  • Sally
    • The Crimson Coder

    Hi Jack

    Just activating the main buddypress fun theme rather than the child theme fixes this, so I’m pretty sure this is the child theme I have just edited.

    Should the functions file in the child theme look like this?

    <?php

    /**

    * Register our sidebars and widgetized areas.

    *

    */

    function arphabet_widgets_init() {

    register_sidebar( array(

    ‘name’ => ‘Home right sidebar’,

    ‘id’ => ‘home_right_1’,

    ‘before_widget’ => ‘<div>’,

    ‘after_widget’ => ‘</div>’,

    ‘before_title’ => ‘<h2 class=”rounded”>’,

    ‘after_title’ => ‘</h2>’,

    ) );

    }

    add_action( ‘widgets_init’, ‘arphabet_widgets_init’ );

    ?>

    <?php

    if ( function_exists( ‘register_nav_menus’ ) ) {

    register_nav_menus( array(

    ‘footer-nav’ => __( ‘Footer Navigation’,TEMPLATE_DOMAIN ),

    ) );

    }

    ?>

    and the footer.php look like this?

    </div><!– end content –>

    <?php do_action( ‘bp_after_content’ ) ?>

    <?php do_action( ‘bp_before_footer’ ) ?>

    <div id=”footer”>

    <?php wp_nav_menu( array( ‘theme_location’ => ‘footer-nav’, ‘menu_class’ => ‘nav-menu’ ) ); ?>

    <div class=”fleft”>

    ©<?php echo gmdate(‘Y’:wink:; ?> ” href=”<?php echo home_url(); ?>”><?php bloginfo(‘name’:wink:; ?>

    <?php echo wp_network_footer(); ?><?php do_action( ‘bp_footer’ ) ?>

    </div>

    <div class=”fright”>

    <span id=”wblk”><?php _e(‘Go back to top ↑’, TEMPLATE_DOMAIN); ?></span>

    </div>

    </div>

    <?php do_action( ‘bp_after_footer’ ) ?>

    <div id=”footer-end”><?php do_action( ‘bp_footer’ ) ?>
    <?php wp_footer(); ?></div>

    </div><!– end container –>

    <?php do_action( ‘bp_after_container’ ) ?>

    </div><!– end wrapper –>

    </body>

    </html>

  • Patrick
    • Support Monkey

    Hi again @sally

    Your footer code looks just fine. But whoops, there is a problem in your functions.php file: you have closed and then re-opened php tags in there. That will definitely throw errors like the ones at the top of your site.

    When you add functions to an existing functions.php file, do not include any opening and closing php tags from the code snippet as there should only be one such tag at the very beginning of the file (to open php) and one at the end (to close it).

    Change your functions.php to this and it should be OK:

    <?php
    /**
    * Register our sidebars and widgetized areas.
    *
    */
    function arphabet_widgets_init() {

    register_sidebar( array(
    'name' => 'Home right sidebar',
    'id' => 'home_right_1',
    'before_widget' => '<div>',
    'after_widget' => '</div>',
    'before_title' => '<h2 class="rounded">',
    'after_title' => '</h2>',
    ) );
    }
    add_action( 'widgets_init', 'arphabet_widgets_init' );

    if ( function_exists( 'register_nav_menus' ) ) {
    register_nav_menus( array(
    'footer-nav' => __( 'Footer Navigation',TEMPLATE_DOMAIN ),
    ) );
    }
    ?>

  • Patrick
    • Support Monkey

    Hi @sally

    The easiest way to add any custom CSS you need/want to your site is by using a handy plugin like this one:

    http://wordpress.org/plugins/my-custom-css/

    Then add this to snap your new footer menu into shape (it’ll look just the top menu):

    #footer .navigation #nav li#home a, #footer .navigation #nav li.selected a, #footer .navigation #nav li.current_page_item a {color: #FFFFFF !important; background: #000000;}
    #footer #nav ul li a, #footer #nav ul li a:hover {padding:1px 10px; width:auto;}
    #footer .navigation ul {margin-bottom:10px;}

    You can see an example of how it would look here:

    http://patrickcohen.net/fiddler/

  • Sally
    • The Crimson Coder

    Hi Patrick

    Thanks for the code, that’s the part I struggle with. I don’t know how to create CSS :slight_smile:

    I’ve added it using the custom CSS plugin I already have installed (http://johnregan3.github.io/simple-custom-css/) but it doesn’t seem to have made a difference.

    I’ve added lots of extra menu items so I will know when it snaps into shape, but it just seems to be staying in one long line.

    Is this because of the plugin I’m using or something else?

    Thanks

    Sally

  • Patrick
    • Support Monkey

    Hi @sally

    My bad, I neglected to double-check the container IDs & classes on your site. The code above appears to be specific to my test site, sorry about that.

    This simpler bit should snap your footer menu into shape:

    #footer #menu-footer-bar-menu li a {color:#ffffff; float:left; margin:2px 10px; padding:2px 5px;}
    #footer #menu-footer-bar-menu li a:hover {background:#000000;}

  • Patrick
    • Support Monkey

    Hi again @sally

    You’re very welcome!

    I just took another look at your site, and the footer menu looks great.

    You may want to add this little bit also, just to pop the copyright notice underneath the menu items instead of sitting lopsidedly next to them.

    #footer .fleft {clear:both;}

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.