Bisa cek timeline nya juga kawan kawan, biar bisa maju mundur sesukanya 😀 00:00:00 Intro 00:00:58 Buka Visual Studio Code 00:02:18 Menambahkan Link CSS dan Javascript dari Bootstrap 5 00:09:36 Menambahkan Menu di HTML 00:13:42 Menambahkan Jumbotron di HTML 00:22:04 Menambahkan Icon dari Fontawesome 00:23:06 Menambahkan Bagian Informasi Layanan 00:39:23 Menambahkan Bagian Informasi Portofolio 00:54:41 Menambahkan Bagian Informasi Tentang 01:01:19 Menambahkan Bagian Informasi Staff 01:18:45 Menambahkan Bagian Client 01:24:01 Menambahkan Bagian Kontak Kami
Kak pada detik2 terakhir di video ini (1:34:16)saat klik di bagian navbar (layanan-porto-staff-kontak) kenapa tidak bisa pas dibagian nama dari (layanan, porto,staff,kontak) tp lgsg kearah isi dari itu? Bagaimana caranya ya Kak agar saat klik di bagian navbar (layanan,porto,staff,kontak) bisa pas di page yg namanya sesuai dg navbar bukan isi dari pagenya? Terima kasih
alhamdulillah terima kasih bang berbagi ilmu nya saya jadi mau belajar dengn penjelsan menarik seperti ini, terima ksih selalu semoga diberi sehat wal afiat dan terus berkarya
Keren tutorial nya. Btw, semoga ada waktunya buat jelasin secara tuntas di video berikutnya perihal klu klik sosial media bisa kesambung ke link tsb, dll nya. Btw, terimakasih dan semangat trus agar video ini benar2 menjadi tutorial yg lengkap secara utuh.❤
TERIMA KASIH KAKAK , VIDEO INI SANGAT MEMBANTU SAYA DALAM MENGERJAKAN TUGAS UAS . IBU SAYA PASTI BANGGA KEPADA CHANNEL INI DAN PASTI DIA AKAN MENSUBCRIBE DAN MENSHARE CHANNEL INI KEDALAM GRUP IBU IBU PKK DI DESA SAYA !!!!
kak di 19:46 itu kok pas kuketik no-repeat center center tulisannya jadi warna merah ya? coba kulanjutin sampe bawah trus save tapi gambarnya tidak muncul
Pak ingin bertanya utk menambahkan fontawesome itu linknya sudah berubah...jadi tidak bisa copas link seperti di video itu menambahkannya seperti apa ya pak? terima kasih
Pak, mohon bantuan lagi. Saya sdh buat menu input berita. Tlg gimana buat script php ntuk porto folio, 6 gbr itu adlh gambar terbaru yg tlh kita input 🙏🙏
koq di css bisa manggil .banner padahal di html nya belum dibuat , yang ada cuma container-fluid banner, tapi saya coba gak muncul banner nya ? mohon bantuannya jelasin detailnya dong ka
Sudah dibuat untuk file style.css nya bang? Kalau sudah pastikan style.css diikutkan dalam html yang ada. Dan jangan lupa dibuat untuk class .banner di file style.css nya bang..
kak, kalau saya ada kasus gini disaat penempatan 3 menu di layanan punya saya menurun kebawah, gimana caranya supaya bisa menyamping seperti yg ada di video ya?
sudah nonton dari awal sampe akhir, keren bang. cuman saya kok pas klik navbar, kok nggak scrolling bagus gitu ya, langsung lompat. apa ada js saya yg kurang?
@@dirumahrafif udah kok bang. cuman ini saya ikutin tutor abang tp pakainya Bootstrap 4. apa file cdn b4 sama b5 ada perbedaan ya? soalnya di console juga no error no issue juga
Assalamualaikum gan, artikelnya sangat membantu dan bagius sekali namun ada yg ingin sy tanyakan bagaimana cara menulis postingan artikel baru di website yg dibuat pakai boostrap itu, apakah ada semacam halaman admin/dashboard admin seperti di blogspot dan wordpress atau menulisnya tetap via editor juga ya gan? Terimakasih salalm kenal, mohon pencerahaanya, terima kasih Programming Di Rumahrafif
Pak, agar pas kita klik layanan, portofolio kan itu langsung ke scroll otomatis, agar pas kescroll otomatis tapi tulisan layanan, portoflio tidak terlalu kepotong gimana yah, jdi pas kita klik layanan, tulisan layanan yg di bawa pas sehingga terlihat dengan jelas
Bang gw iconnya d sosmed d stafnya malah nurun, gk mendatar susunannya, klo d masukin ke dlm div class trus d ksh display: flex; sih bisa, tpi malah gk bisa ke tengah, udh coba tambahin align-items : center; tpi ttp gk bisa, itu gmn ya bang? Moga d jawab
pak, izin bertanya. untuk bagian "kontak" kan saya udah tampil. tapi, apakah setelah diisi "nama, email, phone, dan text area" itu tampil di wa saya? soalnya saya cantumkan link wa saya di bagian "kirim pesan".
bang cara biar kodingan nya tersusun rapi gmna ya cara nya ? ane klo copas kodingan ketengah terus klo di sift tab jadi rata sama yg kodingan di atas ga tersusun
permisi bang mau tanya, di bagian baner saya kok background image nya hilang yaa bang? padahal ngga ada style background-image:none; tapi pas saya inspek kok tiba tiba ada ya bang, mohon bantuanya bang
@@dirumahrafif terimakasih, tutorial ini mudah dipahami. Sejauh ini dapat diikuti. Ada yg kurang pak, mohon bantuan. Pada menu portofolio, saya ingin menunya berupa berita, hot news. Dah saya rubah jadi php, gimana caranya mbuat menu login admin, sehingga admin dapat mengirim gambar untuk jadi berita. 🙏🙏
yang sudah ada fitur admin, edit, tambah, delete data ada di playlistini Bang >> th-cam.com/play/PLzt0WdHR1Z3mIO8sTcb_obvC5JmL_b-Fg.html sudah lumayan lengkap kelihatannya
@@dirumahrafif tolong bikin video tutorial nya dong bang jadi dari kontak form langsung kekirim data nya ke wa misalnya klien isi kontak form nya nama no telp terus email dan pesan nah nanti data yang dibuat klien nya itu masuk ke wa kita
Bang klo pas kita pencet pilihan navbar trus pas udh ke bagian dan judulnya gk keliatan lalu cara agar supaya judulnya sekalian ikut keliatan bagaimana? Edit: contoh kita tekan layanan tapi judulnya gk keliatan saat scroll otomatis jadinya cuman isi(infonya) yg keliatan
izin tanya bosku. cara menulis artikel/postingan baru di website yg dibuat pakai boostrap itu ada semacam halaman admin/dashboard admin seperti di wordpress atau menulisnya tetap via editor juga ya min? mohon infonya. terima kasih
Bisa cek timeline nya juga kawan kawan, biar bisa maju mundur sesukanya 😀
00:00:00 Intro
00:00:58 Buka Visual Studio Code
00:02:18 Menambahkan Link CSS dan Javascript dari Bootstrap 5
00:09:36 Menambahkan Menu di HTML
00:13:42 Menambahkan Jumbotron di HTML
00:22:04 Menambahkan Icon dari Fontawesome
00:23:06 Menambahkan Bagian Informasi Layanan
00:39:23 Menambahkan Bagian Informasi Portofolio
00:54:41 Menambahkan Bagian Informasi Tentang
01:01:19 Menambahkan Bagian Informasi Staff
01:18:45 Menambahkan Bagian Client
01:24:01 Menambahkan Bagian Kontak Kami
Bang ini nanti cara upload ke hosting nya gimana?
Kak pada detik2 terakhir di video ini (1:34:16)saat klik di bagian navbar (layanan-porto-staff-kontak) kenapa tidak bisa pas dibagian nama dari (layanan, porto,staff,kontak) tp lgsg kearah isi dari itu? Bagaimana caranya ya Kak agar saat klik di bagian navbar (layanan,porto,staff,kontak) bisa pas di page yg namanya sesuai dg navbar bukan isi dari pagenya? Terima kasih
Icon pada fontawesome nya itu versi berapa ya ?
link yang digunakan ga sesuai dengan hasil di desktop video thanks
Manruaab sekali pak, saya mengikuti hingga selesai..Sangat jelas dan mudah dimengerti...
Sekali lagi maju terus pak...Salam sukses...
Alhamdulillah, terima kasih banyak ya kak.. smoga rezekinya melimpah atas ilmunya. Saya ikutin sampai selesai. Jelas, mudah dipahami.
Sangat jelas dan mudah dipahami. Terima kasih 🤗🤗
Suka banget sma tutorial nya Rumahrafif, lengkap, mudah di ikuti step by step nya. Bermanfaat. Makasih ilmu nya pak 👍
Mantap tutorial nya bang... Ditunggu tutorial selanjutnya
alhamdulillah terima kasih bang berbagi ilmu nya saya jadi mau belajar dengn penjelsan menarik seperti ini, terima ksih selalu semoga diberi sehat wal afiat dan terus berkarya
Alhamdulillah, semoga bermanfaat Bang
makasih ya bang sudah membagi ilmu yang sangat bermanfaat bagi kita semua, salam budi luhur!
Jelas dan mudah dipraktekan, trima kasih tutornya, semangat bang dan sukses selalu
thanks for sharing ya bang
Terima Kasih Bang, Mulai Tertarik Sma Bikin² Web Bgini...Jdi Semangat Pengen Nyoba² 🙏
yuk lanjut Bang..
Terima kasih tutorialnya kak, sangat membantu kami dalam mengerjakan tugas..
sama sama..semoga bermanfaat
Ok Mksh gan tutorialnya semoga bermanfaat , Sy subscribe ya biar tambah semangat buat tutorial berikut nya .
Semoga bermanfaat
terimakasih kak,, pengajaran online step by step.sukses terus om, tetap bekarya dan berbagi ilmu
terimakasih pak, ilmunya sangat bermanfaat dan membantu
mantap penjelasan nya sangat jelas gan!
makasih Bang..semoga bermanfaat
terima kasih bagus banget
Makasih banyak ka tutorial nya
Membantu saya sekali untuk menyelesaikan tugas
Love yg banyak deh ❤❤❤
Semoga membantu ya
TERIMAKSIH BANYAK ABANGKU , TETAP SEMNGAT BANG BUAT KONTENNYA 🔥🔥🔥🔥🔥🔥
Siap Bang
Trimaksih banyk pak
TERIMA KASIH TUTORIALNYA PAK
Terimakasih tutorial nya bang
sama sama Bang..semoga bermanfaat
mau nangiss, bisaaa, makasih banyak min, bermanfaat bangett, bismillah aku lancar ngerjain uts, sehat terus yang buat video ini
semiga bermanfaat ya Kak
sepertinya lebih cocok kala u judulnya landing page lengkap dengan bootstrap 5 deh... upspss !! btw mantep banget ini
Keren tutorial nya. Btw, semoga ada waktunya buat jelasin secara tuntas di video berikutnya perihal klu klik sosial media bisa kesambung ke link tsb, dll nya. Btw, terimakasih dan semangat trus agar video ini benar2 menjadi tutorial yg lengkap secara utuh.❤
Terima kasih om
Lope you bg😂😂
TERIMA KASIH KAKAK , VIDEO INI SANGAT MEMBANTU SAYA DALAM MENGERJAKAN TUGAS UAS . IBU SAYA PASTI BANGGA KEPADA CHANNEL INI DAN PASTI DIA AKAN MENSUBCRIBE DAN MENSHARE CHANNEL INI KEDALAM GRUP IBU IBU PKK DI DESA SAYA !!!!
hehe...bisa gitu ya...
Nuwun tutorialnya
Sama sama..semoga bermanfaat Pak.. 🤗
Makasih bang
sama-sama bang...semoga ada manfaatnya 🙏
Next bang
semangat bang:)
kak di 19:46 itu kok pas kuketik no-repeat center center tulisannya jadi warna merah ya? coba kulanjutin sampe bawah trus save tapi gambarnya tidak muncul
bang tutor lgi dong utk melanjutkan yg kontak kami itu, supaya terhubung ke server kita itu gmna ? 🙏🙏
26:09 tulisan layanan lorem ipsum dolor kok bisa di slide bawaah? bagaimana cara nya kak?
love
Pak pake extension apa ya bisa saat save auto turun tidak melebihi jendela aktifnya
kak maaf mau nanya, untuk background-color di icon kok ga muncul ya? mohon dibantu kak terimakasih :)
menit 19:12 kalau mau masukin gambar biasa gimana ya mas?
terima kasih bagus sekali.tolong bagaimana website bisa terhubung ke facebook dan twitter
itu menambahkan cdn picker di pilihan mananya mas? ko yg saya akses selalu harus pro accoutn mulu ya???
Pak ingin bertanya utk menambahkan fontawesome itu linknya sudah berubah...jadi tidak bisa copas link seperti di video itu menambahkannya seperti apa ya pak? terima kasih
kalau mau membuat halaman login dan cara mengkoneksi nya dari halaman web yang sudah kita bikin , bagaimana ka ?
mau tau juga,saya belum nemu sampe skrang caranya
nah nitip, ada tugas juga kayak gini
Injin nanya kak kok saya teks layanannya ko ad underlinenya? Mau di kasi Teck decoration none pun g hilang jugak? Mohon bantuanny 🙏
Pak srius nnya itu link awesome yg d copy yg mna yaa helf
makasih ijin download videonya?
Pak, mohon bantuan lagi. Saya sdh buat menu input berita. Tlg gimana buat script php ntuk porto folio, 6 gbr itu adlh gambar terbaru yg tlh kita input 🙏🙏
Kak udah klik link buat font awesome tapi kok yang keluar beda halaman ya
koq di css bisa manggil .banner padahal di html nya belum dibuat , yang ada cuma container-fluid banner, tapi saya coba gak muncul banner nya ? mohon bantuannya jelasin detailnya dong ka
Sudah dibuat untuk file style.css nya bang?
Kalau sudah pastikan style.css diikutkan dalam html yang ada.
Dan jangan lupa dibuat untuk class .banner di file style.css nya bang..
kak, kalau saya ada kasus gini disaat penempatan 3 menu di layanan punya saya menurun kebawah, gimana caranya supaya bisa menyamping seperti yg ada di video ya?
gannnn saya mentok di bagian center antara lingkaran dan icon, tidak berubah ketengah
Min, untuk contact formnya, disambungin ke email gimana?
dan untuk bannernya apakah bisa dijadikan slideshow otomatis
kak untuk font nya engga bisa di akses harus beralih ke pro
bang kalau nyari banner hotel tu dimana ya ? rekomendasi kan dong tempat download banner hotel nya bang
bang cara nambahin logo di samping kiri text rumahafif gmna?
sudah nonton dari awal sampe akhir, keren bang.
cuman saya kok pas klik navbar, kok nggak scrolling bagus gitu ya, langsung lompat. apa ada js saya yg kurang?
js dari bootstrap sdh diikutkan jg Bang?
@@dirumahrafif udah kok bang. cuman ini saya ikutin tutor abang tp pakainya Bootstrap 4. apa file cdn b4 sama b5 ada perbedaan ya? soalnya di console juga no error no issue juga
iya ada beda Bang antara bootstrap 4 sama bootstrap 5, setahu saya..
Bang knapa kok gambar saya gak bisa muncul ya padahal udah benar semua code nya😢
bang izin bertanya,
kenapa ya background saya tidak bisa menyeluruh dilayar? text cek layanan dibawah gambar banner
Bos izin pake templetnya buat tugas🙏
silakan Bang, semoga bermanfaat
Siap bos terimakasih 🙏
Assalamualaikum gan, artikelnya sangat membantu dan bagius sekali namun ada yg ingin sy tanyakan bagaimana cara menulis postingan artikel baru di website yg dibuat pakai boostrap itu, apakah ada semacam halaman admin/dashboard admin seperti di blogspot dan wordpress atau menulisnya tetap via editor juga ya gan? Terimakasih salalm kenal, mohon pencerahaanya, terima kasih
Programming Di Rumahrafif
diketik manual di code nya om
Pak, agar pas kita klik layanan, portofolio kan itu langsung ke scroll otomatis, agar pas kescroll otomatis tapi tulisan layanan, portoflio tidak terlalu kepotong gimana yah, jdi pas kita klik layanan, tulisan layanan yg di bawa pas sehingga terlihat dengan jelas
lokasi div nya agak dinaikkan Bang..atau di bagian atas dikasih padding...
ijin nyontek source code ...master, terimaksih.
Apakah responsif pada mode Mobile?
Bang ini sama aja kan yah yag kaya video css kmaren, dan video ini bisa d lanjutkan ke phpnya gak?
Bang klo bennernya pke gambar sndiri gmna
Bang gw iconnya d sosmed d stafnya malah nurun, gk mendatar susunannya, klo d masukin ke dlm div class trus d ksh display: flex; sih bisa, tpi malah gk bisa ke tengah, udh coba tambahin align-items : center; tpi ttp gk bisa, itu gmn ya bang? Moga d jawab
om gambarnya selain di tutorial ada lagi gak om buat referensi pembuatan website
cari aj di painterest bnyk
untuk font awesomenya tidak bisa lagi ya bang ? dah nyoba nyari codenya gak tersedia lagi
atau coba pake ini Kak cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css
om gmn caranya agar gambar FB nya pas di klik lngsng masuk ke FB kita ??
Maaf cara menggunajan fontawesomenya gimana ya..punya saya beda..
bisa menggunakan link cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.2.1/css/fontawesome.min.css Kak
Kak saya pas di bagian nambahin Index.html kok unable to write file ya
Maksudnya php yg ada fi playlist abang
pak, izin bertanya. untuk bagian "kontak" kan saya udah tampil. tapi, apakah setelah diisi "nama, email, phone, dan text area" itu tampil di wa saya? soalnya saya cantumkan link wa saya di bagian "kirim pesan".
Belum Bang, perlu tambah proses untuk kirim WA Bang....
Cara buat link gambar banner itu dimana bg.?
Om aku ganti font kok diweb nya nggak keluar ya?
bang cara biar kodingan nya tersusun rapi gmna ya cara nya ? ane klo copas kodingan ketengah terus klo di sift tab jadi rata sama yg kodingan di atas ga tersusun
bisa pake ekstensi dari Visual Studio Code Kak, namanya Prettier,
@@dirumahrafif prettier yg mana bg? banyak prettier di vs code soalnya bg wkwkwk
yg ini Bang >> marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
permisi bang mau tanya, di bagian baner saya kok background image nya hilang yaa bang?
padahal ngga ada style background-image:none; tapi pas saya inspek kok tiba tiba ada ya bang, mohon bantuanya bang
Bang caranya masukin ke winscp gimana ya??
kurang 1 ya itu di bagian id css padding top 2rem :)
Kok tulisan programing nya bisa disamping kiri yaa kak ?? Soal nya pas aku coba malah lgsg ke tengah kak, gk bisa ke kiri
Tekan Ctrl+b
Pak, jika ingin membuat halaman itu hanya bisa di kontrol dg klik navbar gimana caranya?
bang kalau misalkan background gabisa muncul kenapa ya ? saya pake bootstrap versi 5 juga ini, terima kasih...
Di CSS nulisnya gimana Bang?
Aku juga ga muncul bang
cara menyimpan pesan yg dikirim gmn bang
min mau nnya,kok iconnya ga muncul ya di saya
kenpa pas saya ikutin ubah css di html nya ga ngaruh ya,?harus sya bikin sendiri dulu cssnya
kalau css nya harus diikutkan di script nya Kak
Terimakasih pak, sangat membantu. Jika gambar pada portofolio tsb diisi gambar yg tersimpan di galeri gmana caranya?
kalau hanya pake HTML memang perlu ditulis satu persatu untuk gambarnya...kecuali kalau dengan PHP, bisa dibuat lebih dinamis...
@@dirumahrafif jika index.html itu dirubah namanya mjd index.php, karena ada script php pd file tsb, tampilanya berubah g? Maaf baru belajar.
kalau secara tampilan tidak berubah harusnya Bang...sama saja
@@dirumahrafif terimakasih, tutorial ini mudah dipahami. Sejauh ini dapat diikuti. Ada yg kurang pak, mohon bantuan. Pada menu portofolio, saya ingin menunya berupa berita, hot news. Dah saya rubah jadi php, gimana caranya mbuat menu login admin, sehingga admin dapat mengirim gambar untuk jadi berita. 🙏🙏
yang sudah ada fitur admin, edit, tambah, delete data ada di playlistini Bang >> th-cam.com/play/PLzt0WdHR1Z3mIO8sTcb_obvC5JmL_b-Fg.html
sudah lumayan lengkap kelihatannya
Ka kalau mau pake gmbar pribadi, itu gimana caranya ya k?
bang itu yang bagian pesan dipakai untuk ngrim pesan
Baru sebatas form Bang...belum dibuat untuk fiturnya...
@@dirumahrafif tolong bikin video tutorial nya dong bang jadi dari kontak form langsung kekirim data nya ke wa misalnya klien isi kontak form nya nama no telp terus email dan pesan nah nanti data yang dibuat klien nya itu masuk ke wa kita
Pak kalau gambar banner nya ga muncul itu kenapa ya? Padahal kodinganya ga ada yang salah
kemungkinan scriptnya blm benar atau file gambar yg diakses tidak ada Kak
Bang klo pas kita pencet pilihan navbar trus pas udh ke bagian dan judulnya gk keliatan lalu cara agar supaya judulnya sekalian ikut keliatan bagaimana?
Edit: contoh kita tekan layanan tapi judulnya gk keliatan saat scroll otomatis jadinya cuman isi(infonya) yg keliatan
kasih tag id di judulnya, jangan di div badan nya
@@pengumis Terima kasih sudah saya perbaiki 🙏🏼
Nah sama nih, udh bisa gan ?
@@pengumis di judul isi yg di bawah nya ? Pas saat ke scroll otomatis ?
@@pengumis judul layananya itu yang di dalam h2 bukan mas ?, itu emng di dalam div yah ? Saya masih bingung 😅🙏🏻
Cara memberi warna outline pada lingkaran icon bagaimana ya?
bagian icon bisa dibungkus dengan tag Bang, kemudian diberikan background...
Bg cara menambahkan artikel itu gimana..?
permisi web untuk Fontawesome kok ga ketemu ya, bisa sertakan link yg baru ga bang?
ini Bang fontawesome.com/
cdnjs.com/libraries/font-awesome
mas kok link fontawesome ga bisa ya
kak ini responsive ga?
responsive Bang
izin tanya bosku. cara menulis artikel/postingan baru di website yg dibuat pakai boostrap itu ada semacam halaman admin/dashboard admin seperti di wordpress atau menulisnya tetap via editor juga ya min? mohon infonya. terima kasih
Harus terhubung via data base mas kalo mau input tanpa text editor
cara upload gambar agar bisa dipanggil di bootstrap gimana pak?
kalau dari bootstrap artinya dia sebagai background image Bang..
Cara contak us nya bisa kirim ke gmail langsung bagai mna gan
perlu buat script pemrosesan datanya Bang, bisa pakai PHP atau yang lainnya
bang untuk link img bagian client apa tidak dicantumkan?
link download gambar dan video sdh ada di bagian deskripsi ya Kak....
ka font dari awesome nya gima ?
coba pakai cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css