Anda disini: M Jurnal » Wordpress » Template WordPress : Cara Instal dan Contoh Customize

Template WordPress : Cara Instal dan Contoh Customize

Melanjutkan Panduan sebelumnya, kali ini Anda akan belajar Cara instal template WordPress Free serta contoh customize template tersebut.

Di WordPress sendiri, banyak kok template / theme yang keren-keren bahkan ada yang 100% Free, Fremium (sebagian fitur gratis) dan ada juga yang Premium (100% beli / sewa).

Note: Saya hanya ingin mengingatkan, Jangan Pernah Menggunakan Template / Theme Nulled (Bajakan). Karena berbahaya untuk Website Anda sendiri. Kenapa ?

Pertama, tindakan ini ilegal. Jika Anda menggunakannya, si pemilik template akan tahu. Website Anda bisa diakses online kan ? Si pengemmbang template tentu bisa cek milik Anda.

Kedua, Template Nulled (Bajakan) cenderung terdapat malware (virus). Dan resiko terbesarnya, Website Anda akan terinfeksi virus dan menjadikan peringkat Anda buruk dimata Search Engine (seperti google).

Ketiga, jika terjadi sesuatu pada Website Anda, pihak host (tempat Anda menyewa domain dan hosting) tidak akan bersedia membantu. Toh ini kesalahan Anda sendiri.

Masih banyak lagi resiko lainnya yang sangat merugikan Anda. Oleh karena itu, Saya sarankan Anda untuk menggunakan template gratis saja atau jika Anda memiliki budget lebih, silahkan beli template premium dari pengembangnya langsung.

Ads

Pada panduan kali ini, kita mulai dari belajar mengganti template WordPress.

Cara Ganti Template WordPress

Setidaknya ada 3 cara mengganti template WordPress yatiu:

  1. Instal Melalui Dashboard WordPress.
  2. Upload Melalui Dashboard WordPress.
  3. Menggunakan File Manager

Saya akan jelaskan satu per satu mengganti template WordPress menggunakan 3 cara tersebut.

#1 Instal Melalui Dashboard WordPress

Pertama-tama, Anda harus login ke dashboard WordPress. Kemudian ikuti tahap berikut:

Cara ganti theme wp
  1. Pertama, pada Dashboard WordPress, arahkan kursor ke menu Tampilan kemudian pilih Tema.
  2. Kedua, klik Tambah baru kemudian muncul halaman pencarian theme WordPress seperti berikut:
Cara ganti tema WordPress

Pada halaman ini, Anda bisa mencari Theme resmi apapun yang tersedia pada direktori WordPress.

Sebagai contoh, Saya akan mencari theme OceanWp. Maka ketik OceanWp pada kolom pencarian dan ikuti tahap berikut:

  1. Pertama, setelah Anda ketik nama Template OceanWp, Hasilnya akan muncul. Selanjutnya klik Instal.
  2. Kedua, setelah proses instal selesai, maka tombol Instal akan berubah menjadi Aktifkan. Jika Anda ingin langsung mengaktifkan Template, silahkan klik Aktifkan.

Note: Jika Website Anda sudah live dan sudah ada visitornya, lebih baik jangan langsung Aktifkan Template baru melainkan pilih Pratinjau Langsung. Karena Anda harus menyesuaikannya terlebih dahulu. Dari pada tampilan Website Anda menjadi berantakan.

#2 Upload Melalui Dashboard WordPress

Opsi ini berguna jika Anda menggunakan template premium yang di download langsung melalui website developer seperti theme premium Divi atau melalui Website Direktory WordPress Org.

Ads

Jika Anda sudah download file nya, silahkan instal template tersebut seperti cara berikut:

upload theme wp
  1. Pertama, klik Tampilan > Tema > Tambah Baru seperti cara sebelumnya. Kemudian Klik Unggah Tema
  2. Kedua, klik Browse… dan cari template yang sudah Anda donwload. Pastikan File Template yang Anda upload berformat .zip.
  3. Ketiga, Klik Instal Sekarang untuk melanjutkan dan tunggu proses sampai selesai.
template wordpress - cara ganti tema wordpress

Jika sudah selesai, Anda bisa Pratinjau Langsung / Aktifkan / Kembali ke halaman Tema.

#3 Menggunakan File Manager

Cara instal Template WordPress melalui File Manager cukup mudah. Yang perlu Anda lakukan, silahkan siapkan file tema (berekstensi zip) yang sudah Anda download melalui Direktori WordPress atau melalui website pengembang.

Kemudian, masuk ke panel hosting Anda. Berhubung Panduan ini dari Awal menggunakan Plesk Panel, Saya tunjukkan cara instal melalui Plesk Panel.

Namun, jika Anda menggunakan CPanel atau yang lainnya, Anda bisa menyesuaikannya. Kurang lebih proses instalnya sama saja. Silahkan login ke panel Anda dan ikuti tahap berikut:

Upload Theme menggunakan File Manager Plesk Panel
  1. Pertama, pada dashboard Plesk Panel, silahkan klik Menu File. Bagian inilah yang disebut dengan File Manager. Banyak hal yang bisa Anda lakukan pada File Manger ini.
  2. Kedua, pilih tempat Website WordPress Anda tersimpan. Jika Anda mengikuti tutorial Saya dari Sub-BAB pertama, maka lokasi penyimpanan Web WordPress Anda berada pada Folder httpdocs.
  3. Ketiga, jika Anda membuka file yang benar, maka akan muncul beberapa Folder dari penginstalan WordPress seperti wp-admin, wp-content, dan wp-includes. Silahkan klik folder wp-content. Jika sudah, maka silahkan klik folder themes. Hasilnya sebagai berikut:
Upload Template WordPress melalui File Manager Plesk Panel

Selanjutnya silahkan klik Upload. Kemudian cara file zip oceanwp yang sudah Anda download. File tersebut tidak perlu Anda ekstrak pada komputer. Upload saja dalam format zip.

Setelah selesai, kemudian ekstrak file yang sudah Anda upload pada File Manager. Caranya klik saja file tersebut. Jika ada pemberitahuan untuk ekstrak file, maka silahkan klik ok.

Setelah selesai, silahkan hapus File theme zip. Tujuannya untuk menghemat size hosting Anda.

Jika suda, silahkan kembali ke dashboard WordPress. Kemudian pilih menu Tampilan > Tema. Anda akan melihat Template OceanWp disana.

Saya yakin sampai disini Anda sudah paham ke tiga cara instal Template WordPress Free maupun berbayar di atas.

Selanjutnya Saya akan tunjukkan cara customize template WordPress Free.

Cara Customize Template WordPress (Contoh: OceanWp)

Sebenarnya semua Theme WordPress baik yang gratis maupun premium memiliki dokumentasi cara customize template mereka.

Namun, pada Panduan ini Saya akan jelaskan lebih rinci bagian-bagian utama yang harus Anda pahami seperti Logo, Icon, Menu / Navigasi, Pengaturan Beranda dll.

Anda ingat pada Sub-BAB sebelumnya Saya menjelaskan bahwa Anda bisa membuat halaman beranda (seperti https://mjurnal.com) menjadi halaman statis. Sementara halaman list blog berada pada https://mjurnal.com/blog/. Jika lupa, silahkan baca kembail Sub-BAB Dashboard WordPress.

Baiklah Saya lanjutkan. Pertama-tama template OceanWp Free pada WordPress Anda belum aktif, silahkan klik menu Tampilan > Tema. Kemudian arahkan kursor ke tema OceanWp dan klik Pratinjau Langsung.

Namun jika Tema OceanWp sudah aktif, silahkan klik Tampilan > Sesuaikan. Maka halaman Pratinjau Langsung akan terbuka.

Inilah salah satu kelebihan WordPress, Anda bisa mengubah desain (tampilan) website tanpa perlu repot-repot edit HTML.

Dengan fitur Pratinjau Langsung ini, Anda bisa tahu seperti apa tampilan Website Anda sebelum Anda mempublikasikannya.

Saya akan jelaskan 4 bagian utama saja yang bisa Anda setting sebagai berikut:

#1 Customize Identitas Situs

Seperti yang telah Saya bahas pada Sub-BAB Dashboard WordPress, Anda bisa mengganti judul dan slogan situs dengan logo. Cara nya silahkan klik menu Identitas Situs pada Pratinjau Langsung WordPress. Kemudian ikuti tahap berikut:

Customize Template WordPress - Identitas Situs
  1. Pertama, hilangkan Centang pada bagian “Tampilkan Judul Situs dan Slogan” untuk menggantinya dengan Logo Website Anda.
  2. Kedua, upload Icon Website Anda. Note: Icon ini bukan logo yang tampil pada header dekat menu Website. Tapi icon yang tampil pada Tab Browser. Pastikan Anda upload Icon dengan ukuran yang sama dengan ketentuan tema tersebut.

Terus logo nya upload dimana ? Sabar, kita selesaikan satu per satu dahulu.

#2 Customize Menu

Penting! Anda bisa membuat drop down menu seperti Website M Jurnal. Caranya, klik Menu > Buat Menu. Kemudian ikuti tahap berikut:

Drop down Mentu WordPress
  1. Pertama, Buat Nama Menu. Nama ini hanya bisa Anda lihat pada Dasboard WordPress atau Pratinjau Langsung. Jadi pada halaman live website Anda, nama menu ini tidak akan tampil. Buat lah nama yang mudah Anda kenali. Dalam contoh ini, Saya memberikan nama menu ini sebagai “Header”.
  2. Kedua, Centang Main yaitu menu yang tampil pada bagian logo Website Anda. Coba lihat pada gambar, menu Tob Bar akan berada di atas header. Footer berada pada halaman paling bawah. Sementara Mobile adalah menu khusus pengguna yang menggunakan perangkat Mobile (HP / Tablet). Kemudian muncul halaman edit menu sebagai berikut:
Buat Drop Down menu WordPress
  1. Pertama, klik tambahkan item untuk menambahkan Menu Website Anda.
  2. Kedua, silahkan pilih item mana yang akan Anda masukkan kedalam menu seperti Tautan Tersuai, Laman, Pos, Kategori, Tag, atau Format.
  3. Ketiga, Saya sudah memasukan beberapa contoh menu. Untuk membuat Drop down menu, silahkan sesuaikan urutan menu (guankan drag & drop). Lihat struktur menu pada gambar. Setiap menu yang menjorok kedalam adalah Sub Menu dari menu utama. Misalnya, Kategori adalah Sub Menu dari Beranda. Sementara Sample Page adalah Sub Menu dari Kategori. Kurang lebih tampilan menu akan seperti berikut:
Contoh Drop down menu Website

Nah, selanjutnya Anda bisa berkreasi lebih baik lagi. Misalnya Anda juga bisa membuat Mega Menu seperti Menu Utama M Jurnal. Lihat gambar berikut:

Cara membuat mega menu pada wordpress

Menu Kategori pada M Jurnal di desain menggunakan Mega Menu. Ini berguna jika Anda memiliki banyak item yang akan ditampilkan pada Menu Utama.

Saya rasa untuk menu cukup sampai disini dulu. Jika Anda butuh bantuan, silahkan coret-coret pada kolom komentar atau diskusi pada Forum WordPress M Jurnal.

#3 Pengaturan Beranda

Silahkan buka Menu Pengaturan Beranda pada Pratinjau Langsung. Pada Sub-BAB Panduan sebelumnya kita sudah mengatur Halaman beranda menjadi Halaman statis. Untuk melanjutkan pengaturan, silahkan ikuti tahap-tahap berikut:

setting template untu Halaman depan statis WordPress
  1. Pertama, pilih “Sebuah Halaman Statis”.
  2. Kedua, pilih halaman mana yang akan menjadi halaman beranda Anda. Atau Anda juga bisa membuat halaman baru. Jika Anda membuat halaman baru, silahkan ketikkan nama halaman tersebut.
  3. Ketiga, silahkan pilih halaman mana yang akan menampilkan list artikel Anda. Misalnya seperti halaman blog M Jurnal berada https://mjurnal.com/blog/

#4 Setting Header

Saya hanya fokus pada Upload Logo saja. Silahkan klik menu Header > Logo. Kemudian klik Pilih Gambar pada bagian Logo. Kemudian silahkan upload Logo Anda dengan ukuran persegi panjang. Selanjutnya setting 2 Max Widht dan Max Height.

Sesuaikan saja dengan ukuran logo Anda. Jika terlalu besar, buat lah Max Widht dan Height lebih kecil. Contohnya, Saya menggunakan Max Widht 220 px dan Max Height 100 px. Hasilnya akan tampak seperti berikut:

Ubah Logo Website WordPress pada Template

Lalu apa selanjutnya ? mulai lah berkreativitas. Buatlah desain yang mantap dan keren menurut Anda. Karena selera Saya belum tentu sama dengan selera Anda.

Atau Anda juga bisa menggunakan Template WordPress lainnya. Nanti untuk Review Template, akan Saya buat pada konten terpisah.

Silahkan jelajahi semua menu yang ada pada Pratinjau Langsung ini. Selama Anda tidak klik Aktifkan dan Terbitkan atau Terbitkan. Tampilan Website Anda saat ini tidak akan berubah.

Jadi jika sudah selesai mengubah desain, silahkan aktifkan atau terbitkan. Selanjutnya Saya akan buat panduan tentang Plugin. Silahkan gunakan Pintasan Panduan Instal WordPress berikut:

Pintasan Panduan Desain dan Tampilan WordPress

SUB-BAB Sebelumnya: Setting Dasar WordPress.

  1. Template: (Anda Disini).
  2. Favicon & Logo: Cara menambahkan Logo dan Favicon (Icon) di WordPress.
  3. Widget WordPress: Cara membuat dan mengatur Widget (di Header, Side Bar, dan Footer).
  4. Optimasi Widget: 7 Teknik Optimasi dan memaksimalkan Widget Website WordPress.
  5. Menu: Cara membuat menu website WordPres (Contoh: Dropdown Menu).

SUB-BAB Berikutnya: Optimasi Permalink.

Apakah Panduan ini Membantu Menyelesaikan Permasalahan Anda ?

Rolan Mardani

Traktir Saya secangkir kopi supaya kuat begadang untuk membuat konten-konten Panduan yang berkualitas dan membantu menyelesaikan permasalahan Anda.

Bantu Orang Lain... Share Panduan ini:

Komentar Paling Lambat di Balas Pukul 23:59 :)