[Plugin: BuddyPress Activity Plus] How to change image size !??!

candy2012,

I agree…and would like to change the image size too. I’ve been customizing this plugin by altering the CSS, PHP and JS files. I’ve backed up my changes of course to compare with any updates to the plugin. It would be great to have a settings page in the admin for these values…all websites/themes are not the same nor should added functionality look the same.

I was able to replace the icons and change the button colors, video size, embedded link & thumbnail sizes. I was also able to change the image preview size so I have a nice even grid of 3 images across when uploading multiple images. I still haven’t found the activity stream image size…such a small image in the activity stream looks incredibly ridiculous. When I find it I will post what needs to be altered here.

If anyone else figures it out please post!

good idea

I was able to alter the image size in the activity stream by making two changes which did the trick:

Open the file wp-content/plugins/buddypress-activity-plus/class_bpfb_binder.php. Around lines 35 to 38 you’ll see this code:

$thumb_w = get_option('thumbnail_size_w');
$thumb_w = $thumb_w ? $thumb_w : 575;
$thumb_h = get_option('thumbnail_size_h');
$thumb_h = $thumb_h ? $thumb_h : 575;

I am using 575 for my image dimensions, of course change this to whatever you would like it to be. I’ve also added this line to the wp-config.php file in the WordPress root directory just under the language definition:

define('BPFB_THUMBNAIL_IMAGE_SIZE', '575x575');

Note: My theme already uses a modal window (lightbox) which caused the images to open two lightboxes at the same time. I’ve chosen to use the theme’s version for consistency throughout the site. Adding this to wp-config.php just under the image size shuts off the thickbox use within BuddyPress Activity Plus:

define('BPFB_USE_THICKBOX', false);

I hope this works for you.

Greetings from WPMU DEV!

Thank you to all of you for using the Buddy Press Activity Plus Plugin and for updating us feature improvements. The Plugin is under active development, so we always welcome feedback from our Users.

@candy2012
We are grateful that you took the time to place your comment on www.remarpro.com. At WPMU DEV we are constantly striving to improve our plugins and we do this by listening to our Users and using their feedback and suggestions constructively. Yours are therefore highly appreciated and will be passed on to the Developer to incorporate into the next version.

@drome22
Thank you for sharing the solution to your and candy2012’s request with the rest of the Users – nothing like sharing ??

Please don’t hesitate to be in contact if you have any other feature requests or feedback on the Plugin.

Have a blessed day!

Gina :: Multiplicity
Trying out as WPMU DEV Support Staff – Let me know how I go

@ginab.Multiplicity your posts are always so polite and nice, but unfortunately they do not answer questions nor show us how to solve problems. Photo uploading and hotlinking directly to the activity stream is super important to Buddypress, in fact so important that Buddypress is almost worthless without this plugin. But when pictures do not resize to a specified (either in css or admin) size, then the photo part of Activity Press is equally worthless.

Please don’t let this plugin go to waste. Help the users figure out how to resize… pretty please.

Stepping in to back up Gina here.

There was an update that allows you to re-size photos. If you consult the usage instructions on the plugin page from the development company you can find them there ??

Usage and Customization:

To use custom icons in your theme, use add_theme_support(“bpfb_toolbar_icons”); in your functions.php, copy over the rules from css/bpfb_toolbar.css and edit to suit your needs.

Alternatively, if you’re OK with 32×32 icon sizes, you can just override the icons in your stylesheet using background property and !important. These are the IDs: #bpfb_addPhotos, #bpfb_addVideos, #bpfb_addLinks, #bpfb_addDocuments

you can also set your preferred thumbnail size separately from your default thumbnail size settings, if you wish to do so. You can do that by adding this line to your wp-config.php:

define(‘BPFB_THUMBNAIL_IMAGE_SIZE’, ‘200×200’);

Where “200×200” are width and height (in that order), in pixels.

Finally, be sure to verify your default sizes for embedded media. It’s in Settings -> Media -> Embeds -> Maximum embed size
Limiting photo uploads

You also have the capability to limit photo uploads by users. Upon first install the limit will be set to 5. However you can change it to anything you like by adding something like this to your wp-config.php: define(‘BPFB_IMAGE_LIMIT’, 5, true);

So, for an example, to increase the image limit to, say, 10, you would add this to your wp-config.php:

define(‘BPFB_IMAGE_LIMIT’, 10, true);

To remove limits entirely and allow unlimited number of images to be shared, just set it to zero, like this:

define(‘BPFB_IMAGE_LIMIT’, 0, true);

This is in response to drome22’s post about disabling the activity plus thickbox. I’m using the Salutation theme which uses a default colorbox. I did what you said about the define(‘BPFB_USE_THICKBOX’, false); but that brought in another issue:

When images were posted with very less content (i.e. within the truncate limit before ‘Read more’ shows up in Buddypress), they opened up fine in my theme’s thickbox successfully but when images were added along with a lot of text content so that on posting, they were placed within the ‘Read more’ content, they would NOT open in a thickbox. Instead they would open as images in the parent window making the user go back to the page he was viewing by clicking ‘Back’ after he was done seeing the full image. This was a big problem.

To fix this, I followed this process:

https://customwebdesignseo.com/groups/buddypress/snippets/14/

This worked like a charm! Now all images open in my theme’s beautiful built in lightbox while the Activity plus lightbox (which is ugly looking) is disabled.

@customwebdesignseo

I have also used the Salutation theme for a project but cannot replicate the issue you mentioned. Your solution looks good and if it works for other users of the great Salutation theme, even better. I am always interested in finding more efficient ways of accomplishing tasks and fixing problems. Could you please be more specific about where and in what circumstance you were having the problem as stated in your post:

When images were posted with very less content (i.e. within the truncate limit before ‘Read more’ shows up in Buddypress), they opened up fine in my theme’s thickbox successfully but when images were added along with a lot of text content so that on posting, they were placed within the ‘Read more’ content, they would NOT open in a thickbox.

Is this when a blog post or an external website is added to the activity stream? Please explain the exact condition in which this was happening so I can identify and address this issue if it exists on my website. Thanks

@customwebdesignseo,

Thanks for the snippet – in fact, you can get pretty much the same effect without changing the plugin files, using the BPFB_USE_THICKBOX define. To assign a class name different than “thickbox” to your image links as you do in your snippet, you can do something like this:

define('BPFB_USE_THICKBOX', 'mycodename');

Of course, going by your snippet, you’ll still need that extra bit of JS to wire Colorbox and your image links to work together.

Add something like this to bp-custom.php

define('BPFB_THUMBNAIL_IMAGE_SIZE', '400x200');

Hi guys. It’s easy to resize and even to use thickbox with Activity Plus.
A friend of mine told me this topic has been around for quite long and I decided to take a look at the code.
You can see a working example at https://dxdx.net63.net/activity
You can see the code for resizing images in Activity Plus at
https://73s.us/LkB8bM
I’ll post on how to use thick box for liked images in Activity plus shortly.

Have fun.

Marin

Hi Guys I started running with LU5DX thoughts and as per Forest Gump I’m still running.

The journey has become extended because whilst the resize suggestion of LU5DX worked it also distorts the image shape in an unattractive way, after a bit of searching I realised for my needs the answer is to specify only the width element.

See first code example below.

Anyway during the search for how this should be done I came across resize() found on https://joedesigns.com/v22/?page=scripts_widgets&id=67

a chief benefit of which effectivly a lesson on how to manage a cache
which I thought would be a sensible addition to activity plus but I needed to modify it in order to handle query scripts in the url.
i.e https://www.inthesaddle.com/wms/modules/rides/image.php?i=79&w=940&h=320&format=jpg&crop=1

Anyway my mod of resize() creates the files perfectly. But………
Something I dont understand is going on whereby the image is not displayed correctly in the browser in its intended context (the members page of the site).

The files are where they should be and when I view source – everything appears to be how it should be.
I confirmed this by copying the view source output into localhost/test.html

where it displays in the browser correctly

However if the url in the address bar of the browser is localhost/members/andy

it fails to display as mentioned!!!

So I guess this is down to permalinks but please correct me / point me in the right direction if you have more insight than I – cheers.

<div class="bpfb_images">
    <?php $rel = md5(microtime() . rand());
    foreach ($images as $img) {
        if (!$img) continue;
        if (preg_match('!^https?:\/\/!i', $img)) { // Remote image
            ?>
            <a href="<?php echo $img; ?>" class="<?php echo $use_thickbox; ?>" >
                <img src="<?php echo $img; ?>" width='430' border='1' />
                </a>

        <?php
        } else {
            $info = pathinfo($img);
            $thumbnail = file_exists(bpfb_get_image_dir($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])) ?
            bpfb_get_image_url($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])
            :
            bpfb_get_image_url($activity_blog_id) . $img
            ;
        ?>
            <a href="<?php echo bpfb_get_image_url($activity_blog_id) . $img; ?>" class="<?php echo $use_thickbox; ?>" rel="<?php echo $rel;?>">
                <img src="<?php echo $thumbnail;?>" />
            </a>
        <?php
        }
    } ?>
</div>

With Resize and caching functionality for the produced thumbnail and changes highlighted

<?PHP
 <strong>require_once (ABSPATH.'/ab-includes/function.resize.php')</strong>
?>
<div class="bpfb_images">
    <?php $rel = md5(microtime() . rand());
    foreach ($images as $img) {
        if (!$img) continue;
        if (preg_match('!^https?:\/\/!i', $img)) { // Remote image 

<strong>            $settings = array('w'=>430,'h'=>430);
            $thumb = resize($img,$settings);</strong>
            ?>
            <a href="<?php echo $img; ?>" class="<?php echo $use_thickbox; ?>" >
                <strong><img src="<?php echo $thumb; ?>" border='1' /></strong>
                </a>

        <?php
        } else {
            $info = pathinfo($img);
            $thumbnail = file_exists(bpfb_get_image_dir($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])) ?
            bpfb_get_image_url($activity_blog_id) . $info['filename'] . '-bpfbt.' . strtolower($info['extension'])
            :
            bpfb_get_image_url($activity_blog_id) . $img
            ;
        ?>
            <a href="<?php echo bpfb_get_image_url($activity_blog_id) . $img; ?>" class="<?php echo $use_thickbox; ?>" rel="<?php echo $rel;?>">
                <img src="<?php echo $thumbnail;?>" />
            </a>
        <?php
        }
    } ?>
</div>

function.resize.php

<?php
/**
 * function by Wes Edling .. https://joedesigns.com
 * feel free to use this in any project, i just ask for a credit in the source code.
 * a link back to my site would be nice too.
 *AS says: - Original link to github found on https://joedesigns.com/v22/?page=scripts_widgets&id=67
 *
 *
 * Changes:
 * 2012/01/30 - David Goodwin - call escapeshellarg on parameters going into the shell
 * 2012/07/12 - Whizzkid - Added support for encoded image urls and images on ssl secured servers [https://]
 */

/**
 * SECURITY:
 * It's a bad idea to allow user supplied data to become the path for the image you wish to retrieve, as this allows them
 * to download nearly anything to your server. If you must do this, it's strongly advised that you put a .htaccess file
 * in the cache directory containing something like the following :
 * <code>php_flag engine off</code>
 * to at least stop arbitrary code execution. You can deal with any copyright infringement issues yourself :)
 */

/**
 * @param string $imagePath - either a local absolute/relative path, or a remote URL (e.g. https://...flickr.com/.../ ). See SECURITY note above.
 * @param array $opts  (w(pixels), h(pixels), crop(boolean), scale(boolean), thumbnail(boolean), maxOnly(boolean), canvas-color(#abcabc), output-filename(string), cache_http_minutes(int))
 * @return new URL for resized image.
 */
function resize($imagePath,$opts=null){
	$imagePath = urldecode($imagePath);
	# start configuration
	$cacheFolder =  './cache/'; # path to your cache folder, must be writeable by web server
	$remoteFolder = $cacheFolder.'remote/'; # path to the folder you wish to download remote images into

	$defaults = array('crop' => false, 'scale' => 'false', 'thumbnail' => false, 'maxOnly' => false,
	   'canvas-color' => 'transparent', 'output-filename' => false,
	   'cacheFolder' => $cacheFolder, 'remoteFolder' => $remoteFolder, 'quality' => 90, 'cache_http_minutes' => 20);

	$opts = array_merge($defaults, $opts);    

	$cacheFolder = $opts['cacheFolder'];
	$remoteFolder = $opts['remoteFolder'];

	$path_to_convert = 'convert'; # this could be something like /usr/bin/convert or /opt/local/share/bin/convert

	## you shouldn't need to configure anything else beyond this point

	$purl = parse_url($imagePath);
    $finfo = pathinfo($purl['path']);
	$ext = $finfo['extension'];

    # if the url contains query script there is a problem as typically you will get a file extention of 'php' and you want of course an      # imnage extention. I am sure there is a better way and a wider range of scenarios!
    if ($ext == 'php'){
        $array_needles = array("gif","jpg","png", "bmp","tif"); 

        $haystack = $purl['query'];

        foreach($array_needles as $item){
            if(stristr($haystack, $item)){
                //do whatever you want if its found
                $ext = $item;
                break;
            }
        }

    } 

	# check for remote image..
	if(isset($purl['scheme']) && ($purl['scheme'] == 'http' || $purl['scheme'] == 'https')):
		# grab the image, and cache it so we have something to work with..
	    $filename = $purl['host'].$finfo['dirname'].$finfo['filename'].".".$ext;
        $filename = str_replace('\\','_',$filename);
        $filename = str_replace('/','_',$filename);
		$local_filepath = $remoteFolder.$filename;
		$download_image = true;
		if(file_exists($local_filepath)):
			if(filemtime($local_filepath) < strtotime('+'.$opts['cache_http_minutes'].' minutes')):
				$download_image = false;
			endif;
		endif;
		if($download_image == true):
			$img = file_get_contents($imagePath);
            file_put_contents($local_filepath,$img);
            //copyfile_chunked($imagePath, $local_filepath); you could use this instead

		endif;
		$imagePath = $local_filepath;
	endif;

	if(file_exists($imagePath) == false):
		$imagePath = $_SERVER['DOCUMENT_ROOT'].$imagePath;
		if(file_exists($imagePath) == false):
			return 'image not found';
		endif;
	endif;

	if(isset($opts['w'])): $w = $opts['w']; endif;
	if(isset($opts['h'])): $h = $opts['h']; endif;

	$filename = md5_file($imagePath);

	// If the user has requested an explicit output-filename, do not use the cache directory.
	if(false !== $opts['output-filename']) :
		$newPath = $opts['output-filename'];
	else:
        if(!empty($w) and !empty($h)):
            $newPath = $cacheFolder.$filename.'_w'.$w.'_h'.$h.(isset($opts['crop']) && $opts['crop'] == true ? "_cp" : "").(isset($opts['scale']) && $opts['scale'] == true ? "_sc" : "").'.'.$ext;
        elseif(!empty($w)):
            $newPath = $cacheFolder.$filename.'_w'.$w.'.'.$ext;
        elseif(!empty($h)):
            $newPath = $cacheFolder.$filename.'_h'.$h.'.'.$ext;
        else:
            return false;
        endif;
	endif;

	$create = true;

    if(file_exists($newPath) == true):
        $create = false;
        $origFileTime = date("YmdHis",filemtime($imagePath));
        $newFileTime = date("YmdHis",filemtime($newPath));
        if($newFileTime < $origFileTime): # Not using $opts['expire-time'] ??
            $create = true;
        endif;
    endif;

	if($create == true):
		if(!empty($w) and !empty($h)):

			list($width,$height) = getimagesize($imagePath);
			$resize = $w;

			if($width > $height):
				$resize = $w;
				if(true === $opts['crop']):
					$resize = "x".$h;
				endif;
			else:
				$resize = "x".$h;
				if(true === $opts['crop']):
					$resize = $w;
				endif;
			endif;

			if(true === $opts['scale']):
				$cmd = $path_to_convert ." ". escapeshellarg($imagePath) ." -resize ". escapeshellarg($resize) .
				" -quality ". escapeshellarg($opts['quality']) . " " . escapeshellarg($newPath);
			else:
				$cmd = $path_to_convert." ". escapeshellarg($imagePath) ." -resize ". escapeshellarg($resize) .
				" -size ". escapeshellarg($w ."x". $h) .
				" xc:". escapeshellarg($opts['canvas-color']) .
				" +swap -gravity center -composite -quality ". escapeshellarg($opts['quality'])." ".escapeshellarg($newPath);
			endif;

		else:
			$cmd = $path_to_convert." " . escapeshellarg($imagePath) .
			" -thumbnail ". (!empty($h) ? 'x':'') . $w ."".
			(isset($opts['maxOnly']) && $opts['maxOnly'] == true ? "\>" : "") .
			" -quality ". escapeshellarg($opts['quality']) ." ". escapeshellarg($newPath);
		endif;

		$c = exec($cmd, $output, $return_code);
        if($return_code != 0) {
            error_log("Tried to execute : $cmd, return code: $return_code, output: " . print_r($output, true));
            return false;
		}
	endif;

	# return cache file path
	$retval = str_replace($_SERVER['DOCUMENT_ROOT'],'',$newPath);
    $retval = str_replace("\\","/",$retval);
    return $retval;

}

/**
* found at https://stackoverflow.com/questions/4000483/how-download-big-file-using-php-low-memory-usage
*
* @param mixed $infile
* @param mixed $outfile
*/
function copyfile_chunked($infile, $outfile) {
    $chunksize = 10 * (1024 * 1024); // 10 Megs

    /**
     * parse_url breaks a part a URL into it's parts, i.e. host, path,
     * query string, etc.
     */
    $parts = parse_url($infile);
    $i_handle = fsockopen($parts['host'], 80, $errstr, $errcode, 5);
    $o_handle = fopen($outfile, 'wb');

    if ($i_handle == false || $o_handle == false) {
        return false;
    }

    if (!empty($parts['query'])) {
        $parts['path'] .= '?' . $parts['query'];
    }

    /**
     * Send the request to the server for the file
     */
    $request = "GET {$parts['path']} HTTP/1.1\r\n";
    $request .= "Host: {$parts['host']}\r\n";
    $request .= "User-Agent: Mozilla/5.0\r\n";
    $request .= "Keep-Alive: 115\r\n";
    $request .= "Connection: keep-alive\r\n\r\n";
    fwrite($i_handle, $request);

    /**
     * Now read the headers from the remote server. We'll need
     * to get the content length.
     */
    $headers = array();
    while(!feof($i_handle)) {
        $line = fgets($i_handle);
        if ($line == "\r\n") break;
        $headers[] = $line;
    }

    /**
     * Look for the Content-Length header, and get the size
     * of the remote file.
     */
    $length = 0;
    foreach($headers as $header) {
        if (stripos($header, 'Content-Length:') === 0) {
            $length = (int)str_replace('Content-Length: ', '', $header);
            break;
        }
    }

    /**
     * Start reading in the remote file, and writing it to the
     * local file one chunk at a time.
     */
    $cnt = 0;
    while(!feof($i_handle)) {
        $buf = '';
        $buf = fread($i_handle, $chunksize);
        $bytes = fwrite($o_handle, $buf);
        if ($bytes == false) {
            return false;
        }
        $cnt += $bytes;

        /**
         * We're done reading when we've reached the conent length
         */
        if ($cnt >= $length) break;
    }

    fclose($i_handle);
    fclose($o_handle);
    return $cnt;
}

damn wanted to be notified of responses to this post. Sorry.

Hi All,

I am not sure what to do in my case.

I am using buddypress activity plus. When somebody upload the image using url option the images are shown at full size with no links the lightbox. but when somebody upload a image to post, it shows small size of image with link to full size lightbox image.

I just want to increase the size of thumbnail of uploaded images, presently either hight or width never goes more then 150px.
I want to set this maxheight and maxwidth to something 250px or 300px.

I have tried to increase height and width value at line 36 and 38 of wp-content/plugins/buddypress-activity-plus/lib/class_bpfb_binder.php

But its not work.

Please help somebody!

Thanks

Hey there!

Have you tried to adjust the thumbnail size in your Site Settings?

Best,

Kimberly