Cara membuat garis waktu di WordPress dengan Elementor

Garis waktu menyediakan cara visual untuk menampilkan acara, tonggak sejarah, atau langkah -langkah dalam urutan kronologis. Mereka membantu menyajikan informasi dalam aliran linier yang memudahkan pengunjung dan pengguna untuk memahami urutan acara atau proses. Menggunakannya, Anda dapat memamerkan perjalanan perusahaan Anda, peta jalan proyek, atau kisah pribadi dengan kejelasan.

Menambahkan garis waktu ke WordPress dapat meningkatkan pengalaman pengguna dengan membuat konten lebih menarik dan lebih mudah diikuti. Inilah sebabnya mengapa menggunakan jadwal telah menjadi tren di banyak situs web. Elementor adalah plugin ramah pengguna yang dapat Anda gunakan untuk membuat dan menambahkan jadwal ke posting dan halaman WordPress Anda dengan tingkat kustomisasi yang ekstrem.

Dalam artikel ini, kami akan menunjukkan kepada Anda panduan langkah demi langkah tentang cara membuat garis waktu di WordPress dengan Elementor. Sebelum itu, kami akan membahas beberapa bagian teoretis mengenai topik hari ini.

Jenis jadwal dan kasus penggunaannya

Ada dua jenis jadwal - horizontal dan vertikal. Masing -masing memiliki kasus penggunaan khusus yang menambah nilai ke situs web secara berbeda. Mari kita jelajahi mereka dan kasus penggunaannya dalam diskusi di bawah ini.

1. Timeline vertikal

Garis waktu vertikal menampilkan acara dan informasi dari atas ke bawah, biasanya di sepanjang kiri atau tengah halaman. Ini adalah format ramah-gulir yang berfungsi mulus di desktop dan perangkat seluler. Saat pengguna menggulir halaman, mereka mengikuti urutan kronologis dalam tata letak yang bersih dan mudah dibaca.

Gunakan kasing untuk jadwal vertikal:

• Sejarah Perusahaan atau Perjalanan Pertumbuhan
• Lanjutkan atau sorotan karier
• Seri posting blog atau progresi artikel
• Penjelasan proses demi langkah
• Tonggak pengembangan produk

2. Timeline horizontal

Garis waktu horizontal menampilkan peristiwa dari kiri ke kanan, mengikuti format gulungan atau geser samping. Biasanya digunakan di mana ruang lebih lebar daripada tinggi. Format ini adalah yang terbaik untuk jadwal yang lebih pendek atau ketika Anda ingin menampilkan hanya beberapa acara penting dalam tata letak yang luas dan mudah dilihat.

Gunakan kasing untuk jadwal horizontal:

• Peta jalan proyek atau tahap perencanaan
• Jadwal acara
• Kampanye pemasaran atau peluncuran produk
• Presentasi Portofolio
• Jadwal pendidikan atau tinjauan sejarah

Cara membuat garis waktu di WordPress dengan Elementor

Seperti yang telah dikatakan, Elementor adalah plugin pembangun halaman drag-and-drop. Tetapi berita yang menyedihkan adalah tidak termasuk widget untuk membuat jadwal. Namun, plugin ini memiliki banyak addon yang dapat Anda kembangkan fungsionalitas plugin inti Elementor.

HappyAddons adalah salah satunya. Muncul dengan 130+ widget dan 22+ fitur yang dapat mengatasi banyak kekurangan Elementor. Jadi, dengan menginstal plugin HappyAddons, Anda dapat mengaktifkan lebih banyak fitur desain di situs Anda. Dalam banyak kasus, Anda bahkan tidak akan membutuhkan Elementor Pro jika Anda memiliki HappyAddons.

Sekarang mari kita jelajahi cara membuat jadwal di WordPress dengan Elementor dan HappyAddons.

Cara membuat garis waktu horizontal di WordPress

Semoga Anda sudah tahu apa garis waktu horizontal. HappyAddons memiliki widget timeline horizontal , yang benar -benar bebas digunakan. Jadi, Anda perlu plugin berikut untuk diinstal dan diaktifkan terlebih dahulu di situs web Anda.

• Elementor
• Happyaddons

Setelah plugin Anda diinstal dan diaktifkan di situs Anda, mulailah mengikuti langkah -langkah yang dijelaskan dalam tutorial di bawah ini.

Langkah 01: Buat bagian di Canvas Elementor

Buka posting atau halaman dengan Elementor. Buat bagian dengan struktur kolom Flexbox yang Anda inginkan untuk membuat garis waktu.

Langkah 02: Tambahkan widget timeline horizontal ke kanvas

Temukan widget garis waktu horisontal pada panel Elementor. Setelah Anda menemukannya, seret-dan-letakkan widget ke kanvas.

Anda akan melihat widget timeline horisontal telah ditambahkan ke kanvas dengan tata letak default.

Langkah 03: Pilih preset untuk widget

Preset adalah gaya desain atau tata letak yang telah ditentukan sebelumnya yang dapat Anda terapkan secara instan ke widget untuk kustomisasi cepat. Jika Anda tidak ingin mendesain widget dari awal, Anda dapat memilih preset. Widget Timeline Horisontal dilengkapi dengan enam preset.

Pilih preset yang Anda suka untuk widget.

Langkah 04: Tambahkan konten ke widget Timeline Horisontal

Perluas bagian Timeline . Di sini, Anda akan mendapatkan opsi untuk menambahkan konten ke widget. Secara default, Anda akan mendapatkan empat tab. Klik tab apa pun untuk memperluasnya. Ini akan membuka banyak bidang di mana Anda dapat menempatkan dan menambahkan informasi yang Anda inginkan.

Setelah tab diperluas, Anda dapat menambahkan tanggal acara, ikon, gambar, resolusi gambar, judul, dan deskripsi ke tab masing -masing.

Anda dapat melihat bahwa kami telah menambahkan konten ke bagian masing -masing dari widget horizontal.

Dengan cara yang sama, tambahkan konten ke semua tab Timeline. Anda dapat melihat bahwa kami telah melakukannya pada gambar yang terlampir di bawah ini.

Untuk menambahkan lebih banyak tab ke widget, klik tombol + Tambah Item di bawah tab Timeline.

Langkah 05: Mengkonfigurasi Pengaturan untuk Widget Garis Waktu Horisontal

Setelah bagian konten selesai, perluas bagian Pengaturan di bawah tab Konten. Anda dapat mengonfigurasi tab HTML Judul, penyelarasan konten, menyembunyikan panah konten, mengaktifkan LightBox, kecepatan animasi, jumlah slide untuk ditampilkan, ikon, dan banyak lagi.

Ini sangat mudah dikonfigurasi. Kami harap Anda bisa melakukannya sendiri.

Langkah 06: Stylize The Horizontal Timeline Widget

Untuk gaya widget, buka tab Gaya pada panel Elementor.

Pertama, perluas bagian timeline .

Anda akan mendapatkan opsi untuk menyesuaikan ketebalan garis, warna garis, jarak tanggal, tipografi tanggal, warna, ikon, jari -jari perbatasan, jenis perbatasan, lebar perbatasan, warna latar belakang, dll.

Jelajahi mereka dan lakukan kustomisasi yang diperlukan.

Anda dapat melihat bahwa kami telah membuat beberapa perubahan pada garis waktu horizontal.

Kemudian, perluas bagian panah . Dari sini, Anda dapat menyesuaikan ikon panah, posisi mereka, ukuran, lebar perbatasan, jari -jari, dan banyak lagi .

Dengan cara yang sama, perluas bagian konten dari tab Gaya. Anda dapat menyesuaikan jari -jari perbatasan, bantalan, ruang antara isi, jenis perbatasan, lebar perbatasan, warna, bayangan, tipografi, dan lebih banyak widget.

Lakukan perubahan yang diperlukan.

Langkah 07: Pratinjau widget Timeline Horizontal

Buka halaman pratinjau dan periksa apakah semuanya berfungsi dengan baik atau tidak. Anda dapat melihat bahwa timeline horizontal demo kami berfungsi dengan baik tanpa gangguan.

Cara membuat garis waktu vertikal di WordPress

Sementara HappyAddons memungkinkan Anda untuk membuat timeline horizontal secara gratis, Anda harus meningkatkan ke versi premium plugin untuk membuat garis waktu vertikal. Jadi, pastikan plugin berikut tersedia di situs Anda.

• Elementor
• Happyaddons
• HappyAddons Pro

Setelah tersedia di situs Anda, mulailah mengikuti tutorial yang dijelaskan di bawah ini.

Langkah 01: Seret-dan-tandurkan widget timeline ke kanvas Elementor

Ketik garis waktu di kotak pencarian. Pilih widget Timeline selain dari timeline horizontal. Seret-dan-letakkan di kanvas Elementor.

Garis waktu vertikal akan dibuat di kanvas dengan tata letak default.

Langkah 02: Pilih preset untuk widget Timeline Vertikal

Semoga Anda sudah tahu apa itu preset, karena kami telah membahasnya di atas. Pilih preset jika Anda tidak ingin merancang timeline vertikal dari awal.

Langkah 03: Tambahkan konten ke timeline vertikal

Perluas bagian Timeline . Secara default, Anda akan melihat dua tab. Perluas tab apa pun dengan mengkliknya seperti yang kami tunjukkan di atas.

Semoga Anda tidak perlu banyak bicara di sini. Karena Anda dapat menambahkan jenis konten yang hampir sama ke timeline vertikel seperti yang dapat Anda lakukan dalam kasus garis waktu horizontal.

Anda dapat menambahkan ikon, mengubah jenis ikon, menentukan waktu, mengatur judul, menambahkan gambar, dll., Untuk setiap bagian timeline. Lakukan hal -hal yang bagus sendiri.

Lengkapi konten penambahan ke timeline. Anda bahkan dapat menambahkan lebih banyak item ke timeline dengan mengklik + Tambah Item seperti yang ditunjukkan di atas.

Langkah 04: Mengkonfigurasi Pengaturan untuk Widget Timeline Vertikal

Perluas bagian Pengaturan . Anda dapat mengonfigurasi apakah akan menunjukkan tanggal, waktu, panah konten, dan pengguliran pohon . Anda juga dapat mengubah tag judul, penyelarasan kotak ikon, penyelarasan pohon, dan warna latar belakang .

Lakukan pengaturan Neeful sendiri. Tetapi bagi kami, penyelarasan default terlihat bagus. Jadi, kami akan tetap melakukannya untuk tutorial.

Langkah 05: Gaya widget timeline vertikal

Datanglah ke tab Gaya di panel Elementor. Anda dapat menyesuaikan semua jenis konten dan elemen visual pada widget dari tab ini.

Pertama, perluas kotak konten . Anda dapat menyesuaikan tipografi, warna, warna panah, jenis latar belakang, jenis perbatasan, dan lebar perbatasan dari sini. Lakukan ini.

Dengan cara yang sama, perluas bagian kotak ikon . Anda dapat mengubah lebar, tinggi, ruang kotak, dan opsi lain yang terkait dengan ikon pada widget dari sini. Jika Anda puas dengan gaya default, jangan menyentuh apa pun.

Stylize judul widget jika terasa perlu. Anda dapat melihat bahwa kami telah mengubah tipografi kami.

Dengan cara yang sama, sesuaikan penampilan waktu & tanggal . Kami telah mengubah warna, berat, dan tipografinya.

Terakhir, perluas bagian tombol . Anda dapat mengubah warna latar belakangnya, menyalin tipografi, dan lainnya .

Langkah 06: Pratinjau widget timeline vertikal

Datanglah ke halaman pratinjau dan periksa apakah garis waktu vertikal berfungsi dengan baik atau tidak. Lakukan dengan menggulir widget. Kami berharap ini akan bekerja dengan baik di pihak Anda sebagai milik kami.

Dengan demikian, Anda dapat membuat berbagai jenis bagian timeline di situs web Anda untuk menyajikan berbagai konten yang luar biasa.

Hal -hal yang dapat Anda lakukan lebih banyak dengan happyaddons

HappyAddons jujur ​​adalah plugin yang komprehensif. Anda pasti akan jatuh cinta dengan plugin ini setelah menggunakannya sekali. Lihatlah hal -hal berikut yang dapat Anda lakukan dengan plugin.

A. Gunakan pembangun tema gratis

Elementor juga memiliki pembangun tema. Tapi itu hanya disediakan untuk pengguna premium. Tetapi dalam kasus HappyAddons, itu benar -benar gratis untuk digunakan. Menggunakan pembangun tema HappyAddons, Anda dapat membuat header, footer, templat posting blog, dan halaman arsip. Periksa cara membuat template posting blog dengan happyAddons secara gratis.

B. WooCommerce-friendly

HappyAddons hadir dengan sembilan widget ramah WooCommerce yang kuat untuk meningkatkan situs eCommerce Anda. Widget -widget tersebut adalah kisi produk, korsel produk, kisi kategori produk, korsel kategori produk, produk tunggal, keranjang mini, keranjang, checkout, dan bar pengiriman.

C. Cross-domain Copy-paste

Dengan fitur ini, Anda dapat secara langsung menyalin widget, bagian, dan halaman yang sama dari satu situs web ke domain lain. Ini dapat menghemat waktu yang berharga karena Anda tidak selalu harus memulai dari awal. Video berikut menjelaskan fitur copy-domain-domain plugin.

D. Desain konten kreatif

Dengan widgetnya seperti gambar melayang, tautan animasi, faktor menyenangkan, grup tumpukan gambar, tumpukan foto, tombol kreatif, gulungan teks, dan ikon Lord, Anda dapat membuat konten kreatif yang menarik untuk mengaitkan pengguna.

e. Tunjukkan informasi statistik

Tidak seperti banyak add-on elementor lainnya, plugin ini menawarkan beberapa widget bagan yang dengannya Anda dapat menampilkan informasi statistik dan membuat posting dan halaman infografis. Pelajari cara membuat halaman infografis dengan Elementor.

Selain semua ini, ada banyak hal lagi yang dapat Anda lakukan dengan plugin HappyAddons.

Pikiran terakhir!

Membuat jadwal bukanlah hal yang wajib untuk semua situs web. Tetapi mereka mungkin menjadi perlu karena mereka bisa menjadi pilihan yang ideal untuk menampilkan informasi dan konten tertentu. Jadi, setiap kali Anda merasa perlu membuat garis waktu, kami berharap posting tutorial ini akan mulai digunakan.

Jika Anda menyukai posting ini, kami meminta Anda untuk memberi tahu kami melalui kotak komentar di bawah ini. Selain itu, jika Anda memiliki pertanyaan tentang plugin HappyAddons, Anda dapat meninggalkan pesan di kotak obrolan. Agen dukungan langsung kami akan datang untuk menanggapi Anda sesegera mungkin.

Terima kasih telah bersama kami sampai akhir. Semoga hari Anda menyenangkan.