New BuddyPress 2.4 has cover images functionality for groups and users. I’ve started to play with it, and saw that images are uploading, but not showing up on refresh. I think it has something to do with child themes functionality and RTL support.
My child theme was really mostly CSS for TwentyFourteen default theme. After I found that images are indeed uploading, but CSS is missing and then studying BuddyPress Codex for Cover Images, the code below was tested and it works.
Maybe developers forgot about child-theme RTL option to check. Don’t know yet, why required CSS was not showing. Looks like CSS is not plugging into page head by default. So adding it anew helps.
$theme_handle = 'bp-legacy-css-rtl'; is the ID of linked stylesheet file in page head, after which we are adding needed CSS for cover images on groups and users pages.
// COVER IMAGES
// Add css style for background cover images
function bike_cover_image_css( $settings = array() ) {
$theme_handle = 'bp-legacy-css-rtl';
$settings['theme_handle'] = $theme_handle;
$settings['callback'] = 'bike_cover_image_callback';
return $settings;
}
function bike_cover_image_callback( $params = array() ) {
if ( empty( $params ) ) {
return;
}
return '
#buddypress #header-cover-image {
height: ' . $params["height"] . 'px;
background-image: url(' . $params['cover_image'] . ');
}
';
}
add_filter( 'bp_before_xprofile_cover_image_settings_parse_args', 'bike_cover_image_css', 10, 1 );
add_filter( 'bp_before_groups_cover_image_settings_parse_args', 'bike_cover_image_css', 10, 1 );The code snippet could be added to your theme functions.php or to BuddyPress own functions file called bp-custom.php which would reside in plugins folder then.
Cover Image Size and Default Image
Below are 2 snippets for groups and users, where we change image sizes and provide default cover images to both of them.
// change cover image size for profiles
function bike_xprofile_cover_image( $settings = array() ) {
$settings['default_cover'] = 'http://www.xxxxxxxx.co.il/xxxxxx/wp-content/themes/bike/images/slidehow-bg.png';
$settings['width'] = 1260;
$settings['height'] = 268;
return $settings;
}
add_filter( 'bp_before_xprofile_cover_image_settings_parse_args', 'bike_xprofile_cover_image', 10, 1 );
// for groups
function bike_theme_xprofile_cover_image( $settings = array() ) {
$settings['default_cover'] = 'http://www.xxxxxxxx.co.il/xxxxxx/wp-content/themes/bike/images/slidehow-bg.png';
$settings['width'] = 1260;
$settings['height'] = 268;
return $settings;
}
add_filter( 'bp_before_groups_cover_image_settings_parse_args', 'bike_theme_xprofile_cover_image', 10, 1 );
?>
