Posts Tagged thumbnails

YouTubeNails 2.0.0 – Displays Thumbnails for your YouTube videos on WordPress sites

YouTubeNails 2.0.0 is the second version of the first plugin I created for WordPress. Basically, it displays a thumbnail gallery based on all your posts that contains YouTube videos.
YouTubeNails 2.0.0 é a segunda versão do primeiro plugin que criei para WordPress. Basicamente, ele exibe uma galeria de thumbnails baseada em todos os seus posts que contém vídeos do YouTube.

The cool thing about it, is that you can choose between easily configure a widget on wp-admin, or call it as a short code where you want, passing some parameters that allows you to set things like the number of posts you want to display, their category, and even the thumbnails size.
O legal é que você pode escolher entre configurar facilmente um widget no wp-admin, ou chamá-lo como um short code onde quiser, passando alguns parâmetros que te permitem configurar coisas como o número de posts que quer exibir, a categoria deles e mesmo o tamanho dos thumbnails.

Take a look on the plugin installation page, and see how it works in a easy way.
Dê uma olhada na página de instalação do plugin e veja como ele funciona de maneira simples.

Please let me know if you are using the plugin(and if you allow, I’ll tweet your site to my friends) or if you have doubts and suggestions, cos this second version was based on some comments I’ve received from YouTubeNails users.
Por favor me avise se você estiver usando o plugin(e se você permitir, twittarei seu site para meus amigos) ou se você tiver dúvidas e sugestões, porque esta segunda versão foi baseada em alguns comentários que recebi dos usuários do YouTubeNails.

Advertisements

,

Leave a comment

Display WordPress Post List With Custom Size Thumbnails(the first image of each post)

This post moved to http://www.wpworking.com/general/display-wordpress-post-list-with-custom-size-thumbnails/

Note:

Maybe you will like to take a look on my Get Post List With Thumbnails plugin, wich is a evolution of the function bellow and you can configure and use as widget.

The function bellow, shows a list with posts and custom size thumbnails(for the post first image), linked to each post permalink. You can use it wherever you want, and you can choose a category(not required) and the number of posts(not required). Two simple steps:
A função abaixo mostra uma lista de posts com thumbnails de tamanho customizável(para a primeira imagem de cada post), linkados ao link permanente de cada post. Você pode usar onde quiser, e pode escolher uma categoria(não obrigatório) e o número de posts(não obrigatório). Dois passos simples:

1) Put this function on “functions.php” file, in your template folder:
1) Coloque esta função no arquivo “functions.php”, na pasta de seu template.

<?
// display a list of posts with custom size thumbnails, using the post first image
function getPostList($categ='',$postnr=20){
	// $categ = category name - not required
	// $postnr = number of posts you want to display - not required
	$htmlcod .= "<div id='div_postlist' style='border:1px red solid'>"."\n";
	// 
	if (have_posts()) : 				
		global $post;
	    // here we check if the user has chosen a category
	    if($categ!=''){
	      $strquery = "numberposts=".$postnr."&category_name=". $categ;				
	    }
	    else{
	      $strquery =  "numberposts=".$postnr;
	    }
			 
	    // here we get the posts
	    $myposts = get_posts($strquery);
			 		 
	    // if we want, we can display the number of registers found
	    //echo sizeof($myposts);
			 
	    if($myposts):
		 // here we go in the loop
		foreach($myposts as $post) :				 	
                    // getting the first image of the post to make the thumb
                    $args = array(
                        'post_type' => 'attachment',
                        'numberposts' => -1,
                        'post_status' => null,
                        'post_parent' => $post->ID
                    ); 
                    $attachments = get_posts($args);
                    
                    // here we set the variable for the attachment string
                    $imgsrc = "";
                    if ($attachments):
                        // here we take the first image and break the loop
                        foreach ($attachments as $attachment) {
                             // this brings the attachment array $imgobj = wp_get_attachment_image_src($attachment->ID);
                             // if you use the line obove, you can call $imgobj[0] to get the image source 
                            // you can set the thumbnail dimensions, here we use 40 x 40
                            $imgsrc = wp_get_attachment_image($attachment->ID, array(40,40), $icon = false);
                            break;
                        }
                    endif;
                    // here we start to build the return html code
                        $htmlcod .= "<p><a href='". get_permalink()."' title='". get_the_title() ."'>";
                        $htmlcod .= get_the_time('d/m/Y')."-".get_the_title();
                        $htmlcod .= "</a></p>"."\n";	
                    // if the post has at least one image attached, we display it
                    if($imgsrc!=""):
                        $htmlcod .= "<p>";                                	
                        $htmlcod .= "<a href='". get_permalink() ."' title='". get_the_title() ."'>";
                        $htmlcod .= $imgsrc; 
                        $htmlcod .= "</a>"."\n";       
                        $htmlcod .= "</p>"."\n";															
                    endif;								
		endforeach;     
	    else:
			// here goes the message, if there is no results to display
			$htmlcod = "<div>"."\n";
			$htmlcod .= "<p>No registers found.</p>"."\n";								
			$htmlcod .= "</div>"."\n";
	    endif;			
	endif;
        $htmlcod .= "</div>";
	return $htmlcod;
}
?>

2) Call the function wherever you want:
2) Chame a função, onde quiser.

// e.g. - no category, twenty(20) posts 
<? echo getPostList('',20); ?>

or

// e.g. - 'musicposts' category name, no number of posts, but the function uses 20 as default
<? echo getPostList('musicposts');  ?>

or

 // e.g. - 'gameposts' category name, no number of posts, 5 posts
<? echo getPostList('gameposts',5); ?>

Hope you find it useful.

, , ,

12 Comments

YouTube/Photos Thumbnails on WordPress Similar Posts Plugin List

If you are working with “Similar Posts” plugin, and videos / images on your posts, maybe you would like to display a post thumbnail for each post on your related posts list.
Se você está trabalhando com o plugin WordPress “Similar Posts”, e vídeos / imagens em seus posts, talvez você gostasse de exibir um thumbnail de cada post em sua lista de posts relacionados.

There are three very simple steps.
São três passos muito simples.

1) First of all, take a look on this post, where I talk about my YouTube Thumbnails workaround on WordPress.
Primeiramente, dê uma olhada no post em que falo sobre minha solução para thumbnails do YouTube no WordPress.

2) Go to wp-admin/settings and on “Similar Posts” Output/Output template, you will paste the code from the next step.
Vá até wp-admin/configurações e em “Similar Posts” Output/Output template, você colará o código do próximo passo.

3) Then you can use my workaround, and the code bellow, together, to display a list of similar posts, with images of your posts(photo, YouTube thumbnails) and a default image for those posts without media.
Então você pode usar minha solução, e o código abaixo, juntos, para exibir uma lista de posts similares com imagens do seu post(thumbnails de fotos, do YouTube) e uma imagem padrão para aqueles posts sem mídia.

<div>
<span><a href={url} title={title}>
<img src={imagesrc} alt={title} {php:if(strval({imagesrc})==""):echo "style='display:none;'";endif;}>
{php:$videolnk ="";$videolnk = get_post_meta({postid}, 'link_video', true);$videolnk = str_replace('http://www.youtube.com/watch?v=','http://img.youtube.com/vi/',$videolnk); if($videolnk!=''):$videolnk = $videolnk.'/2.jpg';endif;if(strval({imagesrc})==""&& $videolnk!=""):echo "<img alt='videolnk' src=$videolnk width=150>";endif;if(strval({imagesrc})==""&& $videolnk==""):echo "<img src='yourdefaultthumbnailimage'>";endif;}
</a></span>
{link}
</div>

It uses PHP + “Similar Posts” custom tags to control and display the thumbnails.
Ele usa PHP + mais tags customizadas do “Similar Posts”, para controlar e exibir os thumbnails.

I hope you find this useful. Good luck!
Espero que você ache útil. Boa Sorte!

, ,

Leave a comment

Image gallery(thumbnails) with WordPress image cropping

What about creating a small gallery of linked thumbnails, based on images inserted in a post, with cropping thumbnails?

First, create a post on WordPress and choose a category, for example, “tour”.
Then you can insert as many images as you want, defining links as you want.
You can use a custom field, to manage the title of the galery.

Publish you post, and call it on your PHP page, using the code bellow(where you can choose the number of images of your gallery and the cropping dimensions):

<? 		
if (have_posts()) : 
 global $post;
 $myposts = get_posts('numberposts=1&category_name=tour');
 foreach($myposts as $post) :
	// # here you call a custom field on wordpress
	$tourdes = get_post_meta($post->ID, 'Descrip', true);
   setup_postdata($post);
 ?>
  <h4><?=$tourdes;?></h4>
	<div id="thumbs">            	
		<? 
		$args = array(
			'post_type' => 'attachment',
			'numberposts' => -1,
			'post_status' => null,
			'post_parent' => $post->ID
			); 
		$attachments = get_posts($args);
		if ($attachments) {
			// - $tot_img : the total number of thumbnails on the gallery
			$tot_img=8;
			// - $brk_lin : number of image on each line
			$brk_lin=4;
			foreach ($attachments as $attachment) {						
			  // # here we define the max number of images
			  if(intval($cnt_img) < $tot_img){							
				echo "<span style='padding-left:3px'>";
				$imgref = wp_get_attachment_url($attachment->ID);
				$imgsrc = wp_get_attachment_image($attachment->ID, array(40,40), $icon = false);
				echo "<a href=".$imgref.">". $imgsrc ."<a>";
				echo "</span>"."\n";							
				// # here we define the line break
				$cnt_lin=$cnt_lin+1;
				  if(intval($cnt_lin)==$brk_lin){
				 echo "<br>";	
				 $cnt_lin=0;							
				  }
			   }
			   $cnt_img=$cnt_img+1;						
			}
		}
	
		
		?>
	</div>
<? endforeach;
endif; ?>

,

7 Comments

Display YouTube Thumbnail with wordpress custom field

Note:

Before using the code bellow, I strongly recommend you to take a look on my YouTubeNails plugin, wich is a evolution of the function bellow and you can easily configure as a widget.

Why saving a video thumbnail for a video hosted on YouTube, when you can use the YouTube API plus WordPress Custom Fields to display the thumb, without working around crops, size and other stuff like this.

All you need:

  1. Create a custom field called(slug) “link_video”, which contains the standard “share” url from YouTube, something like this http://www.youtube.com/watch?v=kBN9_deleBg&#8221;;
  2. Use the code bellow, to retrieve data, inside a WordPress Loop;
<?
if (have_posts()) : 				
  global $post;
  $strquery = "category_name=videos";
  $myposts = get_posts($strquery);
  if($myposts):
	foreach($myposts as $post) :
             setup_postdata($post);
            // get meta from the custom field, using its slug
            $videolnk = get_post_meta($post->ID, 'link_video', true);
            // pure php string replace
           // add the standard YouTube API call for video thumbnails
           $videolnk = str_replace('http://www.youtube.com/watch?v=','http://img.youtube.com/vi/',$videolnk);
           $videolnk .= "/2.jpg";
        endforeach;
  endif;
endif;
?>

Then you can call the code bellow on your page(inside the loop):

<a href="<?=get_permalink()?>">
<img src="<?=$videolnk?>" width="214" height="129" >
</a>

Go to the source, if you need further info about YouTube API.

, ,

9 Comments

%d bloggers like this: