Cara Mengkonversi HTML Template Statis menjadi tema WordPress Responsif Part-2

Tutorial WordPress rinci ini akan menunjukkan cara untuk mengkonversi template web HTML statis menjadi tema WordPress yang akan berfungsi penuh.

Untuk mulai mengkonversi tema NeoBlog WordPress. Pertama buat folder tema dalam direktori wp-content / themes di folder instalasi WordPress. Harap perhatikan bahwa nama folder harus sesuai dengan nama tema yang ingin kita buat.

File Template

Dibandingkan dengan statis situs HTML dan CSS, tema WordPress terdiri dengan sekelompok file template. Ini adalah file yang berisi kode untuk membuat tema WordPress bekerja. Untuk melakukan ini, membuat file berikut ke dalam direktori tema:

• folder css – Folder ini berisi semua stylesheet. Salin folder ini dari folder HTML dan tema CSS.
• font folder – Folder ini berisi semua font eksternal digunakan di markup. Salin folder ini dari NeoBlog HTML dan tema CSS.
• images folder – folder ini berisi semua gambar seperti logo dan sebagainya. Folder ini akan disalin dari NeoBlog HTML dan tema CSS.
• js folder – folder ini berisi semua javascripts. Juga, copy ini dari NeoBlog HTML dan tema CSS.
• header.php – File ini akan berisi kode untuk bagian header dari tema.
• footer.php – File ini akan berisi kode untuk bagian footer dari tema.
• index.php – ini adalah file utama untuk tema. Ini akan berisi kode untuk Main Area dan menentukan di mana file lainnya akan dimasukkan.
• functions.php – Berkas ini berperilaku seperti Plugin WordPress, menambahkan fitur dan fungsionalitas ke situs WordPress.
• single.php – File ini akan berisi tata letak dasar dari halaman blog.
• page.php – File ini akan berisi tata letak dasar dari halaman.
• page-about.php – ini adalah WordPress built-in Pos Jenis Template. Jika halaman tertentu, atau kelompok halaman harus berperilaku atau menampilkan yang berbeda, ini mudah dicapai dengan halaman template ini. Untuk template ini, itu akan menampilkan tata letak halaman Tentang
• Halaman-contact.php – Tipe lain dari WordPress built-in Pos Jenis Template. template ini akan menampilkan formulir kontak pada halaman itu diatur.
• konten-search.php – File ini akan menjalankan loop untuk pencarian untuk output hasil.
• search.php – File ini bertanggung jawab untuk menampilkan halaman hasil pencarian.
• searchform.php – File ini berisi tata letak form pencarian.
• comments.php – File ini akan berisi kode untuk menampilkan komentar.
• sidebar.php – File ini akan berisi area widget sidebar.
• 404.php – File ini akan mengembalikan “Tidak Ditemukan” pemberitahuan jika permintaan pencarian tertentu tidak ditemukan atau tidak ada dalam database.
• style.css – File ini akan mencakup semua gaya dan informasi dari tema NeoBlog.
• screenshot – file gambar png, yang harus secara akurat menunjukkan desain tema atau judul tema.
Selama tutorial ini, kode akan ditambahkan ke file-file ini yang akan mencakup menu, kait, loop dan widget

Untuk memulai, salin css, font, gambar dan folder js dari NeoBlog HTML dan tema CSS ke folder tema NeoBlog WP.

Sebelum menyatakan dengan file template, pertama menambahkan link dari stylesheet dari NeoBlog HTML dan tema CSS dengan tema NeoBlog WP. Pergi ke depan dan membuat file style.css

Sekarang tema telah berhasil bernama melalui berkas style.css, menambahkan screenshot dari tema. Buat file px 880 x 660 di Photoshop dan menempatkan teks judul, deskripsi singkat dan penulis tema di atasnya.

screenshot hanya akan ditampilkan sebagai 387x 290 px pada panel admin WordPress, tetapi lebih dari gambar berukuran ganda memungkinkan untuk resolusi tinggi melihat pada layar HiDPI.

Setelah menambahkan screenshot dari tema, mengaktifkan tema NeoBlog WP. Tapi sebelum melakukan itu, untuk memeriksa apakah tema bekerja atau tidak, buat pertama index.php kosong di direktori root dari tema NeoBlog WP (jangan khawatir kode akan ditambahkan pada ini nanti).
Berikutnya, mengaktifkan tema, pergi ke admin panel dan mouse WordPress mouse Anda ke Appearance -> Tema. Klik pada tombol Aktifkan.


Tags: #tips blog #trik blog #tutorial blog

3 Tutorial Cara Membangun Toko Online di WordPress
3 Tutorial Cara Membangun Toko Online di WordPress
Seiring perkembangan teknologi internet saat ini, semakin
Bagaimana Cara Menggunakan WordPress Untuk Pemula
Bagaimana Cara Menggunakan WordPress Untuk Pemula
WordPress sendiri adalah salah satu fasilitas yang
Membuat Simple Syntax Highlighter Di Blogger
Membuat Simple Syntax Highlighter Di Blogger
Apakah anda Ingni Menggunakan Prettify Syntax
Cara Membuat Fanpage Facebook Melayang Di Blog
Cara Membuat Fanpage Facebook Melayang Di Blog
Bagi Para Blogger Yang mempunyai Fanpage
Memasang Widget Random Post di Blogger dengan Thumbnail
Memasang Widget Random Post di Blogger dengan Thumbnail
Random Post Blogger Thumbnail – Apakah
Tips dan Trik Menggunakan WordPress untuk Pemula
Tips dan Trik Menggunakan WordPress untuk Pemula
Apakah anda baru Menggunakan CMS WordPress
2 Cara Membuat akun OpenID untuk Berkomentar di Blog
2 Cara Membuat akun OpenID untuk Berkomentar di Blog
alimadura.com – Pada artikel kali ini
Must read×

Top
web statistics