Cara menggunakan php w3schools

PHP (Hypertext Preprocessor) adalah bahasa skrip tujuan umum open source yang banyak digunakan yang sangat cocok untuk pengembangan web dan dapat disematkan ke dalam HTML

The PHP code is enclosed in special start and end processing instructions that allow you to jump into and out of “PHP mode.”

Apa yang membedakan PHP dari JavaScript sisi klien adalah bahwa kode dijalankan di server, menghasilkan HTML yang kemudian dikirim ke klien. Hal terbaik dalam menggunakan PHP adalah sangat sederhana untuk pendatang baru, tetapi menawarkan banyak fitur canggih untuk programmer profesional

Jangan takut untuk membaca daftar panjang fitur PHP. Anda dapat terjun, dalam waktu singkat, dan mulai menulis skrip sederhana dalam beberapa jam

Meskipun pengembangan PHP difokuskan pada skrip sisi server, Anda dapat melakukan lebih banyak hal dengannya

Beri tahu kami beberapa fitur PHP

Ini adalah bahasa skrip yang paling populer dan sering digunakan di seluruh dunia, alasan utama popularitasnya adalah;

• Sederhana
• Lebih cepat
• Ditafsirkan
• Sumber Terbuka (gunakan gratis, unduh gratis)
• Hal - hal sensitif
• Kesederhanaan
• Efisiensi
• Platform Independent (jalankan di Linux, Unix, Mac OS X, Windows. )
• Keamanan
• Fleksibilitas
• Keakraban
• Pelaporan Kesalahan
• Bahasa yang Diketik Secara Longgar
• Pemantauan Akses Real-Time

PHP sangat sederhana dan mudah digunakan, dibandingkan dengan bahasa script lainnya. Karena Ini adalah bahasa yang ditafsirkan, i. e. tidak perlu kompilasi

W3SCOOL adalah situs untuk belajar pemrograman, sangat cocok untuk anda yang ingin belajar coding secara otodidak. Di W3SCHOOL Anda bisa belajar HTML, CSS, Javascript dan PHP, itu semua adalah bahasa web yang sangat cocok bahkan sangat bagus untuk blogging. Artikel ini ditulis berdasarkan pengalaman nyata kami. Dan untuk kalian ketahui situs editblogtema sangat dipengaruhi oleh metode belajar otodidak

Tentunya hal ini saya tulis berdasarkan pengalaman saya dalam mempelajari teknologi web dan coding secara otodidak dan menggunakan blogging sebagai bahan praktek yaitu dengan cara tweak halaman editor blogger dan menerapkan pelajaran dari situs W3SCHOOL tadi. Ubah kode seperti yang disarankan oleh situs. Hasilnya adalah tidak butuh waktu lama untuk menjadi lebih mahir dari hari ke hari

Oke saya luruskan. Semua artikel editblogtema ditulis, kebanyakan adalah tutorial dan sebagian besar tutorial kami kembangkan dari hasil belajar coding di W3SHOOL lho. 99% artikel asli kami tidak menjiplak artikel apapun. Sumbernya memang belajar dari sana, tetapi kami telah mengembangkannya. Wah, makna belajar itu sangat besar bukan?

Dan yang terpenting, semua tutorial yang berhubungan dengan HTML, XML, CSS, Javascript dan PHP bisa diterapkan di blogger 100%, asalkan kita mau mempelajarinya satu per satu, dan tidak sepotong demi sepotong.

Tidak hanya sebatas belajar coding untuk teknologi WEB seperti. HTML. XML, CSS, PHP dan Javascript, kita juga bisa belajar python, bootstrap, SQL dan masih banyak lagi.Lalu apa manfaat langsung belajar W3SCHOOL untuk konten editblogtema?

1. BELAJAR MEMBUAT MENU NAVIGASI ATAU TEMPLATE NAVBAR BLOGGER

Kalau teliti editblogtema, ada banyak tutorial cara membuat menu navigasi blog, kenapa? . Juga mampu memanjakan pengunjung dengan kemudahan navigasi.  

Karena blogger berbasis HTML daripada Wordpress yang berbasis PHP, masalah menjadi lebih mudah bagi kita. Awalnya, dia tidak terlalu mengerti apa itu HTML dan bagaimana cara kerjanya. Untungnya W3SCHOOL menyediakan fitur 'HOW TO' yang sangat berguna bagi pemula seperti saya.  

Dan saat itu saya sangat penasaran bagaimana cara membuat navigasi menu yang memiliki fitur dropdown plus kotak pencarian dengan icon kaca pembesar di ujung bar sebelah kanan? . Jadi saya belajar dengan contoh dengan menulis 'navigasi responsif' di kolom CARA mencari. Hasilnya ada di sana. Untungnya saya menemukan tutorial lengkap. Perhatikan gambar secara detail di bawah ini

Buka CARA untuk mengetahui cara membuat menu responsif plus navigasi drop down

Dengan membuka menu HOW TO kita dapat menemukan contoh teknologi pembuatan widget dan elemen HTML, termasuk pilihan atau contoh pembuatan menu navigasi

Kemudian Pilih Navbar Responsif

Namun jika kita ingin mempelajari source codenya maka harus klik 'Try it Yourself'

Lihat kode sumber

Responsif juga berarti navigasi menu di atas cocok untuk semua ukuran layar, baik itu PC desktop, PC Laptop, tablet Android dan iPad, ponsel Android dan iPhone. Pada layar desktop, menu navigasi akan tampil mendatar, sedangkan pada layar kecil, tombol akan tampil sebagai tombol menu hamburger. Keren bukan?

Jika Anda ingin menerapkannya, letakkan kode gaya CSS berikut tepat di atas kode.

tubuh {margin. 0; keluarga font. Arial}
topnav {
meluap. tersembunyi;
warna latar belakang. #333;
}
topnav a {
mengambang. kiri;
menampilkan. blok;
warna. #f2f2f2;
perataan teks. tengah;
lapisan. 14px kali 16px;
dekorasi teks. tidak ada;
ukuran huruf. 17px;
}
aktif {
warna latar belakang. #ff0000;
warna. putih;
}
topnav. ikon {
menampilkan. tidak ada;
}
tarik-turun {
mengambang. kiri;
meluap. tersembunyi;
}
tarik-turun. dropbtn {
ukuran huruf. 17px;
berbatasan. tidak ada;
garis besar. tidak ada;
warna. putih;
lapisan. 14px kali 16px;
warna latar belakang. mewarisi;
font-family. mewarisi;
margin. 0;
}
dropdown-konten {
menampilkan. tidak ada;
posisi. mutlak;
warna latar belakang. #f9f9f9;
min-lebar. 160px;
bayangan kotak. 0px 8px 16px 0px rgba(0,0,0,0. 2);
z-index. 1;
}
dropdown-konten a {
mengambang. tidak ada;
warna. hitam;
lapisan. 12px 16px;
dekorasi teks. tidak ada;
menampilkan. blok;
perataan teks. kiri;
}
topnav a. melayang,. tarik-turun. melayang. dropbtn {
warna latar belakang. #555;
warna. putih;
}
dropdown-konten a. arahkan {
warna latar belakang. #ddd;
warna. hitam;
}
tarik-turun. melayang. dropdown-konten {
menampilkan. blok;
}
Layar @media dan (max-width. 600px) {
topnav a. bukan (. anak pertama),. tarik-turun. dropbtn {
menampilkan. tidak ada;
}
topnav a. ikon {
mengambang. Baik;
menampilkan. blok;
}
}
Layar @media dan (max-width. 600px) {
topnav. responsif {posisi. relatif;}
topnav. responsif. ikon {
posisi. mutlak;
Baik. 0;
atas. 0;
}
topnav. responsif {
mengambang. tidak ada;
menampilkan. blok;
perataan teks. kiri;
}
topnav. responsif. tarik-turun {mengambang. tidak ada;}
topnav. responsif. dropdown-konten {position. relatif;}
topnav. responsif. tarik-turun. dropbtn {
menampilkan. blok;
lebar. 100%;
perataan teks. kiri;
}
}

Kode berikut di letakan sesudah kode tag atau di bawah

Beranda
Berita
Kontak

Lainnya

Tautan 1
Tautan 2
Tautan 3

Tentang
☰

Javascript berikut berada sebelum atau di atas kode

fungsi myFunction() {
var x = dokumen. getElementById("myTopnav");
jika (x. namakelas === "topnav") {
x. className += "responsif";
} kalau tidak {
x. namakelas = "topnav";
}
}

Jangan khawatir, kode di atas bisa diterapkan pada hampir semua template blogger bawaan yang ingin Anda modifikasi, terutama jika Anda ingin menambahkan navigasi menu, kecuali varian template 'Dynamic View' yang tidak sesuai dengan browser modern.  

Perlu juga dicatat bahwa template lama seperti sederhana, PT. Sangat keren (awesome), jendela dan travel yang digunakan harus direstrukturisasi terlebih dahulu dengan menggunakannya agar responsif. Sedangkan untuk template varian terbaru seperti contempo, emporio, soho dan Notable bisa langsung diaplikasikan. Lihat hasilnya

Lagi

NAVIGASI HALAMAN BLOG DENGAN DROPDOWN

Jika dibuka melalui halaman yang lebih kecil, itu akan menjadi responsif

Klik "lebih" untuk menampilkan menu tarik-turunnya

2. MEMBUAT TOMBOL PENCARIAN

Saya baru mulai ngeblog di tahun 2018 melalui editblogtema, karena bayangkan saya masih SMA saat itu. jadi ikutin aja baca template viomagz pak sugeng ini template sejuta umat, selain dari gaya navigasi menu apalagi fitur istimewanya? . begitu tombol kaca pembesar di klik maka akan muncul menu pencarian yang memenuhi layar, mengikuti style transparant dan animasi halus, saya cari di CARANYA dan hasilnya saya temukan

Anda dapat menerapkan kode langsung ke blogger sebagai berikut

Tempatkan CSS di atas kode

tubuh {
font-family. Arial;
}
* {
ukuran kotak. kotak perbatasan;
}
openBtn {
latar belakang. #f1f1f1;
berbatasan. tidak ada;
lapisan. 10px 15px;
ukuran huruf. 20px;
kursor. petunjuk;
}
openBtn. arahkan {
latar belakang. #bbb;
}
hamparan {
tinggi. 100%;
lebar. 100%;
menampilkan. tidak ada;
posisi. tetap;
z-index. 1;
atas. 0;
kiri. 0;
warna latar belakang. rgb(0,0,0);
warna latar belakang. rgba(0,0,0,0. 9);
}
konten overlay {
posisi. relatif;
atas. 46%;
lebar. 80%;
perataan teks. tengah;
margin-atas. 30px;
margin. mobil;
}
hamparan. closebtn {
posisi. mutlak;
atas. 20px;
Kanan. 45px;
ukuran huruf. 60px;
kursor. petunjuk;
warna. putih;
}
hamparan. closebtn. arahkan {
warna. #ccc;
}
masukan hamparan[type=teks] {
lapisan. 15px;
ukuran huruf. 17px;
berbatasan. tidak ada;
mengambang. kiri;
lebar. 80%;
Latar Belakang. putih;
}
masukan hamparan[type=text]. arahkan {
latar belakang. #f1f1f1;
}
tombol hamparan {
mengambang. kiri;
lebar. 20%;
lapisan. 15px;
Latar Belakang. #ddd;
ukuran huruf. 17px;
berbatasan. tidak ada;
kursor. petunjuk;
}
hamparan tombol. arahkan {
latar belakang. #bbb;
}

Letakan kode HTML berikut di bawah kode atau

×

Letakkan kode Javascript berikut di atas kode

fungsi openSearch() {
dokumen. getElementById("MyOverlay"). gaya. tampilan = "blok";
}
fungsi closeSearch() {
dokumen. getElementById("MyOverlay"). gaya. tampilan = "tidak ada";
}

3. MIMPI MEMBUAT MENU NAVIGASI RESPONSIF PLUS MENU PENCARIAN SEPERTI VIOMAGZ. >

Cara ini hanya membuat menu navigasinya mirip, tidak sama. Cara membuat menu navigasi viomagz jauh berbeda dengan cara yang saya sajikan walaupun hasilnya mirip. Lagi-lagi bersumber dari situs pembelajaran online teknologi coding W3SCHOOL

Apa yang saya lakukan pada kode sumber di atas adalah

1. Karena menu di atas tidak diperbaiki, saya menambahkan dua hal pada kode CSS. posisi. memperbaiki dan menambahkan z-index. 999;
2. Kemudian saya menggabungkan menu navigasi dengan tombol pencarian untuk mengatur posisi tombol 'position' dan z-idex
3. Menambahkan kode pencarian PHP
4. Dan hasilnya? . DI SINI. (bagi yang belum fix) kami terapkan pada template bawaan blogger SOHO.
Dan (untuk yang fixed) kita apply ke template bawaan blogger emporio

Fitur menu navigasi adalah:

• Tetap. Artinya menu navigasi tetap berada di atas header halaman blog meskipun halaman di-scroll ke atas atau ke bawah. Manfaatnya sangat baik bagi pengunjung yang akan terbantu karena tidak kehilangan navigasi.  
Ini diatur melalui pengaturan CSS. posisi. tetap;
• Memiliki drop-down. Artinya ada menu yang bila diklik akan memunculkan rangkaian sub menu yang turun. Teknik ini juga sangat membantu dalam menghemat lebar halaman blog sehingga menu navigasi tidak terlihat dan mengurangi tampilan halaman blog
• Responsif. Ini berarti bahwa pada halaman yang lebar navbar tampak memanjang secara horizontal. Namun ketika ditampilkan di layar yang lebih kecil, navbar akan menampilkan Judul Blog dan menu atau ikon Hamburger yang jika diklik akan memunculkan semua menu menu blogger. Ini dilakukan melalui pengaturan lebar layar @media dan Jquery
• Menu atau tombol pencarian di ujung kanan navbar

Tentunya masih banyak situs lain yang setara atau lebih bagus untuk melatih skill coding bahkan programming, intinya sangat memungkinkan bagi anda untuk bisa memanfaatkan dunia internet untuk belajar. Dan lihatlah hasil yang akan membawa kepuasan yang tidak bisa di nilai dengan hanya sepeser pun menjadi publisher adsense. (tertawa terbahak-bahak)