Social Items

    •
Tampilkan postingan dengan label website. Tampilkan semua postingan
Tampilkan postingan dengan label website. Tampilkan semua postingan

Embed Youtube Shorts 2025

 YouTube Shorts adalah fitur baru dari YouTube yang memungkinkan pengguna membuat dan mengunggah video vertikal berdurasi pendek—hingga 3 menit—langsung dari perangkat smartphone mereka. Shorts dirancang untuk menjadi konten yang cepat, menghibur, dan mudah dibuat. Format ini sangat cocok untuk menarik perhatian penonton dalam waktu singkat dan ideal untuk promosi konten secara cepat di media sosial maupun situs web.Cara Embed Video YouTube Shorts ke Website.

 "Embed" adalah proses menyisipkan video YouTube ke dalam halaman website sehingga pengunjung situs dapat langsung menontonnya tanpa harus keluar dari halaman tersebut. Ini sangat bermanfaat karena bisa meningkatkan jumlah view, mengurangi bounce rate situs, serta membuat tampilan website kamu lebih menarik dan interaktif.


Berikut langkah-langkah mudah untuk melakukan embed video Shorts ke dalam website kamu:


  1. Buka video Shorts kamu di YouTube

    Pastikan video sudah dipublikasikan dan bisa ditonton oleh umum (public).


    1. Klik tombol "Share" (Bagikan)

    Tombol ini terletak di bawah video.


    1. Pilih opsi "Embed"

      Setelah memilih "Share", akan muncul beberapa pilihan. Klik "Embed" untuk menampilkan kode HTML.


      1. Salin kode embed yang muncul

        Contoh link yang dihasilkan berikut:

        https://youtube.com/shorts/VxRl_6RGJZ4?si=ZQTstj0tPo57E8uO

        Note**: Yang bertanda merah merupakan ID Video Youtube, silahkan copy dan paste di src dan youtube-src-id pada kode iframe.

        Kode iframe sebagai berikut:

        <iframe width="252" height="450"
    src="https://www.youtube.com/embed/VxRl_6RGJZ4?autoplay=1&mute=1&loop=1&playlist=VxRl_6RGJZ4"
    youtube-src-id="VxRl_6RGJZ4"
    frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
    allowfullscreen>
</iframe>

        Penjelasan:

        • autoplay=1 berarti video akan diputar otomatis saat halaman dimuat.
        • mute=1 berarti suara video dimatikan (ini merupakan syarat agar autoplay dapat berjalan di sebagian besar browser).
        • loop=1 berarti video akan diputar ulang secara terus-menerus.
        • playlist=YouTubeVideoID digunakan sebagai syarat agar loop=1 bisa bekerja jika hanya satu video yang diputar. Masukkan ID video yang sama ke dalam parameter playlist.

        1. Tempelkan kode embed ke dalam halaman web kamu

        Masuk ke editor HTML dari website kamu dan paste kode tadi ke bagian tempat kamu ingin menampilkan video.


         Dengan melakukan embed video Shorts kamu ke dalam website, kamu bisa menjangkau audiens yang lebih luas dan meningkatkan interaksi dengan pengunjung situs. Cara ini juga cocok untuk para pemilik blog, toko online, atau portofolio digital yang ingin menampilkan kreativitas mereka secara langsung. Selamat mencoba dan semoga channel YouTube kamu semakin berkembang!


        ~ Terima Kasih ~

        Embed Youtube Shorts di Website 2025 | 100% Work

         WordPress adalah salah satu CMS yang paling populer di dunia dengan lebih dari 40% dari seluruh situs web di internet yang menggunakan WordPress. Platform manajemen konten (Content Management System) atau CMS yang digunakan untuk membangun dan mengelola situs web. WordPress memungkinkan pengguna untuk membuat berbagai jenis situs web, termasuk blog, toko online, situs berita, dan banyak lagi.


         Jika kamu ingin melakukan pembuatan atau pengembangan sebuah situs web yang menggunakan WordPress tentunya akan melakukan pemasangan WordPress di local dahulu. Cara yang digunakan biasanya mendownload source code WordPress di wordpress.org . Setelah itu di ekstrak ke dalam folder yang nantinya di tempatkan pada server web yang kamu punya. Server web yang dipakai biasanya adalah Apache atau Nginx. Cara download dan ekstrak itu kurang cepat untuk diterapkan. Ada cara yang cepat yaitu menggunakan Laragon. Jika kamu biasanya menggunakan XAMPP, Wamp Server, MAMP atau AMPPS, kamu patut mencoba menggunakan Laragon. Kamu akan merasakan hasilnya sendiri.


         Maka dari itu mari simak cara cepat setup Wordpress untuk Development pada tutorial di bawah ini.

        1. Pastikan sudah mempunyai Laragon. Jika belum download Laragon | DISINI |
        2. Install Laragonnya.
        3. Aktifkan Apache dan MySQL pada Laragon.
        4. Pilih menu Quick App -> Pilih WordPress seperti gambar di bawah ini.
        Tampilan pilihan WordPress


        1.  Isikan nama projectnya seperti gambar di bawah ini. Jika lebih dari satu kata gunakan tanda (-) sebagai penghubung.
        Tampilan buat nama project

        1. Tunggu proses ekstrak WordPress ke dalam projectnya. Pada proses ini akan terlihat alamat project sesuai nama project yang kita buat "http://pongkagame.test"
        Tampilan ekstrak WordPress oleh Laragon ke dalam project

        1. Jika proses ekstrak sudah selesai. Buka browser -> buka alamat "https://pongkagame.test"


        1. Maka akan muncul proses install WordPressnya. Pertama: pilih bahasa sesuai keinginan kamu seperti gambar di bawah ini.
        Tampilan pilihan bahasa WordPress

        1. Kedua: isikan informasi yang dibutuhkan yaitu Site title, Username, Password dan Email seperti gambar di bawah ini. Jika sudah klik button "Install Wordpress"
        Tampilan isian informasi WordPress

        1. Jika berhasil maka akan muncul tampilan seperti di bawah ini. Klik button "Log In" untuk login ke dashboard WordPress.
        Tampilan WorpPress berhasil terinstall

        1. Selamat kamu sekarang bisa melakukan login ke project WordPress yang kamu buat.
        Tampilan login Wordpress


         Setelah kamu mengikuti dan menerapkan metode instalasi WordPress menggunakan Laragon kamu akan merasakan waktu yang singkat dibutuhkan untuk memiliki WordPress untuk Development. Waktu yang dibutuhkan kurang lebih 1 menit saja. 
         
         Demikian tutorial mengenai instalasi WordPress untuk Development atau pengembangan situs web berbasis WordPress yang sedang kamu buat.


        ~ Terima Kasih ~

        Cara cepat setup WordPress untuk Development


          Lapce adalalah editor kode secepat kilat dan kuat ditulis dalam Rust. Bagi yang belum tahu Rust, Rust adalah Bahasa pemrograman yang memberdayakan semua orang untuk membangun perangkat lunak yang andal dan efisien (rust-lang.org).


         Lapce memang sangat cepat terbukti dengan ukuran sizenya 80 MB setelah memasangnya di sistem operasi yang kamu punya. Bukan itu saja, kamu tidak perlu menginstalnya karena Lapce bisa digunakan portable di Windows 11. Jika belum merasa tertarik untuk menggunakannya, silahkan lihat screenshot aplikasi Lapcenya di bawah ini.


         Jika kamu pertama kali membuka project yang kamu punya menggunakan Lapce maka tampilannya akan seperti di bawah ini.


        Tampilan Lapce

         Jika kamu ingin menambahkan extension pada Lapce maka pilih icon extension pada deretan terakhir di project manager seperti di bawah ini.

        Lapce extensions

         Jika kamu ingin menggunakan Git maka tinggal pilih icon Git pada deretan nomor 2 di project manager seperti di bawah ini.

        Lapce Git

         Bagaimana sudah tertarik bukan untuk mencoba Lapce sebagai editor kode di project kamu? untuk mendownload aplikasinya silahkan klik tombol download di bawah ini.


        Referensi:



        ~ Terima Kasih ~

        Cara install Lapce code editor di Windows 11, sangat ringan dan mirip VS code


         Pada kesempatan kali ini saya akan membagikan source code dari konversi gambar ke PDF menggunakan bahasa pemrograman PHP dimana aplikasi ini berbasis Website. Tentunya melakukan konversi sebuah gambar ke PDF sangat sering dibutuhkan banyak orang setiap hari. Hal ini terbukti dengan banyaknya website yang menyediakan layanan konversi gambar ke PDF yang dibuat untuk mempermudah kita dalam mengkonversikan gambar yang kita punya dari platform mana saja. Layanan konversi menggunakan website juga mempersingkat waktu kita untuk tidak lagi menginstal aplikasi konversi gambar ke PDF di sistem operasi yang kita punya terlebih dahulu, tentu saja kita akan bingung untuk menentukan pilihan aplikasi mana yang cocok untuk kita gunakan melakukan konversi.

         Tentunya hal menarik bukan ketika kamu bisa membuat layanan konversi gambar ke PDF milik kamu sendiri?. Untuk itu, mari kita simak tampilan aplikasi konversi gambar ke PDF berbasis Web di bawah ini.

         

        Tampilan aplikasi img to pdf


         Jika kamu ingin mencobanya terlebih dahulu, silahkan menggunakan link di bawah ini.


         Jika kamu ingin mendownload source codenya, silahkan gunakan link di bawah ini.




        Referensi :


         Demikian artikel yang mengenai source code konversi gambar ke PDF menggunakan bahasa pemrograman PHP. Semoga bisa membantu kamu dalam pengembangan aplikasi yang sedang kamu buat. Silahkan kembangkan source code tersebut seperti frontend dan fitur-fitur lainnya.


        ~ Terima Kasih ~

        Source code: Konversi gambar ke PDF (PHP) terbaru

          


         Desain website merupakan tahap merancang website dalam bentuk rancangan yang sesuai dengan website yang akan kita buat sehingga bisa terlihat oleh user seperti apa dan apa yang diharus dimiliki website yang akan kita buat atau dalam kata lain user interface.  Untuk melakukan desain website tentunya perlu adanya aplikasi yang bisa digunakan untuk melakukan desain, dimana banyak yang menjadi pilihan sejak dulu seperti Abode Photoshop, Adobe Ilustrator, Adobe Dreamweaver, Pencil, Scribus, Inkscape bahkan GIMP. Tapi dalam era yang semakin maju tentu ada inovasi yang diperlukan guna mengerjakan desain bisa dikhususkan pada aplikasi tertentu. Sebagai contoh desain photo menggunakan aplikasi desain khusus photo.

         Saat ini populer aplikasi yang digunakan untuk melakukan desain website dengan sistem komponen sehingga lebih mudah untuk merancang atau mendesain website yang akan kita buat sebagai contoh ada Figma, Wix, . Apakah kamu sudah mencoba Lunacy? Jika belum silahkan klik link berikut DISINI. Lunacy adalah aplikasi yang 100% gratis digunakan untuk melakukan desain website. Aplikasi gratis apakah layak ? Kalau kamu penasaran silahkan simak screenshot aplikasi Lunacy di bawah ini.

        Mode editing atau mendesain

        Mode Presentasi


         Berdasarkan pengalaman saya Lunacy adalah pilihan yang tepat untuk digunakan desain website karena saya sebagai pengguna Figma merasa menu-menu dan komponen yang ada di Lunacy sangat tidak asing setelah saya memakai Figma. Jadi lebih penasaran? Silahkan simak video tutorial singkat saya di bawah ini.



         Tunggu apalagi dapatkan aplikasi Lunacy segera pada link di bawah ini. Ingat Lunacy is 100% Free Design Software. Kamu bisa download pada link DISINI.


        ~ Terima Kasih ~

        Aplikasi gratis untuk desain website selain Figma? coba Lunacy!

         

         Hai, semua! Pada kesempatan kali ini saya akan membagikan tutorial membuat menu website keren masa kini menggunakan Javasript. Jadi apa yang akan saya buat?. Saya akan membuat sebuah menu yang berisikan nama-nama  yaitu: 
        1. Home
        2. About
        3. Categories
         Pada menu Categories berisikan submenu yaitu:
        1. Cars
        2. Bicycles
        3. Toys
         Pada menu tersebut memiliki role yaitu:
        1. Ketika user melakukan hover pada menu utama maka background pada header akan berubah warna.
        2. Jika terdapat submenu pada menu utama (menu Categories) ditandai dengan icon panah menunjuk ke bawah  maka user harus melakukan click terlebih  dahulu pada menu utama.
        3. Ketika user melakukan klik pada menu utama yang berisikan submenu maka submenu akan terlihat dan icon pada menu utama tersebut akan berbalik arah yang menandakan submenu telah terbuka.
         Berikut di bawah ini tampilan akhir dari menu website keren masa kini ini.


         Jika kamu tertarik dengan source code dari menu tersebut, silahkan download pada link di bawah ini.


         Demikian pembahasan kali ini, semoga bisa membantu kamu untuk menambah referensi dalam pembuatan project website yang sedang kamu kerjakan.

        ~ Terima Kasih ~

        Membuat Menu Website keren masa kini menggunakan Javascript



         Sesuai gambar di atas, membuat karakter profil unik dengan nama kamu bisa kamu buat. Aplikasi ini bernama Pictogrify yaitu generator unik piktogram dari teks yang ketikkan. Pictogrify ini dapat kamu akses melalui laman berikut luciorubeens.github.io/pictogrify/. Pictogrify ini merupakan buatan Lúcio Rubens. Pada dasarnya gambar yang otomatis akan dimuat ketika kamu mengetikan tulisan pada laman tersebut. 


         Pictogrify merupakan package yang dibuat dalam bahasa pemrograman Javascript, sehingga gambar yang muncul seperti di laman resminya tersebut merupakan gambar contoh buatan dari creatornya. Kamu yang seorang programmer bisa menggunakan package yang telah dibuat tersebut untuk gambar yang kamu buat sendiri. Dokumentasi dari penggunaan Pictogrify ini bisa kamu temukan pada laman berikut : github.com/luciorubeens/pictogrify. 

        Membuat karakter profil unik dengan nama kamu

         Laragon adalah suatu aplikasi yang digunakan untuk pengembangan aplikasi website dalam lingkup yang menyeluruh dan bisa digunakan secara portable pada sistem operasi Windows sehingga kamu tidak perlu pusing dalam mengakses baik server maupun database bisa dijalankan dengan aplikasi Laragon. Bagi kamu yang merupakan seorang developer website pasti tidak asing lagi menggunakan aplikasi Laragon. Pada tutorial kali ini akan dibahas cara mengubah http menjadi https di Laragon menggunakan server Apache. Mari simak tutorial dibawah ini :


         Pastikan server Apache pada aplikasi Laragon kamu dimatikan terlebih dahulu.


        1. Buka aplikasi Laragon. Pilih icon setting -> Pilih tab Services & Ports -> Centang ☑ Enable SSL 443

        enable SSL


        1. Klik kanan pada icon Laragon di taskbar pilih apache ->  SSL -> Add laragon.crt Trust Store
        laragon.crt


        1. Start kembali Laragon dan buka link pada browser [ https://localhost ]

         Jika telah berisi icon gembok maka localhost kamu telah menggunakan HTTPS sebagai protocol aksesnya. Demikian tutorial cara mengubah HTTP menjadi HTTPS server Apache pada aplikasi Laragon. Selamat membuat aplikasi dengan lebih nyaman.

        - Terima Kasih -

        Cara mengubah HTTP menjadi HTTPS server Apache pada Laragon 5

          

         Pada kesempatan kali ini, saya akan membagikan source code dari aplikasi Youtube Video Downloader dengan mengunakan bahasa pemrograman PHP. Aplikasi Youtube Video Downloader yang saya buat ini merupakan versi 2 dari sebelumnya. Berikut di bawah ini tampilan dari aplikasinya.


         Untuk demo aplikasinya disilahkan klik link di bawah ini.

         Silahkan download source code dari aplikasi Youtube Video Downloader versi 2 di bawah ini.

        password : pongkagamebest

        source code Youtube Video Downloader [PHP] versi 2

         


         Pada kesempatan kali ini saya akan membagikan cara memasang aplikasi Google Web Designer di Linux Mint 17.3. Google Web Designer sesuai namanya merupakan aplikasi buatan Google yang sangat powerfull digunakan untuk membuat iklan HTML yang interaktif dengan animasi pada sistem operasi Mac, Windows maupun Linux. Aplikasi ini memang terdengar masih asing dikalangan desainer yang biasanya menggunakan aplikasi produk dari Adobe. Mari ikuti langkah di bawah ini untuk pemasangannya.


        1. Download aplikasi Google Web Designer | DISINI |
        2. Buka file yang telah selesai di download (.deb) dengan mengklik 2x
        3. Akan muncul Package Installer lalu klik Install Package



        1. Selesai. Aplikasi Google Web Designer bisa kamu search untuk menggunakannya

         Demikian tutorial Cara Install Google Web Designer di Linux Mint 17.3, mudah - mudahan bisa membantu kamu untuk melakukan pemasangan aplikasi tersebut bisa lebih mengerti. Nantikan tutorial menarik mengenai pembuatan iklan menarik di Google Web Designer pada artikel selanjutnya.

        Cara install Google Web Designer di Linux Mint 17.3

         Pada kesempatan kali ini saya akan membagikan cara mengubah Profil Publik di LinkedIn menjadi Private. Ketika Profil kamu di set "Publik" maka ketika kamu melakukan pencarian nama di mesin pencarian seperti Google maka akan muncul link nama profil LinkedIn kamu sehingga semua orang yang melakukan pencarian nama kamu akan ditemukan pada mesin pencarian. Disini saya akan membagikan caranya mengubah menjadi "Private" sehingga tidak bisa dicari melalui mesin pencarian sebagai berikut.


        • Buka laman berikut www.linkedin.com/public-profile/settings
        • Jangan lupa login terlebih dahulu jika belum login
        • Lihat bagan Edit Visibility pada bagian kanan laman link di atas
        • Ubah Edit Visibility yang awalnya ON menjadi OFF


        • Kamu juga bisa memilih apa saja yang bisa tampil ketika diakses Publik dengan cara ON terlebih dahulu "Your profil's public visibility" dan kamu bisa ON atau OFF kan beberapa pilihan menu di bawah "Basic" sesuai gambar di atas.

         Bagaimana mudah bukan? Demikian tutorial singkat untuk mengubah Profil Publik di LinkedIn menjadi Private melalui Browser semoga dapat membantu kamu melakukan manajemen akun LinkedIn.


        Mengubah Profil Publik di LinkedIn menjadi Private menggunakan Browser

         


         Color Picker adalah alat pemilihan warna untuk mendapatkan HEX code untuk mempermudah pekerjaan kamu dalam bidang pemrograman terutama pemrograman Web. Pada artikel ini saya akan membagikan Color Picker yang bisa kamu gunakan pada aplikasi Sublime Text 3 bagi kamu yang menggunakannya. Langkah - langkahnya seperti di bawah ini.
        • Buka Sublime Text 3 -> Pilih menu Preferences atau Shift + Ctrl + P ketikan "Package Control" seperti gambar di bawah ini.


        • Pilih Package Control: Install Package -> Ketikan "Color Picker" -> Pilih paling atas "weslly.github.io/ColorPicker" seperti gambar di bawah ini.

        • Tunggu proses install di pojok kiri bawah Sublime Text 3 hingga successfully atau selesai
        • Tutup aplikasi Sublime Text 3 dan buka kembali
        • Pilih menu Tools -> Color Picker atau tekan Shift + Ctrl + C
        • Selesai
         Demikian tutorial mudah menggunakan Color Picker pada aplikasi Sublime Text 3, semoga membantu pemrograman Web kamu jadi lebih mudah tanpa mencari Color Picker di website tertentu.

        ~ Terima Kasih ~

        Color Picker untuk Sublime Text 3, Cara cepat mencari HEX Code


         Pada kesempatan kali ini, saya akan membagikan tutorial cara menambahkan efek musim gugur pada website. Efek musim gugur ini sangat menarik membuat website kita terlihat sangat indah untuk terlihat menarik oleh pengunjung. Silahkan perhatikan tutorial di bawah ini.

        Berikut code sederhana untuk menambahkannya :

        <!DOCTYPE html>
        <html lang="en">

        <meta charset="utf-8">
        <head>

        <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
        <title>New Day After Autumn</title>

        <div id="container">
        <link rel="stylesheet" type="text/css" href="css/autumn.css">
</head>
<body>
</div>

        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
        <script type="text/javascript" src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
 <script type="text/javascript" src="js/autumn.js"></script>
</body>

        </html>

        Download source code lengkapnya pada link di bawah ini.


        Referensi :

        Membuat Efek Musim Gugur pada Website


         Pada kesempatan kali ini, saya akan membagikan tutorial cara menampilkan semua foto dalam folder menggunakan PHP sehingga membentuk sebuah galeri website pribadi. Pastinya saya juga mencantumkan link download untuk source codenya pada akhir artikel. Mari kita simak bersama tutorial berikut.

         Sebagai contoh saya punya sebuah folder gallery yang berisikan foto sebagai berikut.

        Langkah selanjutnya, buatkan file index.php pada luar folder gallery tempat foto tersimpan seperti berikut.



        Code berikut digunakan untuk menampilkan foto atau gambar pada folder gallery di halaman website.
        
<?php
      $all_files = glob("gallery/*.*");
      for ($i=0; $i<count($all_files); $i++)
      {
        $image_name = $all_files[$i];
        $supported_format = array('gif','jpg','jpeg','png');
        $ext = strtolower(pathinfo($image_name, PATHINFO_EXTENSION));
        if (in_array($ext, $supported_format))
        {
            echo    '<a href="'.$image_name.'";
              echo        '<img src="'.$image_name.'";
            echo    '</a>';  
        } else {
        continue;
      }
    }
 ?>

        Referensi :


         Download source code galeri foto atau gambar gratis menggunakan PHP berikut.


        Menampikan semua foto (galeri) dalam folder menggunakan PHP


         Pada kesempatan kali ini saya akan membagikan tutorial cara membuat form kontak dan kirim email menggunakan PHPMailer. Mungkin ada yang belum tau apa itu PHPMailer ? PHP Mailer merupakan library yang digunakan untuk mengirimkan email menggunakan bahasa pemrograman PHP dari server web.

         Mari kita siapkan alat dan bahan terlebih dahulu :

        • Download Library PHP Mailer terbaru | Disini |
        • Download Xampp terbaru | Disini | untuk membangun web server
        • Download Notepad++ terbaru | Disini | untuk menuliskan kode atau gunakan code editor yang kamu sukai

        Tutorial membuat form kontak dengan html dan css sederhana :


        tampilan form kontak

        Ketikkan code css berikut dan masukan pada <style></style> atau namastyle.css

        
h1 {
    text-align: center;
    color: darkviolet;
 	margin-bottom:-30px;
}
.container {
    width: 100%;
    height: 100%;
    padding: 15px;
}

.row {
    display: flex;
    height: 300px;
    justify-content: center;
    align-items: center;
}

form#form {
    position:relative;
    background-color: antiquewhite;
    padding: 50px;
    margin-top:50px;
}

input#submit {
    background: lightcyan;
    font-size: 14px;
    font-weight: bold;
    color: coral;
}
hr{
    border: 1px solid #CDDC39;
}
img.powered {
    width: 50px;
    height: auto;
    position: absolute;
    top: 69px;
    right: 22px;
}

        Ketikkan code html berikut dan masukkan pada file index.php

        <!DOCTYPE html>
<html lang="en">
  <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Tutorial Membuat Form Kontak dan Kirim Email (PHPMailer)</title>
   <link rel="stylesheet" href="css/style.css"/>
  </head> 
  <body>
 <div class="container">
   <div class="row">
       <form  method="post" action="mail.php" id="form">
   <a href="pongxkagame.blogspot.com"><img class="powered" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjQSbQREFwGbwn7KFnQvKRQO11sFptn69TpjjCFSthcmZyu9VyBp_vBJjf8naivmC5eAk3ySozGW6WehlqreLlm_1i7nG8XcbdvR01EVtaQT6I8heRnkLAfjo9Idat_bEj8jeLeUgXdCg/s391/logo+pongkagame+1941+index.png" alt="pongkagame"></a>    
   <h1>Form Kontak</h1><br><br> 
   <hr>
   <label>Nama</label><br>
   <input type="text" name="nama" id="nama" /> <br><br>  
   <label>Subject</label><br>
   <input type="text" name="subject" id="subject" /> <br><br>   
   <label>Email</label><br>
   <input type="email" name="email" id="email"/> <br><br>  
   <label>Pesan</label><br>
   <textarea name="message" id="message" rows="4" cols="50"></textarea><br><br>
   <input type="submit" name="submit" id="submit" value="Submit">
   <hr>
      </form>
 </div>
   </div>
  </body>
</html>

        Ketikkan kode php berikut dan masukkan pada file mail.php

        <?php 
// POWERED BY PONGKAGAME.BLOGSPOT.COM//
use PHPMailer\PHPMailer\PHPMailer;

if(isset($_POST['nama']) && isset($_POST['email']))
{
  $name = $_POST['name'];
  $email = $_POST['email'];
  $subject = $_POST['subject'];
  $message = $_POST['message'];

  $hostAdmin = "www.hostAdmin.com";
  $emailAdmin = "emailAdmin@mail.com";
  $passAdmin = "passAdmin123456";
  $nameAdmin = "nameAdmin";

  require 'PHPMailer/PHPMailer.php';
  require 'PHPMailer/SMTP.php';
  require 'PHPMailer/Exception.php';

  //Create a new PHPMailer instance
  $mail = new PHPMailer(true);
  //Enable SMTP debugging
  // 0 = off (for production use)
  // 1 = client messages
  // 2 = client and server messages
  $mail->SMTPDebug = 2;
  //Tell PHPMailer to use SMTP
  $mail->isSMTP();
  //Set the hostname of the mail server
  $mail->Host = $hostAdmin;
  $mail->SMTPAuth = true;
  //Username to use for SMTP authentication
  $mail->Username = $emailAdmin;
  //Password to use for SMTP authentication
  $mail->Password = $passAdmin;
  //Set the encryption system to use - ssl (deprecated) or tls
  $mail->SMTPSecure = 'ssl';
  $mail->SMTPOptions = array(
      'ssl' => array(
          'verify_peer' => false,
          'verify_peer_name' => false,
          'allow_self_signed' => true
      )
  );
  //Set the SMTP port number - 587 for authenticated TLS
  $mail->Port = 465;//->ssl(465);

  //Email Setting
  $mail->setFrom($email, $name);
  $mail->addAddress($emailAdmin, $nameAdmin);


     // Content
     $mail->isHTML(true);// Set email format to HTML
     $mail->Subject = $subject;

     $contentMessage = $message;

  $mail->msgHTML($contentMessage);
  
  //proses kirim email
  if (!$mail->send()) {
   $status = "error"; 
   $mail->Send();
  } else {
      $status = "success";
  }

}
?>

        Struktur penempatan file secara sederhana

        struktur sederhana

        Download Source Code di bawah ini :

        Membuat form kontak dan kirim email menggunakan PHPMailer




         CSS atau Cascading Style Sheet merupakan aturan untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemrograman (wikipedia.org). Dalam arti singkat CSS yang memberikan tampilan website kita tampak lebih bergaya. Disini saya akan memberikan tutorial cara rotasi gambar jika kamu ingin menampilkan gambar di website kamu dengan kemiringan atau sudut pandang berbeda. Caranya sangat mudah cukup menggunakan metode berikut :

        Contoh :

        Gambar Awal 

        www.w3schools.com
        Untuk merotasi gambar diatas gunakan metode :

        transform : rotate(10deg);

        Note :
        • Warna Merah : ukuran rotasi yang kamu perlukan (lingkaran = 360)
        Hasil Rotasi (10deg)



        Untuk rendernya pada browser tertentu tambahkan :

        -webkit-transform: rotate(10deg);
        -moz-transform: rotate(10deg);
        transform : rotate (10deg);


         Demikian tutorial yang saya bagikan, mudah-mudahan bisa memudahkan kamu mencari solusi untuk mempercantik laman website kamu melalui rotasi gambar-gambar. Metode ini tidak disarankan bagi kamu yang mencari rating PageSpeed. Apa itu ? Nantikan postingan selanjutnya pada blog ini.

        Cara rotasi gambar dengan CSS




         Cara membuat spasi antara dua kata atau lebih dalam php sangatlah mudah dengan menggunakan code ini kamu bisa mengaplikasikannya dalam pemrograman menggunakan bahasa pemrograman PHP. Terkadang untuk memudahkan dan menyederhanakan coding kita perlu memahami sistematika coding yang kita buat tentunya agar kamu tidak perlu repot mengerjakannya 2 kali. Disini saya akan berbagi code mempermudah pengerjaan antar kata dengan memberi spasi menggunakan bahasa pemrograman PHP. Mari simak code pengerjaan dibawah ini :



        $array = ['value1', 'value2', 'value3'];

        $space = preg_replace('/([a-z])([A-Z])/s','$1 $2', $array); <- (gunakan code berikut)

        echo $space;


         Caranya sangat mudah silahkan kamu aplikasikan pada code aplikasi kamu dan kembangkan lagi mungkin kamu akan menemukkan cara yang lebih mudah.


        Referensi : https://stackoverflow.com/questions/4701143/how-do-i-add-white-space-between-word

        Cara Membuat Spasi Antara Dua Kata atau Lebih dengan PHP


         Pada kesempatan ini, saya akan membagikan aplikasi web youtube downloader yang bisa digunakan untuk mendownload video youtube dan website video lainya [ cek list web videonya]. Langsung saja untuk mendownloadnya silahkan melalui link berikut ini.
        screenshot aplikasinya



         Bahan-bahan yang digunakan :

        Download pada link di bawah ini.

        Source code aplikasi web youtube downloader [ PHP ]

         Pada kesempatan ini, saya akan membagikan kamu source code dari melakukan export tabel atau mendownload tabel pada HTML dengan menggunakan library Tabulator. Tabulator sangat mudah digunakan untuk melalukan export tabel ke format : CSV, JSON, EXCEL, dan PDF. Berdasarkan dari tabulator.info, "Tabulator memungkinkan Anda membuat tabel interaktif dalam hitungan detik dari Tabel HTML apa saja, JavaScript Array, sumber data AJAX atau data berformat JSON." Dengan slogan "Complex Tables, Simple Code". Menurut saya pribadi ini adalah pilihan yang tepat karena cukup dengan library Tabulator ini kamu sudah bisa melakukan export tabel ke berbagai format yang tersedia.



         Berikut adalah screenshot project export sederhana yang menggunakan Tabulator yang telah dibuat.
        tidak menggunakan database

        Projectnya dapat kamu download pada link di bawah ini :


        Source Code : Export tabel dengan library Tabulator

        Langganan: Postingan (Atom)