What Will I Learn?
<ul>
<li>You will learn How to create a table in php
<li>You will learn How to input and play video files
<li>You will learn How to input and play Audio files
<h4>Requirements
<ul>
<li>You have basic about HTML
<li>You have basic about PHP
<li>To practice this tutorial need a text editor file (Notepad ++), browser (Google Chrome) and server (localhost, XAMPP).
<h4>Difficulty
<ul>
<li>Basic
<h4>Tutorial Contents
<p dir="auto">In this tutorial we will learn how to create a table and how to insert and play video files, and audio files using php.
<ul>
<li><strong>How to create a table in php.?
<li>First open your server localhost (XAMP)
<li>Secondly,Open your text editor ( notepad ++)
<li>Then create a new file and save it as php extention, such as index.php
<li>After that create a PHP script like the script below :
<pre><code><!DOCTYPE html>
<html>
<head>
<title>How to create a table in php</title>
</head>
<body>
<?php
echo "<h1>Examples of Some PHP Tables </h1>";
echo "<hr>";
echo "One column table";
echo "<table width = 500 border =1>
<tr>
<td> One column table </td>
</tr>
</table>";
?>
<?php
echo "<br>";
echo "Two column table";
echo "<table width = 500 border =1>
<tr>
<td> first column </td>
<td> the second column </td>
</tr>
</table>";
?>
<?php
echo "<br>";
echo "Table two lines";
echo "<br>";
echo "<table width = 500 border =1>
<tr>
<td>the first line</td>
</tr>
<tr>
<td>second row</td>
</tr>
</table>";
?>
<?php
echo "<br>";
echo "Table two rows of two columns";
echo "<br>";
echo "<table width = 500 border =1>
<tr>
<td>the first line</td>
<td>third row</td>
</tr>
<tr>
<td>second row</td>
<td>fourth row</td>
</tr>
</table>";
?>
<?php
echo "<br>";
echo "All TAbel Color";
echo "<br>";
echo "<table width = 500 border =1 bgcolor= green>
<tr>
<td>the first line</td>
<td>third row</td>
</tr>
<tr>
<td>second row </td>
<td>fourth row </td>
</tr>
</table>";
?>
<?php
echo "<br>";
echo "Only colored columns";
echo "<br>";
echo "<table width = 500 border =1>
<tr bgcolor=orange>
<td>the first line</td>
<td>third row</td>
</tr>
<tr>
<td>second row</td>
<td>fourth row</td>
</tr>
</table>";
?>
</body>
</html>
<ul>
<li><strong>Output
<p dir="auto"><img src="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518167948/dzcby2zckqycjao5opgr.jpg" alt="xx1.jpg" srcset="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518167948/dzcby2zckqycjao5opgr.jpg 1x, https://images.hive.blog/1536x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518167948/dzcby2zckqycjao5opgr.jpg 2x" />
<ul>
<li><strong>Explanation
<p dir="auto"><code>echo "<h1>Examples of Some PHP Tables </h1>";
<ul>
<li><p dir="auto"><strong>echo serves to display one or more data strings, example, h1 (heading) is used to create a title / string.
<li><p dir="auto"><code>echo "<hr>";hr (horizontal line) is the html element used to determine the length of a line.
<li><p dir="auto"><code>echo "<table width = 500 border =1> namely to function declare a table with a width of 500 in the border
<li><p dir="auto"><code><tr> which defines the rows in the table <code><td>that functioned thick appearance.
<li><p dir="auto"><code>bgcolor this time is giving color in table.
<li><p dir="auto"><strong>Next How to input and play video files
<li><p dir="auto">First open your server localhost (XAMP)
<li><p dir="auto">Secondly,Open your text editor ( notepad ++)
<li><p dir="auto">Then copy the input video file into the folder when video call later,example like picture below :
<p dir="auto"><img src="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170655/fvx6q8oylsg1t95bhmss.jpg" alt="ex1.jpg" srcset="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170655/fvx6q8oylsg1t95bhmss.jpg 1x, https://images.hive.blog/1536x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170655/fvx6q8oylsg1t95bhmss.jpg 2x" />
<ul>
<li>then equate the title video then input to the text editor script as below,
<li>After that create a new file and save it as html extention, such as <strong>video.html and do not forget to prepare video file with format (mp.4) into html folder so that when calling the inputed file it can appear.
<li>Lastly create a html script with elements, attributes and tags like the scrip below:
<pre><code><html>
<head>
<title>video</title>
<center><br><b>Play Video</b></br></center>
<br>
<table align=center bgcolor="green"><tr><td>
<center><video height="345"width="275"controls>
<source src="Ungu feat Peterpan - Cinta Yang Lain - YouTube.mp4"type="video/mp4">
</video></center>
</table>
</body>
</html>
<ul>
<li><strong>Output
<p dir="auto"><img src="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170989/crem4zw0mefbw9cv6mxg.jpg" alt="ex2.jpg" srcset="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170989/crem4zw0mefbw9cv6mxg.jpg 1x, https://images.hive.blog/1536x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518170989/crem4zw0mefbw9cv6mxg.jpg 2x" />
<ul>
<li><p dir="auto"><strong>Explanation
<li><p dir="auto"><code><table align=center bgcolor="green"><tr><td>
<li><p dir="auto">tableis a tag that serves to create a data consisting of rows and columns, the<code>nalign = center Determine the position of the web page line that is center is the tags html functioning put text in the center.
<li><p dir="auto"><code>bgcolor="green" green is making the base color of the green baground
<li><p dir="auto"><code><tr>which defines the rows in the table<code><td>that functioned thick appearance
<li><p dir="auto"><code><center><video height="345"width="275"controls> ie the function of putting video in the middle of the web page, with the hight size of 345 and the size of width is 275
<li><p dir="auto"><code><source src="Ungu feat Peterpan - Cinta Yang Lain - YouTube.mp4"type="video/mp4"><br />
serves to call the video file you want to display, examples such as "Ungu feat Peterpan - Cinta Yang Lain - YouTube.mp4" is the name of the video file to be displayed.
<li><p dir="auto"><strong>Lastly How to input and play Audio files
<li><p dir="auto">Open your text editor ( notepad ++)
<li><p dir="auto">then equate the title audio then input to the text editor script as below,
<li><p dir="auto">After that create a new file and save it as html extention, such as <strong>audio.html and do not forget to prepare audio file with format (mp.3) into html folder so that when calling the inputed file it can appear.
<li><p dir="auto">Lastly create a html script with elements, attributes and tags like the scrip below :
<pre><code><html>
<head>
<title>Audio</title>
<center><br><b>Play Audio</b></br></center>
<br>
<center> <embed src = " Ungu Bila Tiba.mp3" border ="2" autostart="false" height = "55" width = "600" align="middle"> </center>
</table>
</body>
</html>
<ul>
<li><strong>Output
<p dir="auto"><img src="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518172323/inl9r5znrszi2yyt6oub.jpg" alt="ex3.jpg" srcset="https://images.hive.blog/768x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518172323/inl9r5znrszi2yyt6oub.jpg 1x, https://images.hive.blog/1536x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1518172323/inl9r5znrszi2yyt6oub.jpg 2x" />
<ul>
<li>Explanation
<li><code><center> <embed src = " Ungu Bila Tiba.mp3" border ="2" autostart="false" height = "55" width = "600" align="middle"> </center>
<li>**embed **is a html tag, which functions to display external files, such as files, videos, mp3, pdf, and multimedia files on web pages, and at this time we just focus on How to input and play Audio files.
<li>|hopefully this tutorial is useful for beginners php programming ..seulebor :D|
<h4>Curriculum
<p dir="auto">Place here a list of related tutorials you have already shared on Utopian that make up a Course Curriculum, if applicable.
<ul>
<li>How to display pdf file, dynamic link and autorefresh time in to one php file
<p dir="auto"><br /><hr /><em>Posted on <a href="https://utopian.io/utopian-io/@dongkrak/how-to-create-tables-and-insert-play-video-and-audio-files-in-php" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Utopian.io - Rewarding Open Source Contributors<hr /><p>
Your contribution cannot be approved because it does not follow the Utopian Rules.
Design or video editing related tutorials, gameplay, simple on-screen instructions, ubiquitous functions (Save, Open, Print, etc.) or basic programming concepts (variables, operators, loops, etc.) will not be accepted.
You can contact us on Discord.
[utopian-moderator]
Congratulations @dongkrak! You have completed some achievement on Steemit and have been rewarded with new badge(s) :
<p dir="auto"><a href="http://steemitboard.com/@dongkrak" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link"><img src="https://images.hive.blog/768x0/https://steemitimages.com/70x80/http://steemitboard.com/notifications/payout.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/70x80/http://steemitboard.com/notifications/payout.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/70x80/http://steemitboard.com/notifications/payout.png 2x" /> Award for the total payout received <p dir="auto">Click on any badge to view your own Board of Honor on SteemitBoard.<br /> For more information about SteemitBoard, click <a href="https://steemit.com/@steemitboard" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">here <p dir="auto">If you no longer want to receive notifications, reply to this comment with the word <code>STOP <blockquote> <p dir="auto">By upvoting this notification, you can help all Steemit users. Learn how <a href="https://steemit.com/steemitboard/@steemitboard/http-i-cubeupload-com-7ciqeo-png" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">here!