Topic: Problem or bug beetwen BP Cover Image and buddypress.css ?

Problem or bug beetwen BP Cover Image and buddypress.css ?

@frappi

Participant

9 years, 9 months ago
Hello,

The profile cover image of my users disapear as soon as I copy the file buddypress.css from my theme/buddypress/css to my-child-theme/buddypress/css folder. Problem is the same whatever I copy the all directory structure.

I deactivated all my plugins except BP but the problem remains.

I supposed it is a problem with Javascript so I copy theme/buddypress/js folder to my child theme but still the image is not displayed.

When cover image is properly loaded this is what I have :

1./ CSS that display the image from a mystery inline file (line 74) :
```
body.buddypress div#item-header {
    background-image: url("http://mysite.fr/wp-content/uploads/buddypress/members/1/cover-image/82b87ae9117b8a803c8a0da2af4ffbb2-bp-cover-image.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center !important;
}
```
2./ CSS related to #item-header in buddypress.css :
```
.buddypress div#item-header {
    background: transparent url("../../assets/img/heading.png") repeat-x scroll 0px 115px;
    text-align: center;
    transition: all 0.5s ease-in-out 0s;
    position: relative;
    padding-top: 40px;
    padding-bottom: 40px;
    display: inline-block;
    width: 100%;
}
```
These two sections of CSS code are not executed as soon as I copy the file buddypress.css into my child theme directory. What could be the reason for this ? Thank you

Viewing 10 replies - 1 through 10 (of 10 total)

@hnla

Participant

9 years, 9 months ago

Can we be clear what theme/buddypress/css/ refers to is this a reference to the core BP plugin or is this a BP ready theme that you are running a child theme from?

Cover image styles are loaded as ’embedded’ ( styles written to the head of a document within style tags) styles so not a mystery 🙂

@frappi

Participant

9 years, 9 months ago

Hello,

Yes theme/buddypress/css/ refers to a BP ready theme (Kleo).

styles written to the head of a document within style tags

Thx I didn’t know that.

@hnla

Participant

9 years, 9 months ago

Have you asked this premium themes authors/developers about this issue?

While there may be an issue we haven’t spotted, setting up to try and reproduce is somewhat time consuming so it would be good to have acknowledgement from the themes devs that this isn’t an issue that needs dealing with in this theme rather than with BP core implementation.
@frappi

Participant

9 years, 9 months ago
Please find portion of my home.php that may fire the cover image :
```
<div id="item-header" role="complementary">

              <?php
              /**
               * If the cover image feature is enabled, use a specific header
               */
              if ( version_compare( BP_VERSION, '2.4', '>=' ) && bp_displayed_user_use_cover_image_header() ) :
                  bp_get_template_part( 'members/single/cover-image-header' );
              else :
                  bp_get_template_part( 'members/single/member-header' );
              endif;
              ?>

          </div>
```
According to this, file cover-image-header.php loads the cover image but it is strange because as you can see this file display directly the avatar image. The div item-header-avatar is inside in item-header.
```
<?php

/**
 * BuddyPress - Cover Header
 *
 * @package BuddyPress
 * @subpackage bp-legacy
 */

?>

<?php

/**
 * Fires before the display of a member's header.
 *
 * @since 1.2.0
 */
do_action( 'bp_before_member_header' ); ?>

	<div id="item-header-avatar" class="rounded">
		<a href="<?php bp_displayed_user_link(); ?>">

			<?php bp_displayed_user_avatar( 'type=full' ); ?>

		</a>
		<?php do_action('bp_member_online_status', bp_displayed_user_id()); ?>
	</div>
```
@frappi

Participant

9 years, 9 months ago

Have you asked this premium themes authors/developers about this issue?

To be honnest I haven’t a regular licence for this theme so I cannot expect technical support.

@hnla

Participant

9 years, 9 months ago

Those look to be modified files, not the copies from the BP core plugin, the cover-image-header.php file appears to be missing some elements necessary.

Again as my earlier comment have you asked this question of the themes authors, you need to as we can’t really support third party custom work, if they find that there is indeed an issue with the core implementation then we’ll definitely look into it.

Also you could look to test things by ensuring you are running a copy of the files taken from the core bp-templates/bp-legacy/buddypress/members/single/ directory.

@hnla

Participant

9 years, 9 months ago

Just seen your response:

>To be honnest I haven’t a regular licence for this theme so I cannot expect technical support.

And we are limited in the help we can offer on premium themes sadly.

@r-a-y

Keymaster

9 years, 9 months ago

You might want to read this reply:
https://buddypress.org/support/topic/css-causing-cover-image-to-disappear/#post-248031

Let me know if that helps.
@frappi

Participant

9 years, 9 months ago
Hello r-a-y, thanks for your help.

I’ve try the workaround by adding the following lines into function.php but the problem persist. I’m not familiar with BP and I hope my test is correct.
```
 
function your_theme_cover_image_css( $settings = array() ) {
    /**
     * If you are using a child theme, use bp-child-css
     * as the theme handel
     */
    $theme_handle = 'bp-child-css';
 
    $settings['theme_handle'] = $theme_handle;
 
    /**
     * Then you'll probably also need to use your own callback function
     * @see the previous snippet
     */
     $settings['callback'] = 'bp_legacy_theme_cover_image';
     
    return $settings;
}
add_filter( 'bp_before_xprofile_cover_image_settings_parse_args', 'your_theme_cover_image_css', 10, 1 );
add_filter( 'bp_before_groups_cover_image_settings_parse_args', 'your_theme_cover_image_css', 10, 1 );
```
@mfalk75

Participant

9 years, 7 months ago

I’m having same issue, did you ever figure this out @Florent. I’m not great with code but I believe the code below must somehow be incorporated into the function you have above. Could someone help us out 🙂

/* Cover image – Do not forget this part */
#buddypress #header-cover-image {
height: ‘ . $params[“height”] . ‘px;
background-image: url(‘ . $params[‘cover_image’] . ‘);
}

Viewing 10 replies - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.

BuddyPress.org

Problem or bug beetwen BP Cover Image and buddypress.css ?

Topic Info

BuddyPress.org

Problem or bug beetwen BP Cover Image and buddypress.css ?

Topic Info

Reply Search