favorite single images or in gallery?

I’ve looked around for how to do this as well.

What confuses me is that the option in Settings > Favorites > Display shows for the post type “attachment” which is an image in the media gallery. So to me, that would mean the favorite button should show up on each image on the site that is in the media library, if it was inserted into the page/post editor.

But no, nothing there.

I’ve tried to think how I could do it using jQuery, to loop through each image within a div or some element, and add the function the_favorites_button($post_id, $site_id); for each element, and then pass in the attachment id, but I’m not sure how that would be done.

If I was adding images via the template file, I think I could figure this out, but when the images are added via the editor, I don’t know how to get those attachment ids.

Help!?

The attachment option probably refers to the attachment page that WordPress automatically generates for each media file. From my understanding, the plugin works for post types only.

I am looking for a solution to this too thought, it would be an awesome feature if we could favorite images!

i resorted to fitler the gallery function in wp-includes/media.php with basically a duplicate with Favorites’ php added:

<?php
function custom_wp_gallery( $output, $attr ) {
	global $post, $wp_locale;

	static $instance = 0;
	$instance++;

	if ( ! empty( $attr['ids'] ) ) {
		// 'ids' is explicitly ordered, unless you specify otherwise.
		if ( empty( $attr['orderby'] ) ) {
			$attr['orderby'] = 'post__in';
		}
		$attr['include'] = $attr['ids'];
	}

	$html5 = current_theme_supports( 'html5', 'gallery' );
	$atts = shortcode_atts( array(
		'order'      => 'ASC',
		'orderby'    => 'menu_order ID',
		'id'         => $post ? $post->ID : 0,
		'itemtag'    => $html5 ? 'figure'     : 'dl',
		'icontag'    => $html5 ? 'div'        : 'dt',
		'captiontag' => $html5 ? 'figcaption' : 'dd',
		'columns'    => 3,
		'size'       => 'thumbnail',
		'include'    => '',
		'exclude'    => '',
		'link'       => ''
	), $attr, 'gallery' );

	$id = intval( $atts['id'] );

	if ( ! empty( $atts['include'] ) ) {
		$_attachments = get_posts( array( 'include' => $atts['include'], 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $atts['order'], 'orderby' => $atts['orderby'] ) );

		$attachments = array();
		foreach ( $_attachments as $key => $val ) {
			$attachments[$val->ID] = $_attachments[$key];
		}
	} elseif ( ! empty( $atts['exclude'] ) ) {
		$attachments = get_children( array( 'post_parent' => $id, 'exclude' => $atts['exclude'], 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $atts['order'], 'orderby' => $atts['orderby'] ) );
	} else {
		$attachments = get_children( array( 'post_parent' => $id, 'post_status' => 'inherit', 'post_type' => 'attachment', 'post_mime_type' => 'image', 'order' => $atts['order'], 'orderby' => $atts['orderby'] ) );
	}

	if ( empty( $attachments ) ) {
		return '';
	}

	if ( is_feed() ) {
		$output = "\n";
		foreach ( $attachments as $att_id => $attachment ) {
			$output .= wp_get_attachment_link( $att_id, $atts['size'], true ) . "\n";
		}
		return $output;
	}

	$itemtag = tag_escape( $atts['itemtag'] );
	$captiontag = tag_escape( $atts['captiontag'] );
	$icontag = tag_escape( $atts['icontag'] );
	$valid_tags = wp_kses_allowed_html( 'post' );
	if ( ! isset( $valid_tags[ $itemtag ] ) ) {
		$itemtag = 'dl';
	}
	if ( ! isset( $valid_tags[ $captiontag ] ) ) {
		$captiontag = 'dd';
	}
	if ( ! isset( $valid_tags[ $icontag ] ) ) {
		$icontag = 'dt';
	}

	$columns = intval( $atts['columns'] );
	$itemwidth = $columns > 0 ? floor(100/$columns) : 100;
	$float = is_rtl() ? 'right' : 'left';

	$selector = "gallery-{$instance}";

	$gallery_style = '';

	/**
	 * Filter whether to print default gallery styles.
	 *
	 * @since 3.1.0
	 *
	 * @param bool $print Whether to print default gallery styles.
	 *                    Defaults to false if the theme supports HTML5 galleries.
	 *                    Otherwise, defaults to true.
	 */
	if ( apply_filters( 'use_default_gallery_style', ! $html5 ) ) {
		$gallery_style = "
		<style type='text/css'>
			#{$selector} {
				margin: auto;
			}
			#{$selector} .gallery-item {
				float: {$float};
				margin-top: 10px;
				text-align: center;
				width: {$itemwidth}%;
			}
			#{$selector} img {
				border: 2px solid #cfcfcf;
			}
			#{$selector} .gallery-caption {
				margin-left: 0;
			}
			/* see gallery_shortcode() in wp-includes/media.php */
		</style>\n\t\t";
	}

	$size_class = sanitize_html_class( $atts['size'] );
	$gallery_div = "<div id='$selector' class='gallery galleryid-{$id} gallery-columns-{$columns} gallery-size-{$size_class}'>";

	/**
	 * Filter the default gallery shortcode CSS styles.
	 *
	 * @since 2.5.0
	 *
	 * @param string $gallery_style Default CSS styles and opening HTML div container
	 *                              for the gallery shortcode output.
	 */
	$output = apply_filters( 'gallery_style', $gallery_style . $gallery_div );

	// Iterate through the attachments in this gallery instance
	$i = 0;
	foreach ( $attachments as $id => $attachment ) {

		$attr = ( trim( $attachment->post_excerpt ) ) ? array( 'aria-describedby' => "$selector-$id" ) : '';
		if ( ! empty( $atts['link'] ) && 'file' === $atts['link'] ) {
			$image_output = wp_get_attachment_link( $id, $atts['size'], false, false, false, $attr );
		} elseif ( ! empty( $atts['link'] ) && 'none' === $atts['link'] ) {
			$image_output = wp_get_attachment_image( $id, $atts['size'], false, $attr );
		} else {
			$image_output = wp_get_attachment_link( $id, $atts['size'], true, false, false, $attr );
		}
		$image_meta  = wp_get_attachment_metadata( $id );
		$image_url = wp_get_attachment_url( $id );

		$orientation = '';
		if ( isset( $image_meta['height'], $image_meta['width'] ) ) {
			$orientation = ( $image_meta['height'] > $image_meta['width'] ) ? 'portrait' : 'landscape';
		}
		$output .= "<{$itemtag} class='gallery-item'>";
		$output .= "
			<{$icontag} class='gallery-icon {$orientation}'>
				$image_output
			</{$icontag}>";
		if ( $captiontag && trim($attachment->post_excerpt) ) {
			$output .= "
				<{$captiontag} class='wp-caption-text gallery-caption' id='$selector-$id'>
				" . wptexturize($attachment->post_excerpt) . "
				</{$captiontag}>";
		}

		// OUTPUT FAVORITES BUTTON
		$output .= get_favorites_button($attachment->ID);

		$output .= "</{$itemtag}>";
		if ( ! $html5 && $columns > 0 && ++$i % $columns == 0 ) {
			$output .= '<br style="clear: both" />';
		}
	}

	if ( ! $html5 && $columns > 0 && $i % $columns !== 0 ) {
		$output .= "
			<br style='clear: both' />";
	}

	$output .= "
		</div>\n";

	return $output;

}
add_filter( 'post_gallery', 'custom_wp_gallery', 10, 2 );

i added it to functions.php, Favorites button now appears below each thumbnail and with the correct attachment id.

@maxgx Thanks for your probably great solution. Unfortunately I’m a WordPress starter and I need some more information. Please, could you help me?

1.You copy some parts from the wp-includes/media.php, we see above in an other file.
2. This file you named favorites.php. But where you place it? Also in wp-includes/ or somewhere in the wp-content/plugins/favorites folder?
3. Add it to functions.php – I’ve looked in the functions.php in wp-includes/ but not find an idea what to do.

Does this solution work with every kind of adding an image to a blog post? Add media or chose an other Format like Gallery?

My website you will find here: https://allorien.net/

• This reply was modified 7 years, 7 months ago by nemessis.

sorry @nemessis, probably i hadn’t been clear.

what i did was to take media gallery’s php and favourite’s php, and combine them into a custom function, to be placed in my theme’s functions.php file.

so no new favourite.php file at all, it’s just a new function to be added to functions.php in your theme.

all it does is replicate/filter wp gallery to add favourite’s code to each thumbnail.

hope that helps.

Thank you very much, @maxgx.

Puh, after a hole night I understand the wordpress themes much more than before. ?? Unfortunatelly, in my theme exists a gallery display function and unfortunatelly I do not find these before. This morning at 5:00 I get it. Favorit button at the top of every image in the post/page, slider or not.

Now, I have a small problem, the script do not work/start at the post page. But I hope I will find this problem in a few hours. ??

Again, thank you very mch for the idee and your help!