WordPress.org

Ready to get started?Download WordPress

Forums

BuddyPress Album
Enable Light box with (7 posts)

  1. jaseyb
    Member
    Posted 2 years ago #

    Hey, I’m using bp album and using the command do_action( 'bp_album_all_images' ) to show images in a users profile page….. however, when someone clicks on them it takes them to the album component. I would really like to enable the command with lightbox – any ideas ….?

    http://wordpress.org/extend/plugins/bp-album/

  2. ramkelawon
    Member
    Posted 2 years ago #

    I'm trying to do exactly the same thing...did you have any luck?

  3. Houfton
    Member
    Posted 2 years ago #

    I think I just worked this out. Warning: I am not an expert but it works for me!

    I copied the wp-content/plugins/bp-album/includes/templates/album/all-images.php file to album/all-images.php in my child theme. I altered the layout to create a list of images rather than a table but the main thing is to alter the link (line 40?) from
    <a href="<?php bp_album_picture_url() ?>" class="media-image"><img src='<?php bp_album_picture_thumb_url() ?>' /></a>
    to something like
    <a href='<?php bp_album_picture_middle_url() ?>' class='fancybox' rel='slideshow' title=''><img src='<?php bp_album_picture_thumb_url() ?>' /></a>

    I then copied the 'bp_album_screen_all_images()' function which uses the 'bp_album_all_images' function you mention (found in wp-content/plugins/bp-album/includes/bpa.screens.php - line 644?) to the functions.php file in my child theme. I changed all mentions of bp_album_screen_all_images to xxx_bp_album_screen_all_images to avoid declaring the same function twice:

    function xxx_bp_album_screen_all_images() {
            global $bp;
            bp_album_query_pictures();
    	bp_album_load_subtemplate( apply_filters( 'xxx_bp_album_screen_all_images', 'album/all-images' ), false );
    }
    add_action('xxx_bp_album_all_images','xxx_bp_album_screen_all_images',3);

    To use it I added
    do_action( 'spear_bp_album_all_images' );
    below the profile fields loop in members/single/profile/profile-loop.php in my child theme. It could be used anywhere I think.

    I am using Fancybox for WordPress but other lightboxes could work, you just need to use the appropriate class / rel attributes.

  4. Houfton
    Member
    Posted 2 years ago #

    Sorry, there is a mistake here:
    do_action( 'spear_bp_album_all_images' );
    should be:
    do_action( 'xxx_bp_album_all_images' );

  5. dassoubarna
    Member
    Posted 1 year ago #

    Houfton, your instructions are working great. But it shows all the pictures from all albums of all the users.

    Could it be possible to modify your code to show just the album of each user? If so, please give me some instructions on how to do it.

  6. Houfton
    Member
    Posted 1 year ago #

    Sorry again, I have changed the way I did this but did not update this post (I hate it when people do that!).

    What I use now is an addition to the wp-content/themes/my-child-theme/members/single/profile/profile-loop.php file in my child theme. I put this just above <?php do_action( 'bp_profile_field_buttons' ); ?>:

    <?php
    
    	global $bp, $pictures_template;
    	$args['ordersort'] = 'ASC';
    	$args['per_page']  =  12;
    	bp_album_query_pictures($args);
    
    	?>
    
    	<ul class="picture-gallery">
    
    	<?php while ( bp_album_has_pictures() ) : bp_album_the_picture(); ?>
    
    		<li class="picture-thumb-box">
    
    			<a href='<?php bp_album_picture_middle_url() ?>' class='fancybox' rel='slideshow' title=''><img src='<?php bp_album_picture_thumb_url() ?>' /></a><br />
    			<a href="<?php bp_album_picture_url() ?>" class="picture-title"><?php bp_album_picture_title_truncate(22) ?></a><?php if (bp_is_my_profile() || is_super_admin()) { echo "<br />";
    			bp_album_picture_edit_link(); } ?>
    
    		</li>
    
    	<?php endwhile; ?>
    
    	</ul>

    It is set to show up to 12 images. The image link uses Fancybox. The image title links to the image as a post and there is an image edit link below that as well for logged-in users. All this can be changed obviously. The picture-thumb-box class applied to the list item allows you to change the styling.

    Dare I say, it seems to work for me!

  7. dassoubarna
    Member
    Posted 1 year ago #

    Thanks! :)

    It's working great.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags