Dalam dunia pengembangan WordPress, memiliki alat yang tepat dapat membuat perbedaan besar. Itu sebabnya kami sangat gembira mengumumkan peluncuran Aplikasi Kode baru dari Asisten – alat serbaguna dan canggih yang dirancang untuk menyederhanakan alur kerja pengkodean Anda dan memudahkan pengelolaan cuplikan kode di WordPress.

Aplikasi Kode terletak di dalam plugin Asisten dan memungkinkan Anda membuat, mengedit, dan mengelola cuplikan kode CSS dan JavaScript untuk situs web Anda. Dengan Aplikasi Kode, Anda dapat dengan mudah menambahkan cuplikan baru, menetapkannya ke bagian tertentu, dan mengontrol status aktivasinya. Fiturnya mencakup menduplikasi, mengekspor, dan menyimpan cuplikan ke perpustakaan (dengan Asisten Pro). Antarmuka intuitif memastikan peralihan cepat antara cuplikan yang diaktifkan dan dinonaktifkan, menyederhanakan proses penyesuaian situs web Anda.

Mari selami dan jelajahi beberapa fitur dan kemampuan inovatifnya:

Apa itu Aplikasi Kode Asisten?

Anda mungkin sudah mengetahui bahwa Anda dapat menyimpan cuplikan kode di Library Assistant Pro. Sekarang, dengan tambahan Aplikasi Kode, Anda dapat dengan mudah menambahkan, mengedit, dan mengelola cuplikan kode situs WordPress Anda, semuanya dalam plugin Asisten:

Aplikasi Kode menggantikan kebutuhan akan banyak plugin dan meningkatkan produktivitas Anda dengan menyimpan semua cuplikan kode situs web Anda di satu lokasi yang mudah diakses.

• Manajemen Cuplikan Kode Mudah: Kelola kode CSS dan JavaScript situs web Anda langsung di dalam Aplikasi Kode. Tidak perlu lagi menggunakan banyak alat dan platform, semua yang Anda butuhkan ada di ujung jari Anda.
• Simpan Cuplikan Kode di Assistant Pro Cloud: Aplikasi Kode Asisten terintegrasi secara mulus dengan akun Assistant Pro Anda, memungkinkan Anda menyimpan dan mengatur cuplikan kode di perpustakaan cloud. Sederhanakan alur kerja Anda dengan menggunakan kembali cuplikan kode dengan mudah di beberapa proyek situs web, sehingga menghemat waktu Anda yang berharga.
• Berkolaborasi dengan Tim Anda: Kolaborasi adalah kuncinya, dan Aplikasi Kode kami mempermudah bekerja dengan tim Anda. Dengan pengeditan real-time, Anda dapat berkolaborasi di situs WordPress Anda secara real-time, dan tetap sinkron dengan tim Anda di mana pun Anda berada.

Selain fitur-fitur ini, Aplikasi Kode Asisten juga menawarkan antarmuka yang ramping dan intuitif yang dirancang dengan mempertimbangkan pengembang. Baik Anda seorang profesional berpengalaman atau baru memulai, kami rasa Aplikasi Kode kami akan mudah dinavigasi dan mudah digunakan.

Cara Menambahkan Cuplikan Kode di WordPress

Aplikasi Kode Asisten menawarkan cara yang mudah untuk menyempurnakan situs web Anda dengan cuplikan CSS dan JavaScript khusus. Memulainya sederhana:

Langkah 1: Buka Aplikasi Kode di Asisten

Jika Anda belum melakukannya, silakan instal dan aktifkan plugin Asisten. Setelah terinstal, klik ikon pensil untuk membuka sidebar Asisten. Navigasikan ke Aplikasi & Pengaturan, lalu klik Kode di daftar Aplikasi:

Perhatikan bahwa jika Anda ingin ikon Aplikasi Kode ditampilkan di bar samping, Anda dapat menyusun ulang aplikasi dengan menyeret aplikasi Kode ke atas dalam daftar:

Langkah 2: Buat Cuplikan menggunakan Aplikasi Kode

Sekarang kita siap membuat cuplikan kode pertama kita. Dalam contoh ini, mari kita membuat file CSS dengan terlebih dahulu memastikan tab CSS dipilih, lalu memasukkan Judul, dan mengklik tombol kembali:

Di layar berikutnya, Anda akan melihat bahwa Aplikasi Kode menerima hal berikut:

• Judul: Ini adalah nama unik untuk cuplikan kode Anda.
• Deskripsi: Jelaskan untuk apa kode tersebut digunakan atau informasi penting lainnya yang perlu diingat oleh Anda atau tim Anda:

• Cuplikan Kode : Masukkan cuplikan kode Anda di blok kode:

Gulir ke bawah ke bagian Lokasi dan tetapkan status dan aturan pada cuplikan Anda:

• Status : Alihkan ke Mengaktifkan atau Menonaktifkan status cuplikan kode.
• Aturan : Pilih di mana Anda ingin memuat cuplikan ini. Ini terlihat mirip dengan aturan Lokasi Themer. Klik Tambahkan Aturan untuk mengaktifkan aturan tambahan.

Langkah 3: Klik Perbarui untuk Menyimpan Perubahan Anda

Setelah Anda selesai menambahkan cuplikan kode dalam Aplikasi Kode Asisten, klik tombol Perbarui yang terletak di sudut kanan atas untuk menyimpan perubahan Anda:

Selanjutnya, segarkan halaman Anda agar perubahan diterapkan.

Duplikat, Simpan ke Perpustakaan, Ekspor atau Hapus Cuplikan Kode

Setelah menambahkan cuplikan kode pertama Anda menggunakan Aplikasi Kode, mari jelajahi beberapa fitur tambahan. Gulir ke bawah melewati bagian Lokasi untuk menemukan opsi di bagian Tindakan:

Di sini, Anda dapat mengelola setelan cuplikan seperti mengaktifkan, menggandakan, mengekspor, atau menyimpan ke perpustakaan Anda dengan Asisten Pro, sehingga memberi Anda kontrol dan fleksibilitas lebih besar atas penyesuaian situs web Anda.

• Duplikat: Buat salinan persis dari cuplikan kode saat ini. Anda juga dapat mengklik ikon duplikat saat melihat tampilan Daftar jenis kode di Aplikasi Kode.
• Simpan ke Perpustakaan: Koneksi Assistant Pro diperlukan untuk menyimpan ke perpustakaan cloud. Saat Anda menyimpan cuplikan ke perpustakaan, lokasi yang Anda tetapkan untuk cuplikan tidak akan disimpan. Saat Anda mengimpor cuplikan dari perpustakaan, Anda perlu menetapkan cuplikan tersebut ke suatu lokasi.
• Ekspor: Mengekspor file cuplikan kode sebagai file .txt.
• Hapus: Ini akan menghapus cuplikan kode dari Asisten secara permanen. Anda akan melihat pesan konfirmasi untuk memastikan Anda ingin menghapus cuplikan tersebut. Tindakan ini tidak dapat dibatalkan.

Sekarang ketika Anda mengklik ikon Aplikasi Kode, Anda akan melihat semua cuplikan kode Anda dalam tampilan daftar dan semuanya di satu lokasi:

Perhatikan bahwa saat dalam tampilan daftar, Anda memiliki kemampuan untuk mengaktifkan dan menonaktifkan masing-masing cuplikan tanpa perlu mengedit masing-masing cuplikan secara terpisah, sehingga menghemat waktu dan tenaga Anda. Jika cuplikan dinonaktifkan, Anda akan melihat Dinonaktifkan dan jika diaktifkan, Anda akan melihat Diaktifkan dengan titik hijau. Anda dapat dengan cepat menggantinya dengan mengklik indikator tersebut.

Contoh Cuplikan Kode WordPress

Ada banyak cuplikan kode CSS dan JavaScript untuk WordPress yang biasa digunakan untuk meningkatkan fungsionalitas, elemen gaya, atau menambah interaktivitas ke situs web. Berikut beberapa contoh populer:

Cuplikan Kode CSS

• Font Khusus: Menerapkan font khusus menggunakan CSS, baik dari Google Font atau sumber lainnya.
• Styling Forms: Sesuaikan tampilan dan nuansa formulir di situs WordPress Anda.
• Sembunyikan Elemen: Kode CSS untuk menyembunyikan elemen atau bagian tertentu dari situs Anda.
• Animasi: Animasi atau transisi CSS untuk menambahkan efek visual ke elemen.
• Efek Melayang: Tambahkan efek melayang ke tombol, tautan, gambar, dll.
• Menyesuaikan Menu Navigasi: Gaya menu navigasi agar sesuai dengan desain dan tata letak situs Anda.
• Sticky Header/Footer: Membuat header atau footer menempel di bagian atas atau bawah halaman saat pengguna menggulir.
• Mode Gelap: Terapkan tema mode gelap untuk situs Anda menggunakan CSS.

Cuplikan Kode JavaScript

• Pengguliran Halus: Kode JavaScript untuk mengaktifkan pengguliran halus saat pengguna mengeklik tautan internal.
• Pemuatan Gambar yang Lambat: Terapkan pemuatan lambat untuk meningkatkan waktu pemuatan halaman dengan memuat gambar hanya saat diperlukan.
• Modal Windows: Membuat jendela modal atau pop-up untuk menampilkan konten atau pesan tambahan.
• Bagian Akordeon/Dilipat: Kode JavaScript untuk membuat bagian bergaya akordeon yang melebar atau menciut saat diklik.
• Alihkan Visibilitas: Kode JavaScript untuk mengubah visibilitas elemen pada halaman.
• Gulir Tak Terbatas: Memuat lebih banyak konten saat pengguna menggulir halaman ke bawah, tanpa mengharuskan mereka mengeklik tautan penomoran halaman.
• Menu Dropdown: Tingkatkan menu navigasi dengan fungsi dropdown menggunakan JavaScript.
• Slider/Carousel: Buat penggeser atau carousel gambar untuk menampilkan konten dengan cara yang menarik secara visual.
• Ajax Load More: Memuat konten tambahan secara dinamis tanpa memuat ulang seluruh halaman, berguna untuk blog atau portofolio.

Ini hanyalah beberapa contoh, dan masih banyak lagi cuplikan CSS dan JavaScript lainnya yang dapat Anda gunakan untuk menyesuaikan dan menyempurnakan situs WordPress Anda. Seperti biasa, pastikan untuk membuat cadangan situs Anda sebelum memulai dan pastikan bahwa kode apa pun yang Anda tambahkan telah diuji dengan benar dan tidak bertentangan dengan tema atau plugin yang ada.

Kesimpulan

Siap untuk membawa alur kerja desain web Anda ke tingkat berikutnya? Kunjungi tambahan terbaru plugin Asisten kami, Aplikasi Kode . Baik Anda sedang mengerjakan proyek WordPress berikutnya atau memecahkan masalah pengkodean, alat ini dirancang untuk menyederhanakan alur kerja Anda dan meningkatkan produktivitas.

Namun bukan itu saja – dengan akun Assistant Pro gratis, Anda akan membuka lebih banyak fitur untuk meningkatkan proses pengembangan Anda. Bergabunglah dengan sesama pengembang web untuk mendapatkan kembali waktu berharga dan mengatur proyek Anda dengan mudah. Jangan menunggu lebih lama lagi – daftar sekarang dan rasakan sendiri perbedaannya!