radio buttons = wrong font colour on BP Scholar; fields next to instead of beneath field labels

Started a new thread, cos this problem is still unresolved for me, but it's embedded in the middle of the old thread...

I've noticed that if I choose radio buttons or check boxes for the Profile Field Setup in Buddypress the font colour changes to black, whereas the rest of the fonts stay the customised colour (in the pic is not that clear, cos my customised colour is dark grey). I thought it may be a BP problem, but I've got BP loaded on my other subdomain with the default theme and it works just fine with the radio buttons there.

Also with scholar the fields are next to their labels for some fields (drop downs etc) but beneath for others (radio buttons, text fields) - which makes it all look a little messy. I prefer the look on the default page which is all fields beneath the field description.

Please give me the EXACT code to cut and paste on my child sheet. I think I've exhausted all brain power to figure out what goes where without some hand holding :slight_smile: Please!

See image

  • Cratar

    ok I see what you're saying - what I meant by "customising" was simply that I had customised colours in the custom styling tab that comes with bpscholar. That's all the customising I've done intentionally. But, perhaps I did inadvertently change something so herewith is my child.... I remember reading somewhere on the forums that the scholar fields were adjusted to accommodate people who had requested that the fields appear next to the labels/text ... Is that right? Not entirely sure :slight_smile:

    another question for you not quite related... how do I change the default page for "categories" to a 3-column?

  • Cratar

    ok cutting and pasting instead, since upload didn't take...

    /*/

    }

    #navcontainer{
    height: 30px;
    }

    #navigation-wrapper{
    height: 25px;
    }

    }
    .sf-menu li:hover ul,
    .sf-menu li.sfHover ul {
    left: 0;
    top: 25px; /* match top ul list item height */
    z-index: 99;
    }

    /*navigation*/

    .pagination{
    padding-bottom: 10px;
    }

    .sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
    z-index: 998;
    }
    .sf-menu {
    line-height: 1.0;
    }
    .sf-menu ul {
    position: absolute;
    top: -999em;
    width: 10em; /* left offset of submenus need to match (see below) */
    }
    .sf-menu ul li {
    width: 100%;
    }
    .sf-menu li:hover {
    visibility: inherit; /* fixes IE7 'sticky bug' */
    }
    .sf-menu li {
    float: left;
    position: relative;
    }
    .sf-menu a {
    display: block;
    position: relative;
    }
    .sf-menu li:hover ul,
    .sf-menu li.sfHover ul {
    left: 0;
    top: 25px; /* match top ul list item height */
    z-index: 99;
    }
    ul.sf-menu li:hover li ul,
    ul.sf-menu li.sfHover li ul {
    top: -999em;
    }
    ul.sf-menu li li:hover ul,
    ul.sf-menu li li.sfHover ul {
    left: 10em; /* match ul width */
    top: 0;
    }
    ul.sf-menu li li:hover li ul,
    ul.sf-menu li li.sfHover li ul {
    top: -999em;
    }
    ul.sf-menu li li li:hover ul,
    ul.sf-menu li li li.sfHover ul {
    left: 10em; /* match ul width */
    top: 0;
    }

    /*** DEMO SKIN ***/
    .sf-menu {
    float: left;
    margin-bottom: 1em;
    }
    .sf-menu a {
    padding: 8px;
    text-decoration:none;
    }

    .sf-menu li:hover, .sf-menu li.current, .sf-menu li.current a:visited, .sf-menu li.current_page_item, .sf-menu li.current_page_item a:visited, .sf-menu li.sfHover,
    .sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
    outline: 0;
    }

    /*** arrows **/
    .sf-menu a.sf-with-ul {
    padding-right: 2.25em;
    min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
    }
    .sf-sub-indicator {
    position: absolute;
    display: block;
    right: .75em;
    top: 2em; /* IE6 only */
    width: 8px;
    height: 8px;
    text-indent: -999em;
    overflow: hidden;
    background: url('../images/arrows-ffffff.png') no-repeat -10px -100px !important; /* 8-bit indexed alpha png. IE6 gets solid image only */
    }
    a > .sf-sub-indicator { /* give all except IE6 the correct values */
    top: 20px;
    background-position: 0 -100px; /* use translucent arrow for modern browsers*/
    }
    /* apply hovers to modern browsers */
    a:focus > .sf-sub-indicator,
    a:hover > .sf-sub-indicator,
    a:active > .sf-sub-indicator,
    li:hover > a > .sf-sub-indicator,
    li.sfHover > a > .sf-sub-indicator {
    background-position: -10px -100px; /* arrow hovers for modern browsers*/
    }

    /* point right for anchors in subs */
    .sf-menu ul .sf-sub-indicator { background-position: -20px 0; }
    .sf-menu ul a > .sf-sub-indicator { background-position: 0 0; }
    /* apply hovers to modern browsers */
    .sf-menu ul a:focus > .sf-sub-indicator,
    .sf-menu ul a:hover > .sf-sub-indicator,
    .sf-menu ul a:active > .sf-sub-indicator,
    .sf-menu ul li:hover > a > .sf-sub-indicator,
    .sf-menu ul li.sfHover > a > .sf-sub-indicator {
    background-position: -10px 0; /* arrow hovers for modern browsers*/
    }

    /*** shadows for all but IE6 ***/
    .sf-shadow ul {
    background: url('../images/shadow.png') no-repeat bottom right;
    padding: 0 8px 9px 0;
    -moz-border-radius-bottomleft: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    }
    .sf-shadow ul.sf-shadow-off {
    background: transparent;
    }

    /*font fiddling*/
    h2{
    font-weight: normal;
    font-size: 14px;
    text-align: left;
    padding: 15px 0px 0px 0px;
    }

    h3{
    font-weight: bold;
    font-size: 14px;
    }

    .h3-background h3{
    font-size: 14px;
    }

    h4{
    font-size: 14px;
    }

    input[type="button"], .button{
    font-size: 14px;
    font-weight: bold;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    textarea{
    font-size: 12px;
    font-weight: normal;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    input[type="submit"]{
    font-size: 14px;
    font-weight: normal;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    input[type="text"]{
    font-size: 12px;
    font-weight: normal;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    input[type="search"]{
    font-size: 12px;
    font-weight: normal;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    input[type="password"]{
    font-size: 12px;
    font-weight: normal;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    /*bolding nav bar*/

    select{
    font-size: 12px;
    font-weight: bold;
    font-family: Tahoma, Helvetica, Sans-serif;
    }

    #login-bar{
    text-align: left;
    }

    #navcontainer{
    text-align: left;
    }

    .sf-menu{
    font-size: 14px;
    }

    #sidebar{
    text-align: left;
    }

    #sidebar li, #footer li
    {
    list-style: none;
    text-align: left;
    }

    table{
    text-align: left;
    }

    textarea{
    font-size: 12px;
    font-weight: normal;
    }

    #message{
    text-align: left;
    }

    .sf-menu, .sf-menu * {
    margin: 0;
    padding: 0;
    list-style: none;
    font-weight: bold;
    z-index: 998;
    }

    #register-page input[type="checkbox"] {
    clear: both;
    }

    #add-event-form label {
    display:block;
    }
    label{
    color: #474747;
    }
    <?php if (function_exists('comment_form_text_output')){ comment_form_text_output(); } ?>//

  • Tammie

    @Cratar: You may want to remove the php from your css file :slight_smile:


    <?php if (function_exists('comment_form_text_output')){ comment_form_text_output(); } ?>//

    That aside, you are correct the fields are as they are due to a request by users. You will want to add css to make it work differently.

    Now you will in doing what I'm about to paste have it occur for all labels but if you do not want for all just do a call to that form before the label.


    label{
    clear: both;
    }

    That should allow it to clear the floating but will do it in all cases on a one by one you need to just add in to the specific form like you've done by display: block in label in your own css.

    As for the 3 column take a look at the template-3column.php that shows the format and you'd need to apply that to archive.php to get for categories.

  • Cratar

    Thanks @Tammie for the form info.

    - re 3 column - I did take a look at the two php files - and my knowledge is too limited to make head or tail of it. Please could you tell me what of the template-3column I need to apply to the archive.php - as in, please paste the code here and tell me where in the archive I need to post it! I did some fiddling with some success but I'm nervous of breaking something again! :slight_smile:

  • Tammie

    @Cratar: I can only suggest theory as haven't done it myself as a custom edit we can't test them all, hence pointing you to a file that has it done. If you have limited php skills really you should be looking to get someone involved for php tweaking like this you could use our job board for that. In theory you'd want to take the following steps:

    1. in archive php remove:


    <div id="content">
    <?php do_action( 'bp_before_archive' ) ?>

    <div class="content-page" id="blog-archives">

    add:

    <?php include (TEMPLATEPATH . '/sidebars/sidebar-3colright.php'); ?>
    <div id="threecol-maincolumn">

    <?php do_action( 'bp_before_archive' ) ?>

    <div class="content-page" id="blog-page">

    in archive.php remove:

    <?php locate_template( array( 'sidebar.php' ), true ) ?>

    add

    <?php locate_template( array( 'sidebars/sidebar-3colleft.php' ), true ) ?>

    If that works great but I've not tested so leave that to you.

  • Tammie

    @Cratar: I already gave you the css I can't see your code so don't know what element you should apply it to but either wrap the bit that isn't working in .entry or add to the element that isn't doing it text-align: left;

    As for sidebars... it is 3colright-sidebar and 3colleft-sidebar and works in my testing. Now there was a while ago a bug around the sidebars so if you are not on the latest version of the theme perhaps changing to that one could resolve the issue for you. It also though depends on what widget you are using try using a default one if you are using a non default one - I use the tag cloud or groups one to test myself.

  • Cratar

    yeah - got latest bpscholar loaded and used tag cloud a couple hours ago to test a default widget. and tested them in both 3colright-sidebar and 3colleft-sidebar. Left works a dream... right, not so much.

    I am so newbie at all of this, I have no idea what "wrap the bit that isn't working in .entry" etc means. Sorry! I know this is frustrating for you :slight_smile: Must be like teaching ABCs to an adult when you're a uni prof! Apologies...

    Pls tell me what other code you'd need from me to check what is what... meanwhile

    This is my code for archive.php

    //`<?php get_header(); ?>
    <?php include (TEMPLATEPATH . '/sidebars/sidebar-3colright.php'); ?>
    <div id="threecol-maincolumn">
    <?php do_action( 'bp_before_archive' ) ?>
    <div class="content-page" id="blog-page">
    <?php if ( have_posts() ) : ?>
    <div class="content-box-outer">
    <div class="h3-background">

    <?php include (TEMPLATEPATH . '/messages/blog-headers.php'); ?>
    </div>
    </div>
    <?php while (have_posts()) : the_post(); ?>

    <?php do_action( 'bp_before_blog_post' ) ?>

    <div class="post" id="post-<?php the_ID(); ?>">

    <div class="content-box-outer">
    <div class="h3-background">
    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php _e( 'Permanent Link to', 'buddypress' ) ?> <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h3>
    </div></div>

    <div class="content-box-inner">
    <div class="post-meta-data">
    <div class="meta-date"><?php the_time('F jS, Y') ?> </div>
    <div class="meta-category"> <?php _e( 'in', 'buddypress' ) ?> <?php the_category(', ') ?></div>
    <div class="meta-comments"><?php comments_popup_link( __( 'No Comments »', 'buddypress' ), __( '1 Comment »', 'buddypress' ), __( '% Comments »', 'buddypress' ) ); ?></div>
    <?php if( $bp_existed == 'true' ) { //check if bp existed ?>
    <div class="meta-author"><?php echo get_avatar( get_the_author_email(), '17' ); ?><?php printf( __( 'by %s', 'buddypress' ), bp_core_get_userlink( $post->post_author ) ) ?></div>
    <?php } else { // if not bp detected..let go normal ?>
    <div class="meta-author">
    <?php the_author_link(); ?>
    </div>
    <?php } ?>
    <div class="meta-tag"><?php the_tags( __( 'Tags: ', 'buddypress' ), ', ', '<br />'); ?></div>

    <div class="clear"></div>
    </div>

    <div class="post-content">

    <div class="entry">
    <?php the_excerpt(); ?>
    <div class="clear"></div>
    </div>

    </div>

    </div>
    </div>

    <?php do_action( 'bp_after_blog_post' ) ?>

    <?php endwhile; ?>

    <?php include (TEMPLATEPATH . '/messages/pagination.php'); ?>

    <?php else : ?>

    <?php include (TEMPLATEPATH . '/messages/messages.php'); ?>
    <?php endif; ?>

    </div>

    <?php do_action( 'bp_after_archive' ) ?>

    </div><!-- #content -->

    <?php locate_template( array( 'sidebars/sidebar-3colleft.php' ), true ) ?>

    <?php get_footer(); ?>`//

  • Tammie

    @Cratar: You just need to add in custom.css assuming you are using that or child.css (don't know what you are using) the following:

    .content-page{<br />
    text-align: left;<br />
    }<br />

    I'm not frustrated this is one of the issues with doing something custom unfortunately what you are doing is custom page creation so I'd really say you need to take a step back and learn page templating / code a little if you are going to be doing such a thing and not bringing in a designer for it. Whilst I will help where I can it's going to save you time and in the end money if you learn what each bit does what yourself as I assume you're doing a 'DIY' site and haven't the budget perhaps to bring a developer in? We can give you hints but ultimately you are going to have to do a lot of this yourself.

    I'm very used to helping a range of abilities but we don't just feed code we encourage you to learn as you go hence my suggestions as to comparing the code. If I just spoonfed the code you'd not be able to apply it to a new situation but now hopefully you can which enables you to take control of your site yourself.

    I would suggest if you use firefox getting firebug as you can then see which element by simply rolling your mouse over the web page and then you can easily add css classes to it yourself.

  • Cratar

    thx Tammie :slight_smile: You're spot on on the no budget and doing this DIY. Problem is that my vision doesn't fit my knowledge! :slight_smile: I've learnt a ton from scratch doing what you've said since I first started blogging a few years ago - messing around with code and figuring it all out like a puzzle. Anyway - I've used firebug a lot; using chrome at the moment because I prefer it for browsing. Sorry to ask you to spoonfeed - feeling the pressure of a) running out of my membership here - only 1 week left! b) wanting to launch the website asap :slight_smile:

    One of these days I will get to teaching myself the distinctions within customising! :slight_smile:

  • Tammie

    @Cratar: no problem the one big thing when learning though is templates and how they break down then you can see each bit. One 'secret' that actually will help is the firebug extension but another is learning to insert this into code you think may have a problem:

    <?php echo "test"; ?>

    It may seem odd but want to know what bit relates to what in a sea of code? Plonk that little bit of code in if firebug doesn't help and where it outputs will be helpful showing you. Hope that helps a little maybe in debugging.

  • Tammie

    @Cratar: I haven't a clue what I said should work and customisation like you are doing by pulling feeds should either be a commisioned job through the job board or perhaps a plugin can do it. The archive instructions I gave you would work so don't know why you can't. I understand you feel the clock is ticking but perhaps paying someone to do this page change at this point would enable you to accomplish all you require as should be a quick job for someone as I've already written all the code in this post.

  • Cratar

    ok :slight_smile: back to being not too ambitious with customising everything :slight_smile: ...

    What I have done, for anyone else who may have this issue too (lol!) is simply: created a page within a 3 column template and then created a link within that page to the archive. It works out better this way, cos I can have the content I want for the member to read first, before they hit the archives for autoblog's pulled feeds. Plus, I added the widget - site-wide-feeds - to the rhs column so the feeds are immediately viewable on the same page anyway. And I like it better, cos the side-wide-feed includes images, whereas archives do not.

    curious to know what code I would need to add to get the lists within posts to have bullets?

  • Cratar

    ok :slight_smile: back to being not too ambitious with customising everything :slight_smile: ...

    What I have done, for anyone else who may have this issue too (lol!) is simply: created a page within a 3 column template and then created a link within that page to the archive. It works out better this way, cos I can have the content I want for the member to read first, before they hit the archives for autoblog's pulled feeds. Plus, I added the widget - site-wide-feeds - to the rhs column so the feeds are immediately viewable on the same page anyway. And I like it better, cos the side-wide-feed includes images, whereas archives do not.

    curious to know what code I would need to add to get the lists within posts to have bullets?

  • Cratar

    @Tammie - another quick question ... I've noticed that when I try select a template for a new page that the templates avail in the drop down menu on the righthandside don't match up to the widget area template options.

    For eg. the template options on a new page have "right sidebar" (no "left only sidebar, besides "default") but the widget area has only got a "left sidebar" option (no "right")

    is this me being dumb again? :wink:

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.