Cara Membuat Website Sendiri Dari Nol Sampai Online ( Full Lengkap )

Homepage produk lainnya

Dibagian ini kita akan menambahkan fitur yang terkait dengan produk. Seperti produk terbaru, produk favorit dan Terlaris. Namun hanya Headingnya atau Judulnya terlebih dahulu karena untuk isinya kita perlu mengupload produk dahulu

Add new section > Pilih kolom blank (satu) > drag Teks Heading dan Divider. Lalu edit sesuai keinginan. Kemudian Duplicate untuk yang lainnya dan ganti judulnya sesuai Kategori Produk yang ingin di tampilkan misalkan Produk Terbaru, Favorit dan sebagainya

Tonton Video Lengkapnya

Homepage yang akan dibuat seperti ini

Add new section > pilih satu kolom > drag inner section. Drag icon dan Teks Heading ke setiap Inner section. Lalu edit sesuai dengan keinginan

Tonton Video Lengkapnya

Dibagian ini kita akan sedikit mengkustom tampilan blog yang dimunculkan di Homepage

Contoh tampilan blog yang akan dibuat

Instal Plugin Essential Addons For Elementor > lalu buat section baru > Drag Post Grid. Maka post yang sudah dibuat akan muncul di homepage

Untuk membuat footer pada artikel kali ini silahkan ke Theme panel > My Library > Add New > Masukan nama menu yang diinginkan > Edit with Elementor > Add new section > pilih structure > Drag inner section > Masukan Teks Heading dan edit sesuai keinginan

Tonton Video Lengkapnya

Persiapan Upload Hosting

Daftar Akun di Toko Online Kita

Di bagian ini kita akan mengatur Untuk sistem pendaftaran. Seperti, mengizinkan pelanggan untuk melakukan pendaftaran, Tidak mengizinkan pelanggan memesan tanpa mempunyai akun dan yang lainnya. Kamu bisa ikuti panduan dibawah ini ya :

Login ke Dashboard WordPress > Pengaturan > Umum > Centang pada di bagain keanggotaan dan pilih peran sebagai pelanggan

Woocommerce > Pengaturan > Akun dan Email > Centang seperti gambar dibawah ini

Tonton Video Lengkapnya

Download dan Instal WordPress

Download WordPress dari situs resminya di https://wordpress.org/ > Copy file WordPress > dan pastekan di folder C > Xampp > htdocs > Extract Here file wordpress nya > lalu rename file WordPress yang sudah di Extract sesuai dengan nama yang diinginkan

Aktifkan XAMPP (Apache dan MySQL) > buat database terlebih dahulu dengan cara ketikan localhost/phpmyadmin di browser kamu > Klik Baru > masukan nama database yang diinginkan > Klik Buat

Artikel Lengkap: Cara Membuat Database di XAMPP

Selanjutnya Ketikan localhost/nama database yang sudah dibuat di browser > saatnya melakukan konfigurasi wordpress > pilih bahasa > Klik lanjutkan > klik Ayo

Isikan Koneksi Database > Untuk Basis data isikan nama database yang sudah dibuat > Untuk settingan lainnya biarkan default kamu bisa lihat pada gambar > Klik jalankan pemasangan

Masukan informasi yang dibutuhkan seperti judul situs, username, password dan lainnya > klik instal WordPress > penginstalan selesai klik log masuk untuk login ke Dasboard WordPress

Artikel Lengkap: Cara Install WordPress di XAMPP dengan Mudah

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Beriktunya kita akan melakukan Setup dasar WordPress

Untuk setting permalink login ke Dashboard WordPress > pengaturan > permalink > pilih type post > Simpan Perubahan

Artikel Lengkap: Settingan Dasar WordPress #Permalink

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Klik Sunting profil di pojok kanan atas > Pada Manajamen Akun Atur kata sandi baru dan buat kata sandi atau password > Perbarui Profil

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Laman > Tambah baru > Buat nama halaman atau menu yang ingin dibuat > Publish > ulangi langkah tersebut untuk membuat Menu yang lain

Artikel Lengkap: Cara Membuat Halaman Website di WordPress

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Navigasi berfungsi untuk memunclkan Halaman yang sudah kita buat sebelumnya

Login ke dashboard WordPress > Tampilan > menu > Buat Nama menu > Pilih lokasi penayangan > tambahkan item menu > klik save menu

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Pengaturan ini berfungsi untuk memilih halaman mana yang ingin ditampilkan ketika orang lain berkunjung ke website kamu

Login ke Dashboard WordPress > Pengaturan Membaca > pilih halaman Home (atau halaman lain yang kamu pilih)

Untuk tema pada pembuatan website kali ini kita menggunakan Page Builder Framework

Baca Juga : Page Builder Framework – Tema WordPress Gratis Ringan

Login ke dashboard WordPress > Tema > Tambah baru > cari tema “Page Builder Framework” > Instal dan Aktifkan

**Jika dalam penginstalan gagal kamu bisa klik link berikut – Klik Disini

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Plugin ini kita gunakan untuk mendesain halaman website kita

Login ke Dashboard WordPress > Plugin > Tambah baru > cari plugin Elementor > instal sekarang dan Aktifkan

**Jika dalam penginstalan gagal kamu bisa klik link berikut – Klik Disini

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Selanjutnya kita akan mulai mendesain website kita,Untuk Tutorial mendesain ini cukup panjang ya, kami harapkan bisa dipahami dengan mudah.

Catatan : Ketika pembuatan website masih dilakukan di localhost jangan lupa menjalankan Apache dan MySQL terlebih dahulu. Dan setelah selesai mendesain jangan lupa klik update

Pembahasan berikutnya kita akan mendesain halaman homepage

Kita akan membuat Homepage Header seperti gambar dibawah ini

Langkah pertama kamu bisa ke laman > cari laman Home > Edit With Elementor > Klik tanda (+) > Pilih Structure > Masukan Teks Heading, Text editor dan button di bagian sebelah kiri kemudian ubah teks sesuai keiginan (Edit sesuai keinginan)

Masukan Fitur Image dan video dengan cara drag and drop lalu pilih gambar dan video yang diinginkan untuk bagian sebelah kanan (gambar bisa diambil dari situs gratis seperti undraw)

Berikutnya untuk pewarnaan atau background untuk header Klik di bagian Edit Section > Style > Backgorund > saya memilih menggunakan gradient, lalu atur warna sesuai keinginan > klik update

Baca Juga: Cara Menggunakan Elementor dengan Mudah

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Cara Membuat Website dari Nol Sampai Online – Full Lengkap

Halo Semuanya. Terimakasih Telah berkunjung ke blog kami ya. Sesuai Dengan Judul artikel kali ini kita akan membahas pembuatan website Company Profile Profile Dari Nol sampai online menggunakan WordPress. Mulai dari cara instal Xampp, instal WordPress sampai ke proses desain website nya

Jika kamu pernah mengunjungi artikel kami yang lain tentu sudah familiar dengan apa itu WordPress, karena kami sering membahasnya. WordPress atau CMS (Content managemet sistem) Adalah sebuah software yang mempunyai fungsi untuk membantu kita dalam membuat blog ataupun website dengan mudah, karena tanpa memakai coding kita sudah bisa membuat sebuah website yang menarik.

Baca Juga: Pengertian WordPress.com & WordPress.org – Yuk Simak

Jika Kurang Jelas, Bisa Lihat Video dibawah ini.

Ada beberapa persiapan dasar yang harus kita lakukan untuk membuat website Company Profile

Sales Booster Notifikasi

Fitur ini sebenarnya hanya opsional saja.cara menambahakan fitur ini dengan cara menginsal Plugin NotificationX . Login ke dashboard WordPress > Plugin > Tambah Baru. Cari plugin NotificationX > Instal dan aktifkan

Selanjutnya klik Tab NotificationX > Add New > masukan nama desain yang diinginkan dan kamu bisa mendesain tampilan dari NotificationX Yang akan ditampilkan

Tonton Video Lengkapnya

https://youtu.be/Xicx8cNSyvU

Download dan Install XAMPP

Kamu bisa Download Xampp dari web resminya https://www.apachefriends.org/ lalu pilih sesuai dengan sistem operasi yang digunakan (saran saya menggunakan Windows, karena dalam artikel ini saya menggunakan Windows)

Berikutnya silahkan instal Xampp yang sudah Didownload Tersebut. Untuk cara instal xampp bisa kunjungi artikel ini Cara Download dan Install XAMPP

Tonton Video Lengkapnya

Banyak yang bertanya kepada saya. Kak kenapa saat menginstal WordPress kok tidak Bisa? atau juga Waktu memasukan nama Database dalam proses instalasi WordPress kok gagal ya?. Hal ini disebabkan karena kamu belum membuat nama database di server localhost.

Bagaimana cara membuat database? Kamu bisa kunjungi artikel ini ya untuk pembuatan Database di localhost Cara Membuat Database di XAMPP untuk nama database bisa disesuikan dengan keinginan kamu ya.

Cara Membuat Toko Online Sendiri Dari Nol Sampai Online – Full Lengkap

Halo semua. Jika diartikel sebelumnya kita sudah membuat website Company Profile diartikel kali ini kita akan membuat Website E-commerce. Sebelum kita memulai pembahasan saya ingin menekankan bahwa artikel kali ini membahas E-commerce ya bukan marketplace.

Kenapa saya jelaskan seperti ini ? karena banyak sekali yang menghubungi saya. Kak apakah nanti orang lain bisa daftar toko di website kita? Apakah website ini bisa seperti Tokopedia, Bukalapak dan lainnya ? Jawabannya Tidak, karena ini hanya E-commerce saja bukan website Multi vendor. Untuk multivendor mungkin kita akan bahas di kesempatan lain.

Baca Juga: Jangan Keliru! Perbedaan Ecommerce dan Marketplace

Oke langsung saja kita masuk ke materi:

Secara singkat WordPress adalah sebuah tool atau dikenal dengan Content Management System (CMS) Yang berfungsi memudahkan kita dalam membuat website. Karena dengan WordPress tidak perlu memiliki skill Coding

Tonton Video Lengkapnya

Ada beberapa persiapan yang harus dilakukan sebelum membuat website

Hubungkan Semua Link Homepage

Jik diawal kita sudah membuat beberapa Button dan ketegori produk. Maka saatnya menghubungkan masing- masing button ke link terkait

Caranya Copy URL Dari Kategori produk yang sudah ada > Kemudian buka halaman Homepage > Edit With Elemenetor > Klik button yang sudah dibuat > masuk ke bagian Content dan pastekan link tersebut.

Tonton Video Lengkapnya

Tambahkan fitur Wishlist

Fitur Wishlist berfungsi agar pengunjung bisa memfavortikan terlebih dahulu produk yang diinginkan tanpa harus menambahkannya ke keranjang atau melakukan checkout. Untuk panduannya bisa ikuti dibawah ini ya

Instal dan aktifkan plugin Ti Woocommerce terlebih dahulu > Klik Tab TI Wislhist > General Settings > dibagian Button Custom css masukan “wishlist-button” > lalu save

Kembali ke Tab TI Wishlist > Style Options, Cari Kolom Template Custom CSS > masukan kode css > Lalu save

Tonton Video Lengkapnya

Untuk menambahkan fitur chat whatsaapp. Klik plugin > Tambah Baru > cari plugin click to chat > masukan Nomor Whatsapp kita, atur pesan yang ingin dikirimkan ke kita, style Tombol dan lainnya

Tonton Video Lengkapnya