
caption
hai semuanya balik lagi bersama saya
Yoko Bomb di segmen no coding no cry di video kali ini aku akan share ke temen-temen
semuanya Gimana cara membuat transparan background seperti ini di WordPress dan elementer tanpa
coding sama sekali oke daripada kelamaan kita langsung aja lihat video tutorialnya Oke jadi aku
udah buka file figma ya Ya Tonton buat teman-teman yang baru nonton di video ini Jadi ini adalah
lanjutan dari seri membuat website untuk menjual jasa ya tanpa ngoding sama sekali di WordPress
dan elementor jadi di video-video sebelumnya aku udah sering cara bikin desain website Ya
seperti ini di figma kemudian aku dah biarin videonya juga cara bikin header Hero ya tanpa
coding ya kita Hai heronya ini tanpa coding di WordPress dan elementor jadi temen misalkan belum
lihat video-video sebelumnya bisa tonton ya di playlist Aku no coding okray dan kali ini di video
kali ini kita akan membuat header ya temen-temen header seperti ini ya Jadi kita akan develop
desain ini desain header ini kedalam website menggunakan WordPress dalam interval mbahcoding
sama sekali dan kita lihat di sini atau menjadi di sini ada logo text logo kemudian di sini
ada menunya ya Dan ini begronnya transparan jadinya tuh dengan background header heronya ini
ya tenun jadi ini ada ungu dan di bawah umum atau di belakang Ungu background ungu yaitu ada seperti
bulatan-bulatan yang membentuk Veteran kayak gitu dan kita langsung aja ke dashboard WordPress
nya Oh ya By the way temen-temen yang belum memiliki website sendiri aku rekomendasikan untuk
menggunakan hosting dari niagahoster jadi di sini ada raket baru namanya Manager WordPress temen
jadi dengan manajer WordPress ini teman-teman bisa bikin website dengan berbasis WordPress
sendiri tanpa perlu mikirin cp0 ya Temen temen di sini ada tiga paket ya tiga ada ada tiga
paket harga begginer startup dan profesional aku rekomendasikan untuk menggunakan paket yang
sangat parah diskon yang paling gede ya diskon up to 70 jadi ini sudah bisa digunakan untuk tiga
website artinya temen-temen itu bisa meng-install tiga website dihosting Manager WordPress ini
ya yang pakai startup kemudian juga sudah ada gratis domain yah jadi temen bisa dapat domain
gratis Caranya tinggal diklik pilih sekarang ini Hai lihat disini untuk paket yang satu tahun
itu diskonnya 70% ya jadi aku rekomendasikan untuk pakai yang paket 1 tahun ya karena dieselnya
paling gede dan disini temen temen bisa Masukkan nama domain misalkan yokobomb nielsen.com kita
klik cekdomain lihat di sini harganya jadi nol Ya karena sudah gratis domain nah meninggal
tambahkan ketat kemudian klik lanjutkan Hai dan lihat di sini harga totalnya itu 718
ribu + PPN sepuluh persen jadinya 790000 Nah teman-teman bisa gunakan kode kupon yokobomb
untuk mendapatkan tambahan diskon ketik yokobomb disini kemudian klik juga kan dan Lihat harganya
jadi berkurang yang tadinya 760000 jadi 708090 tahun bisa gunakan kode kupon tersebut dan
Bisa langsung pilih konfirmasi pembayarannya atau metode pameran lihat apa tinggal bayar
aja aku rekomendasiin banget pake niagahoster ini karena selain harganya terjangkau juga
pelayanan itu paling bagus telen jadi disini misalkan ada keluhan atau ada kendala mengenai
website kalian itu kalian tinggal klik-klik aja langsung di sini ya nanti the CS dari niagahoster
itu pasti bantuin kalian aku udah sering gunakan fitur kwini jadi misalkan dewasa baku yang lagi
error atau misalkan aku otak-atik website terus tiba-tiba Error itu aku tinggal minta bantuan ke
Cs niagahoster nya dan langsung dibantuin jadi rekomendasiin banget pakai niagahoster nih oke aku
balik ke dashboard WordPress kuliah temen di sini kemudian masuk ke menu plugin oke nah disini
temen-temen install dulu lagi nih ya like dulu the lounge Hai teman-teman silahkan install
plugin namanya ketik Kita ketikan elementer Hai Oke jadi teman install dulu pagi namanya
elementer header and footer di sini ya he diinstal dulu aja ini terus jangan lupa diinstal
dulu plug-in elementer yang bisa kan teman-teman baru nonton video ini jangan lupa install juga
play game elementer ya Jadi ada Dua paginya elementor plus elementer header and footer
Oke ini elementer website Builder diinstal dulu kemudian di klik activate temen kemudian
teman-teman masuk ke menu appearance klik menu ya jadi kita buat dulu Ini kan ada empat
menu ya perishing service blog dan konten Nah kita buat menu ya dulu caranya disini
apriance lalu kita buat Create new menu ya di sini ini aku udah buat sebenarnya Tapi aku
tunjukin lagi caranya Create new menu oke lalu kita bisa tetap nama ini menunya misalkan
menu2 disini aktris menuduh aja create menu Hai terus ada di Sini temenin bisa pilih custom
link dan diisi dengan ini sini Sorry disini pressing service blog dan kontak yah jadi
temen-temen Silahkan isi sesuai dengan menu yang ingin ditampilkan dan disini masukkan where
ya misalkan ini belum ada kuisi pager gini aja nanti bisa di-update dengan url nya kek like to
Menu lalu Tambahkan lagi servis block dan kontak oke service aku tambahkan di sini lalu yel-yel
kosongin dulu Itu menu kemudian blog ya Dan ini juga diisi pager gini aja lalu kontak oke kemudian
klik Add to Menu lagi kalau sudah di-save ya seven uh Hai Oke kita lanjut untuk bikin header ya
ya Temen temen di sini Lihat dosennya header YouTube transparan jadi background YouTube pakai
background dari header heronya ini nah caranya temen masuk ke upgrade lagi Woi elementer header
and footer Builder ini ya jadi plugin yang sudah kita install lagi elemen header footer kemudian
klik add New ya clicked new lalu disini bisa dinamakan yah misalkan header menu dua oke lalu
di Sini temenin pilih type of templatenya bisa header bisa before future for futher tuh sebelum
puter-puter itu dibawahnya dan custom blog karena disini kita pakai header jadi kita pilih header
Ride kemudian Bisma on ya di sini dipilih temen ada pilihan ada entire website ntr website
maksudnya seluruh website akan menampilkan header ini kemudian ada alors OLX office semua
arsip maksudnya adalah halaman-halaman arsir page ditampilkan di headernya kemudian bisa disetting
juga khusus pos tertentu atau halaman tertentu itu bisa juga disini kita pilih yang besok aja
ya ngentai website jadi kita akan menampilkan semua header ya di dalam keseluruhan headset lalu
teman bisa tambahkan disini sebenarnya etnis Peru atau eksekusi real maksudnya adalah disini Seakan
Di dipilih atau menang bisa pilih misalkan header ini tidak tidak tampil di halaman tertentu Nah
itu bisa dipilih di sini oke Ini aku kosongin aja kemudian yusrol nya Nah ini sebenarnya bisa dibeli
juga semua paudnya Hidupnya akan tampil di semua user ya atau ketika login atau ketika lokotoy itu
bisa disetting semuanya di sini aku pilih yang oleh ya kemudian able layer for elementer kanvas
ini menu lanjutan nanti akan membahas di video selanjutnya mungkin ini kita kosongin aja dulu
buat besok kayak gini kemudian save Drive hai hai the lounge hai lalu setelah itu kita klik edit
with elementor Hai Oke ini kan passcore kanvas kosong nya dari elementer kayak gini kemudian
kita buat etnis section ya Temen temen di sini kita buat dua kolom seperti ini ya Jadi ini
karena dua kolom yang pertama ada kolom untuk teks logonya ya text logo kemudian ada menunya
Oke temen Nah seperti ini nah ini Ton bisa geser ya bisa geser kayak gini Oke nah disini kita
masukkan widgetnya yang Oke kita lihat dulu bagian sini general premium Advan bukan nah yang
ini elemen header ini jadi di sini ada page title ada site title ya temen jadi bisa masukkan di sini
Misalkan nah ini karena belum kita settingnya jadi tulisannya my book my blog ya jadi misalkan
temen-temen belum setting title websitenya itu dialog damai blok nanti temenin bisa setting di
sini atau kita bisa ganti ya ini delete aja kita pakai yang basic dan kita pakai High gadget jadi
temenan bisa tambahkan teks di sini ya terserah temen-temen di sini aku tulis your website aja
seperti ini kita setting style nya ya disini kita pakai phone-nya item aja item dulu aja kayak gini
nanti kita gantiin iphonenya dan ini pakai Poppin terus ini pakai 20 Ayah naik kira-kira kayak gini
Oke sendiri bisa setting dari sini kita bisa lihat di sini nah pakai Popin dan disini ponselnya 20
jadi kita tinggal Ngikutin aja dari desain yang sudah kita buat Oke Setelah itu kita perlu menu di
sini ya teman-teman perlu meneliti Sini masuk ke widget lagi lalu masuk ke elemen header footer
ini temen-temen nah pilih yang navigation menu ini kita drag kesini key Nah kita pilih menunya
ini yang kita buat tadi yaitu menu2 ya tadi aku buatnya nah disini dipilih disini ton oke terus
alas menuitem nah ini maksudnya adalah kita bisa setting button di bagian terakhir menunya nantikan
terakhir kontak ya jadi kita bisa atur seperti ini nanti aku akan gunakan karena didesain ya kita
lihat di sini enggak pakai balon ya jadi aku Biarin aja kemudian Lay out-nya nah ini disetting
kita buat rata kanan kayak gini ya lalu disini bagian sub menu icon Nah ini bisa Misalkan temanmu
di sini ada submenunya ya nanti bisa disetting di sini aku lewatin aja ini karena kita enggak
ada submenunya key kemudian breakpoint nah ini maksudnya gini teman breakpoint tuh ketika dibuka
di bagian ini tablet ya kayak gini responsip yakni dia akan langsung berubah jadi hamburger ke ini
ya kita bisa setting di bagian kanannya gini ini terserah ya frekwensi misalkan Kalian mau pengen
yang mobil aja jadi yang di tablet tetep muncul kayak gini tapi rekomendasi Edi Hai tablet ya kita
buat seperti ini Oke kita buat desktop lagi terus kita setting di bagian Oh ya di sini lihat nih
temen ini tuh barat Ayah your website sama teks yaitu your website sedikit agak naik jadi kita
perlu ratakan dulu klik kolam ini lalu bagian vertikal lain kita pilih yang middle Nah jadi dia
rata ya Oke kalau sudah kita masuk ke sini lagi ya kebagian style lalu disini horisontal padding
ya temennya setting resolve di itu jaraknya ini ya ini aku akan skip aja ini harus wedding
vertikal.pdf menulis setting-setting sendiri terus di sini ada link hover effect ya Temen temen
di sini lihat nih link over efek-efek seperti ini ya Nah ini bisa disetting misalkan underline jadi
ada garis di bawahnya kayak gini atau disini bisa diganti juga Friend seperti ini nah ini silakan
di setting di sini tidak unknown aja ya aku remaja ini aja yang paling disini ton bagian
tipografi kita ganti ya teksnya Kita sesuaikan karena kita bisa dipakai yvonne Popin supaya
konsisten kita pakai Poppin dan size-nya gitu sekitar 16 keywordnya 400 kekurusan 500 Oke bagian
warnaku schedule aja ya sebagai mataku segini yang normalnya yang paling tradisi tenun bagian
over over ketika Amos didekatkan ya ini akan berubah jadi ijo yang inilah the menggantinya
disini key seakan mau diganti merah kayak gini nah ini gede di sini oke bagian aktif itu
ketika ini yang aktif di mana Nanti warna akan berubah itu oke dropdown Nah selanjutnya
kita + setting adalah dropdown ini dropdown ini akan muncul ketika tampilannya itu mobile
tahun menjadi diklik ini dulu responsif modnya lalu klik mobile nah disini bisa lihat dia akan
berubah jadi hamburger Nah kita akan settingnya Cut hamburger supaya naik ke atas ya jadi caranya
temen pilih kolom Ya ini yang gue repotnya dulu kolom dipilih kolom ukurannya itu 50% aja dan ini
50% juga bagian kolom hamberger nya 50 juga nah jadi dia akan sejajar gitu menjadi pas kita klik
disini nah kan muncul seperti ini nah settingnya itu di dropdown ini temen jadi bagian normal temen
saya ganti teksnya di sini ya warnanya ya bakal ganti merah kayak gini ini aku default nyapu item2
Jab begron kalor namun bisa juga ganti di sini ya terserah warnanya ini aku Depot input itu aja
Oh ya ini aku temenin aja biar kelihatan dulu oke terus di sini ada lihat ada garis-garis ini
itu masuknya di divider ini nah temen Silahkan pilih bisa dihilangkan kayak gini ya Terus disini
dropdown white nyatem bisa rubah juga ya misalkan yang ini kita ganti Horizon of wedding ya ya
teman-teman bisa rubah kayak The Fed dingin Ia lalu vertikal pedenya juga bisa dirubah nah ini
aku default najmun sekitar 15 dan ini juga 15 saja Oke Nah nanti teman teman bisa lihat sendiri
di bagian sini oke kemudian yang bagian menu yang paling penting ini menunya tahun bisa ganti juga
eh menurutmu disini icon ya layout kemudian nah ini icon ya ya kita bisa ganti misalkan iconnya
yang ini aja bagian x-nya tahu dia bakal gantikan kita klik nah dia ganti kayak gini Oke kita udah
itu aja yang ini bagian mobilnya ya cukup ini dulu kemudian teman-teman masuk ke edit section ini
Nah kita akan buat layer header ini di paling atas jadi head indexnya ya kita isi 10 Oke kemudian
bagian Style ya tahun milih background nya itu diklik lalu dipilih yang transparan jadi ini
transparan diatur kayak gini Oke lalu klik publish The Key Nah aku akan buka ya aku akan buka dulu di
sini aku copy linknya terus aku paste disini jika Hai Oke aku masuk ke dashboard lagi terus masuk kehalaman pch kepit sorry maksudnya
bukan halaman it's sama aja ya home ya Ini adalah tempat aku edit desain sebelumnya ya temen jadi
yang baru gabung di video ini mungkin bisa lihat video-video semua jadi aku udah buat serial yang
untuk membuat Website seperti ini ya Temen temen oke nah Ini aku akan edit dulu di sini Caranya
tinggal diklik edit with elementer aja item Terserah mau pakai pc yang sudah ada atau mau
bikin PC baru caranya saat nanti sama ini di sini aku gunakan PC yang sudah tersedia ya Temen
oke lalu di bagian setting di bawah sini masuk ke setting kemudian ganti PC yaitu elementer
full with oke lalu biarkan loading dulu dia dia akan meload dulu Nah lihat di sini headrest udah
masuk ya temen-temen jangan lupa klik like dulu ya Hai nah tapi bisnis headernya itu masih putih
temen aja didesain itu kan dia transparan dan menyatu dengan background di bawahnya jadi kita
akan buat seperti itu caranya masuk ke header ya tadi ya Ton disini lalu masuk eh bukan deh kita
dah buat hidrida transparan jadi yang kita perlu setting adalah di bagian ini di bagian elementary
Nia jadi kita akan setting.ini background ini naik ke atasnya Oke caranya klik edit section klik
Advance nah temen lu disini bagian marginnya diam link dulu ya diklik ini kalau misalnya kayak
gini diklik kamling dulu lalu bagian marginnya itu yang top ini kita buat minus sampai di Amerika pas
Yap Nah kira-kira kayak gini atau gampang yah jadi dia akan naik ke atas dan bighairi itu terlihat
transparan Oke kalau sudah perut Update dulu temen Nah kita akan berubah warna teksnya ini ya
warna teksnya didesain ini akan menjadi putih ya Jadi kita rubah jadi jam elementer menunya tadi ya
kita berubah ini menjadi putih Oke ini juga putih Kai publik ini kemudian masuk ke style
Asy'ari yang ini dulu diklik dulu style kemudian tipografia kita ganti juga warnanya di
putih yang ini klik update dan kita buka ini lagi kita refresh oke sudah jadi atau melihat disini
background nya sudah putih esoris font nya sudah putih bukan Teganya bikinnya juga sudah transparan
jadi begronnya Sudah ikut ini ya ikut background header nya ini kita menahan bisa dilihat disini
udah sama ya Nah ini kan fotonya agak kecilan dikit nah tahun melihat bisa setting juga disini
lihat di sini font itu sekitar 14 dan kalau kita lihat disini tuh ketebalan ya jadi kita bisa
setting di bagian menunya lagi nih ini hampir enggak kelihatan ya karena warnanya sudah kita
ganti putih jadi kita langsung edit aja bagian tipografinya teksnya sekitar 14 Oke kita rubah
14 kemudian however ya covernya doa Ungu Ketemu merah itu kurang eye-catching ya kurang gampang
di mudah jadi aku mau kurang gelap sorry maksudnya dan aku mau ganti warna jadi agak ke orang orange
orang-orang kekuning-kuningan kayak gini kuning oranye oranye Oke update lalu di sini kita refresh
lagi dan kita bisa lihat hasilnya nah seperti ini kira-kira nah ini kalau misalkan kurang tipis
lagi ya file-nya Ya itu bisa disetting di bagian sini oke tetapi ini aku udah cukup puas kayak gini
kira-kira Kayak gini aja oke dan kita bisa preview disini temen kita arrives sini Hai terlihat
ya dia sudah ganti font nya jadi putih disini dan background header yaitu deh transparan juga
Oke jadi seperti itu cara bikinnya teman-teman Oke jadi itu tadi temen cara membuat
header transparan di elementor versi yang free jadi caranya cukup mudah Tahun
silahkan dipraktekkan Nanti kalau ada yang kurang jelas bisa Comment di bawah sini nanti
kalau aku bisa aku akan bantu bales di kolom komentar di bawah ini ya itu aja atau tenun
suka video ini silahkan di share dan jangan lupa di subscribe channel ini sampai jumpa
di video selanjutnya saya Obong terima kasih