Cacher is the code snippet organizer for pro developers

https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=50&playlistId={DEINE_PLAYLIST_ID}&fields=items%2Fsnippet&key={DEIN_API_KEY}

<?php
function get_data($url)
{
  $ch = curl_init();
  $timeout = 5;
  curl_setopt($ch,CURLOPT_URL,$url);
  curl_setopt($ch,CURLOPT_RETURNTRANSFER,1);
  curl_setopt($ch,CURLOPT_CONNECTTIMEOUT,$timeout);
  $data = curl_exec($ch);
  curl_close($ch);
  return $data;
}

$api = get_data("https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&playlistId={DEINE_PLAYLIST_ID}&maxResults=10&fields=items%2Fsnippet&key={DEIN_API_KEY}");

$video = json_decode($api, true);
?>

<?php
//Schleife durch $video Array beginnend bei items 
foreach($video['items'] as $video_data) { ?>
<div class="video-wrapper">
    <iframe 
        width="480" height="320"
        src="https://www.youtube.com/embed/<?=$video_data['snippet']['resourceId']['videoId']?>" 
        frameborder="0" 
        allowfullscreen>
    </iframe>
</div>
<?php } // Ende Foreach Schleife?>

<style>
  .video-wrapper {
	float:left;
	margin: 0 20px 20px 0;
}
</style>

<?php
//Schleife durch $video Array beginnend bei items 
foreach($video['items'] as $video_data) { ?>

<div class="thumbnail-wrapper">
	<a href="http://www.youtube.com/watch?v=<?=$video_data['snippet']['resourceId']['videoId']?>" class="popup-youtube">
		<img src="<?=$video_data['snippet']['thumbnails']['medium']['url']?>" alt="...">
    </a>
    <div class="caption">
        <p><strong><?=$video_data['snippet']['title']?></strong></p>
        <p><a href="http://www.youtube.com/watch?v=<?=$video_data['snippet']['resourceId']['videoId']?>" class="popup-youtube">anschauen</a></p>
    </div>
</div>

<?php } // Ende Foreach Schleife?>

<style>
/*simple Demo CSS */
.thumbnail-wrapper {
	width:320px;
	padding: 3px;
	border: 1px solid #ccc;
	float:left;
	margin: 0 20px 20px 0;
}
</style>

<!-- Lightbox Plugin -->
<link rel="stylesheet" type="text/css" href="magnific/magnific-popup.css"/>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="magnific/magnific-popup.min.js"></script><!-- Lightbox Plugin -->

<script type="text/javascript">
/* Lightbox initialisieren */
    $('.popup-youtube, .popup-vimeo, .popup-gmaps').magnificPopup({
        disableOn: 700,
        type: 'iframe',
        mainClass: 'mfp-fade',
        removalDelay: 160,
        preloader: false,

        fixedContentPos: false
    });	
</script>