Unduh 5 Gambar Perbatasan GRATIS untuk Divi

Itu selalu bagus untuk memiliki sumber daya tambahan yang dapat Anda gunakan saat membangun situs web baru untuk diri sendiri atau untuk klien. Itu sebabnya kami memastikan Anda menerima paket tata letak baru setiap minggu. Tetapi ada sumber daya lain yang mungkin berguna juga, seperti "gambar batas" atau gambar yang dapat Anda gunakan di satu sisi atau yang lain dari elemen desain Divi untuk menambahkan gaya yang berkembang. Menggunakan opsi bawaan Divi bersama dengan gambar perbatasan ini dapat memberikan hasil yang menakjubkan. Dalam posting ini, kami telah memberi Anda 5 gambar perbatasan berbeda yang dapat Anda unduh secara gratis di bawah ini. Kami akan menjelaskan bagaimana Anda dapat menggunakan gambar perbatasan ini untuk keuntungan Anda dan membuat hasil akhir yang menakjubkan.

Mari kita lakukan!

Pratinjau

Mari kita lihat gambar perbatasan yang berbeda yang dapat Anda unduh lebih jauh di bawah posting ini. Untuk setiap bentuk, Anda akan menemukan 4 versi: atas, bawah, kiri dan kanan. Gambar-gambar ini akan memungkinkan Anda untuk mencapai hasil yang sama persis seperti yang ditunjukkan pada empat gambar pertama di bawah ini:

Unduh File Gambar GRATIS

Untuk mendapatkan gambar perbatasan gratis, Anda harus mengunduhnya terlebih dahulu menggunakan tombol di bawah ini. Untuk mendapatkan akses ke unduhan, Anda harus berlangganan daftar email Divi Daily kami dengan menggunakan formulir di bawah ini. Sebagai pelanggan baru, Anda akan menerima lebih banyak kebaikan Divi dan paket Tata Letak Divi gratis setiap hari Senin! Jika Anda sudah ada dalam daftar, cukup masukkan alamat email Anda di bawah ini dan klik unduh. Anda tidak akan "berlangganan ulang" atau menerima email tambahan.

Unduh File

Unduh Gratis

Bergabunglah dengan Divi Newsletter dan kami akan mengirimkan email kepada Anda salinan Paket Tata Letak Halaman Arahan Divi terbaik, ditambah banyak sumber daya, tip, dan trik Divi yang luar biasa dan gratis. Ikuti dan Anda akan menjadi master Divi dalam waktu singkat. Jika Anda sudah berlangganan cukup ketik alamat email Anda di bawah ini dan klik unduh untuk mengakses paket tata letak.

UNDUH

Anda telah berhasil berlangganan. Silakan periksa alamat email Anda untuk mengonfirmasi langganan Anda dan dapatkan akses ke paket tata letak Divi mingguan gratis!

Mendekati

• Setelah Anda mengunduh dan membuka zip folder yang berisi semua 5 gambar perbatasan, Anda akan menemukan 4 subfolder: batas atas, batas bawah, batas kiri dan batas kanan
• Ini berarti ada total 20 file gambar yang tersedia untuk Anda gunakan
• Nanti di posting ini, Anda akan menemukan pengaturan yang menyertainya yang cocok dengan masing-masing sisi perbatasan
• Untuk melengkapinya, Anda dapat menggabungkan gambar perbatasan dengan overlay gradien
• Hamparan warna ini akan membantu Anda membuat gambar tampak semarak atau sehalus yang Anda inginkan
• Anda bebas menggunakan gambar perbatasan ini tanpa batasan apa pun, bahkan untuk tujuan komersial

Membuat Desain Keseluruhan

Tambahkan Bagian Baru

Jarak

Mari kita mulai dengan membuat keseluruhan desain yang telah kita gunakan untuk menampilkan gambar perbatasan. Buka halaman baru atau yang sudah ada, tambahkan bagian reguler baru dan tambahkan beberapa bantalan khusus:

• Padding Atas: 300px
• Padding Bawah: 300px

Tambahkan Baris Baru

Struktur Kolom

Lanjutkan dengan menambahkan baris baru ke bagian Anda menggunakan struktur kolom berikut:

Perekat

Tanpa menambahkan modul apa pun, buka pengaturan baris, buka pengaturan Ukuran dan buat baris lebar penuh.

• Jadikan Baris Ini Lebar Penuh: Ya

Tambahkan Modul Teks Judul ke Kolom 1

Tambahkan Kotak Konten H2

Mari mulai menambahkan beberapa modul! Modul pertama yang dibutuhkan adalah Modul Teks. Tambahkan satu ke kolom pertama dan tambahkan salinan H2 pilihan Anda ke kotak konten.

Pengaturan Teks Judul

Kemudian, buat beberapa perubahan pada pengaturan teks H2 di tab Desain.

• Judul 2 Font: Abril Fatface
• Judul 2 Ukuran Teks: 80px (Desktop), 70px (Tablet), 50px (Telepon)

Jarak

Lanjutkan dengan menambahkan beberapa margin ke bagian atas Modul Teks ini.

• Margin Atas: 150px

Tambahkan Modul Teks Tautan ke Kolom 1

Tambahkan Tautan ke Kotak Konten

Tepat di bawah judul Modul Teks yang baru saja Anda tambahkan, lanjutkan dan tambahkan Modul Teks baru. Kami menggunakan Modul Teks ini sebagai tombol jadi pastikan Anda menambahkan tautan ke CTA.

Pengaturan Teks Tautan

Selanjutnya, ubah pengaturan teks tautan di tab Desain.

• Berat Huruf Tautan: Sangat Tebal
• Gaya Font Tautan: Huruf Besar
• Warna Teks Tautan: #000000
• Ukuran Teks Tautan: 21px

Jarak

Tambahkan beberapa margin atas untuk membuat ruang antara Modul Teks ini dan yang sebelumnya juga.

• Margin Atas: 100px

Berbatasan

Terakhir, tambahkan batas bawah yang halus ke tautan Modul Teks.

• Lebar Batas Bawah: 1px
• Warna Batas Bawah: #333333

Tambahkan Modul Teks Deskripsi ke Kolom 2

Pengaturan Teks

Kolom kedua hanya membutuhkan deskripsi Modul Teks. Setelah menambahkan konten ke kotak konten, terapkan pengaturan teks berikut:

• Ukuran Teks: 22px (Desktop), 20px (Tablet), 18px (Ponsel)
• Tinggi Baris Teks: 2.6em
• Orientasi Teks: Justify

Perekat

Buat pengaturan Ukuran juga cocok dengan ukuran layar yang berbeda:

• Lebar: 82% (Desktop), 100% (Tablet & Ponsel)

Jarak

Dan terakhir, tambahkan beberapa margin atas dan bawah.

• Margin Atas: 100px
• Margin Bawah: 100px

Menambahkan Bentuk Perbatasan

Pengaturan Latar Belakang Perbatasan Kiri

Sekarang setelah kita menyelesaikan desain keseluruhan, kita dapat mulai menambahkan gambar perbatasan! Kita akan mulai dengan sisi perbatasan kiri. Temukan gambar perbatasan pilihan Anda di folder 'Perbatasan Kiri' dan unggah sebagai gambar latar bagian. Kemudian, terapkan pengaturan gambar latar belakang berikut:

• Ukuran Gambar Latar Belakang: Ukuran Sebenarnya
• Posisi Gambar Latar Belakang: Kiri Tengah
• Pengulangan Gambar Latar Belakang: Tidak Ada Pengulangan

Pengaturan Latar Belakang Perbatasan Kanan

Atau, Anda dapat menemukan gambar perbatasan pilihan Anda di folder 'Perbatasan Kanan' dan menambahkannya sebagai latar belakang bagian menggunakan pengaturan berikut:

• Ukuran Gambar Latar Belakang: Ukuran Sebenarnya
• Posisi Gambar Latar Belakang: Kanan Tengah
• Pengulangan Gambar Latar Belakang: Tidak Ada Pengulangan

Pengaturan Latar Belakang Perbatasan Atas

Hal yang sama berlaku untuk gambar batas atas, tetapi sebagai gantinya, gunakan pengaturan latar belakang berikut:

• Ukuran Gambar Latar Belakang: Ukuran Sebenarnya
• Posisi Gambar Latar Belakang: Tengah Atas
• Pengulangan Gambar Latar Belakang: Tidak Ada Pengulangan

Pengaturan Latar Belakang Perbatasan Bawah

Atau, last but not least, Anda dapat menemukan gambar batas bawah di folder 'Bottom Border' dan menggabungkannya dengan pengaturan latar belakang bagian ini:

• Ukuran Gambar Latar Belakang: Ukuran Sebenarnya
• Posisi Gambar Latar Belakang: Tengah Bawah
• Pengulangan Gambar Latar Belakang: Tidak Ada Pengulangan

Padukan Warna Menggunakan Hamparan Semitransparan

Untuk setiap bentuk batas yang disertakan, Anda dapat memutuskan untuk menambahkan hamparan warna juga. Overlay ini membantu Anda membuat gambar perbatasan terlihat lebih halus. Untuk menambahkan overlay, buka pengaturan bagian Anda dan tambahkan latar belakang gradien di atas gambar latar belakang perbatasan.

• Warna 1: #ffffff
• Warna 2: rgba (255,255,255,0.36)
• Arah Gradien: 141deg
• Tempatkan Gradien Di Atas Gambar Latar Belakang: Ya

Pratinjau

Sekarang setelah kita melalui semua langkah, mari kita lihat akhir beberapa desain potensial yang dapat Anda capai menggunakan gambar perbatasan gratis ini.

Pikiran Akhir

Dalam posting ini, kami telah membagikan 5 gambar perbatasan berbeda yang dapat Anda unduh secara gratis. Anda dapat menggunakan gambar perbatasan ini untuk situs web apa pun yang sedang Anda kerjakan tanpa batasan apa pun. Kami mendorong Anda untuk mencoba semuanya dan membuat desain yang menakjubkan. Jika Anda memiliki pertanyaan atau saran, pastikan Anda meninggalkan komentar di bagian komentar di bawah!