تصميم صندوق لإظهار فيديو يوتوب بواسطة الرابط الخاص به فقط PHP - HTML

18-12-2021

1114

تصميم المواقع و التطبيقات NewMediene

بسم الله الرحمن الرحيم ، في هذا الموضوع جأت بفكرة بسيطة خاصة باليوتوب و طريقة إضافة فيديو بشكل سلس عبر الرابط الخاص به كموضوع جديد ، يمكن مثلا أن تصمم موقع يعرض فيديوهات متنوعة بإستخدام رابط فيديو اليوتيوب فقط .

في هذا المثال نحتاج القليل من أكواد البرمجة PHP - HTML - CSS

1- ملف index.php سيكون بمثابة صفحة لإضافة و عرض فيديو اليوتوب
<!DOCTYPE html>
<html>
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1" >

<link rel="stylesheet" href="http://www.dzworkers.com/demo/css/home.css">

<link rel="icon" href="http://www.dzworkers.com/demo/img/icon.png" >

<title>Youtube</title>

</head>

<body>

<div class="container" >

<div class="logo" ><a href="http://www.dzworkers.com" ><img src="http://www.dzworkers.com/demo/img/logo.jpeg" /></a></div>

<div class="youtube" >

<?php
if(isset($_POST['add'])){

$title = strip_tags(trim($_POST['title']));
$urlvideo = strip_tags(trim($_POST['urlvideo']));

if(filter_var($urlvideo, FILTER_VALIDATE_URL) AND preg_match("/youtube.com/i",$urlvideo) == 1){

if(preg_match("/www.youtube.com/i",$urlvideo) == 1){
$correcteUrl = str_replace("https://www.youtube.com/watch?v=","",$urlvideo);

}else if(preg_match("/youtube.com/i",$urlvideo) == 1){
$correcteUrl = str_replace("https://youtube.com/watch?v=","",$urlvideo);

}

}else if(filter_var($urlvideo, FILTER_VALIDATE_URL) AND preg_match("/youtu.be/i",$urlvideo) == 1){

if(preg_match("/www.youtu.be/i",$urlvideo) == 1){
$correcteUrl = str_replace("https://www.youtu.be/","",$urlvideo);

}else if(preg_match("/youtu.be/i",$urlvideo) == 1){
$correcteUrl = str_replace("https://youtu.be/","",$urlvideo);

}

}else{

$correcteUrl = "";

}

if(!empty($title) OR !empty($correcteUrl)){

if(isset($correcteUrl)){ ?>

<div class='post' >

<h3><?php echo $title ?></h3>

<!--- IMAGE VIDEO YOUTUBE --->
<img src="https://i.ytimg.com/vi/<?php echo $correcteUrl ?>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLC3R5kiRBS9OAjnrs58nd_LlfaPPw" />

<!--- VIDEO YOUTUBE --->
<iframe src="<?php echo "https://www.youtube.com/embed/".$correcteUrl ?>?rel=0&controls=0" title="<?php echo $title ?>" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

</div>

<?php }

}else {

echo "<div class='post' >يوجد خانة فارغة !</div>";

}

}// --- ?>

<form id="forminput" method="POST" >

<div class="title" ><p>إضافة فيديو يوتوب جديد</p></div>

<div class="inputclass" ><p>عنوان الفيديو</p><input type="text" name="title" required></div>

<div class="inputclass" ><p>رابط اليوتوب</p><input type="url" name="urlvideo" required></div>

<div class="submitclass" >
<input type="submit" name="add" value="إضافة فيديو" >
</div>

</form>

</div>

</div>

</body>

</html>