Product Theme: Add/move login-box and add a third widget

Hi,

I'm using the Product Theme and love it!! I'm would tough like to add/modify two important features,

1. The Login-box is not located in a good spot, hence users have hard time finding it (especially the new ones). I would like to have a login-box at the top of the main page (just below the menu), something like Corporate Theme (where it is a streched login-field-box).
How can I make theese changes and where do I do them? Have tried some coding with the support from Firebug, but cannot get it completely right. :slight_frown:

2. I would like to have a third widget area - just where the login-box and member search is. That would be to add a third (right-located) widget at the bottom of the page. Have tried to add a widget with the tutorial from Tammie - where he shows how to add a widget in the BP-defeault theme. I fail once more.

Any advice or manuals for this?
Hope to get some answers, cheers!

  • Mason

    Hiya! Glad you're enjoying the theme. The Product Theme is one of my favorites as well. :smiley:

    Could you provide a link to your site? It really helps us see what's going on and provide good instruction. Especially when you're talking about something customized like a login area.

    2. I would like to have a third widget area - just where the login-box and member search is.

    I'm assuming you're using BuddyPress on this site. Assuming this, we'll need to make edits to 2 files. Here we go! :smiley:

    1. Go to product>library>sidebars>bp-sidebar-home.php We'll need to delete lines 21-88. Yep. All of it.
    In it's place, we're gonna insert this:
    <div class="sidebar-box">
    <?php if ( !function_exists('dynamic_sidebar')
    || !dynamic_sidebar('homeright-sidebar') ) : ?>
    <div class="widget-error">
    <?php _e( 'Please log in and add widgets to this column.', 'buddypress' ) ?> /wp-admin/widgets.php?s=&show=&sidebar=homeright-sidebar"><?php _e( 'Add Widgets', 'buddypress' ) ?>
    </div>
    <?php endif; ?> </div>

    2. We'll need to edit product>_inc>css>layout.css Go to line 290 and edit .sidebar-box I'd lower the margin-right property to 10px.

    Now you should be good to go. Remember these customizations will get over-written if you ever update the theme, so make note of your changes and keep a backup!

  • lisalove

    Hello!

    How nice to get some feedback straight away, thanks!

    Login-box-field:
    My apologize, didn't think of pasting my url: http://crossbook.se. And if you go here: http://crossbook.se/test you can see what I mean with the login-box-field. Is it possible to apply an streched out login-field as Corporate have, onto the Product theme (under the main menu)?

    The third widget:
    I tried your two steps with some sucess. :slight_smile:
    I did keep lines 21-88, hence I don't want to remove the login-box from the page untiI I have a "new login-box-field" as mentioned above.

    So, what happened after step1 and 2? When visting the site I could see the message "Please log in and add widgets to this column". However, when I tried to do that in wp-admin/widgets.php there was no homeright-sidebar to add anything in to...
    So something is missing, I belive some code must be put in to functions.php aswell?

    Tried with this code at line 44 in functions.php:

    register_sidebar(array(
    'name' => 'homeright-sidebar',
    'before_widget' => '<div id="%1$s" class="widget %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3 class="widgettitle">',
    'after_title' => '</h3>'
    )
    );

    The result: sucess with a brand new widget underneath the login-box on the home-page. PROBLEM: it looks like this on a singel page and on the blog-page: http://crossbook.se/om-2 . As you can see the log-in box has changed place with the middle-sidebar in some strange way. I belive I added the code into the functions.php on the wrong line?

    Would be very glad to get some further instructions or advise on this.
    So far - thanks for your effort, appreciate it!

  • lisalove

    PROBLEM: it looks like this on a singel page and on the blog-page: http://crossbook.se/om-2 . As you can see the log-in box has changed place with the middle-sidebar in some strange way.

    Fixed this by changing to a smaller widget (had i video-widget). Hm, still don't know if I put in the correct code in the functions.php?

    Any new suggetsions on how to create a login-box on the upperside of the front page?

  • Mason

    Hiya,

    You do have the correct coding for functions.php so that's good to go. Are the widgets all showing the way you want?

    Any new suggetsions on how to create a login-box on the upperside of the front page?

    I looked briefly at this and the plugins are setup differently so there's not a simple copy/paste solution to recreate the bp-corporate login in the product theme. I can point you in the right direction, but if coding isn't your thing you may want to look at hiring a developer to do this for you. It shouldn't take too much work for this kind of customization.

    Anyway, that being said you're going to want to look at the code in header.php of bp-corporate - specifically: lines 264-323
    You could drop them in product>library>components>signup-box.php
    Then drop profile.php from bp-corporate into your theme's root directory.
    Finally you'll want to do a good bit of CSS styling to get things going right.

    This is a quick and dirty hack. It'd need some work to be perfected, but I hope it helps! :smiley:

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.