Plugin untuk operasi latar belakang WordPress. Mengedit background pada template WordPress blog WordPress dengan background transparan

blog WordPress dapat diubah dengan berbagai cara, dan bahwa perubahan ini sebenarnya sedang dilakukan dalam kode file PHP terletak dalam folder tema desain aktif di blog.

Sekarang perhatikan blog Anda secara kritis. Segera akan banyak perbedaan, karena pada prinsipnya, Anda dapat mengubah apa pun yang Anda inginkan sendiri. Tentu saja, Anda hanya perlu tahu cara melakukannya.

Di panel admin

Buka panel admin di Penampilan - Editor ... Anda sudah tahu apa yang bertanggung jawab atas banyak templat, tetapi sekarang Anda tidak akan tertarik dengan templat, tetapi pada apa yang ada di bawahnya: Gaya... Lebih tepatnya, satu bagian dari mereka, yang disebut Daftar Gaya.

File tersebut cocok dengan daftar ini style.css ... File ini terletak di blog di folder tema aktif. Anda selalu dapat menemukannya di sana.

Di browser

Buka saja milik Anda di browser Anda. Kebanyakan browser memiliki fitur yang bagus: Anda dapat mengklik kanan pada area manapun di blog dan memilih dari daftar operasi Lihat kode barang ... Sebuah jendela muncul di bagian bawah tempat Anda dapat menemukan informasi menarik tentang item yang Anda klik.

Di jendela ini kiri Anda akan melihat kode halaman dan sebuah baris akan disorot dalam kode itu. sesuai dengan elemen yang diberikan. SEBUAH di sebelah kanan, dalam gaya, akan ada properti elemen ini.

Ukuran font, indentasi, warna teks dan latar belakang, perataan: semuanya dalam gaya dan semua ini bisa diubah.

Ubah warna latar belakang

Di blog WordPress, saya pribadi tidak suka jika latar belakang artikel dan latar belakang lainnya berbeda. Dalam hal ini, artikel dalam umpan berada dalam blok terpisah dan, menurut saya, tidak terlihat bagus. Kami akan membuat background dimana-mana sama dengan background artikel. Klik pada background yang ingin kita ubah, dengan tombol mouse sebelah kanan, pilih View element code. Kami akan tertarik dengan garis yang akan disorot sebagai hasil di sebelah kanan nama atribut kelas ... Gaya ditulis oleh kelas.

Pada kasus ini class \u003d art-layout-cell Artinya dalam gaya, dalam file style.css, juga akan ada kelas seperti itu, dan properti sudah akan ditulis di dalamnya. Hanya saja tampilannya akan berbeda yaitu:

.art-layout-cell, dan kemudian properti kelas ini akan ditulis dengan tanda kurung kurawal.

Temukan kelas dengan nama ini di file style.css... Mari gunakan fungsi pencarian Ctrl + F, dan tulis nama di kotak pencarian: art-layout-cell... Kami akan segera melihat latar belakang:

background-color: Transparan. Transparan cara transparan .

Sekarang, warna apa yang kita butuhkan? Di mana saya bisa mendapatkan warna latar belakang artikel kita? Kali ini akan kami gunakan fSCapture... Di dalamnya. antara lain, di antara kotak alat yang dapat Anda temukan pipet yang menentukan warna area manapun di layar monitor Anda. Alat yang sangat berguna!

Buka program FSCapture, buka Pengaturan , dan pilih alatnya Pipet layar ... Klik pada area yang diinginkan di layar. Di jendela Hex Anda akan melihat kode warna yang Anda butuhkan: D2E8EE

Anda memasukkannya ke dalam gaya art-layout-cell alih-alih sepatah kata pun Transparan .

Lihat apa yang terjadi. Masih banyak pekerjaan yang harus diselesaikan, tetapi sebuah permulaan telah dibuat.

Video tentang. cara mengedit background di blog WordPress

Informasi lebih rinci dapat ditemukan di bagian "Semua kursus" dan "Kegunaan", yang dapat diakses melalui menu atas situs. Pada bagian ini, artikel dikelompokkan berdasarkan topik ke dalam blok yang berisi informasi paling detail (sejauh mungkin) tentang berbagai topik.

Anda juga dapat berlangganan blog, dan mempelajari semua artikel baru.
Tidak perlu banyak waktu. Cukup klik tautan di bawah ini:

Latar belakang adalah gambar yang menampilkan semua elemen situs. Atau mungkin bukan gambar, tapi warna solid atau gradien.

Kebanyakan template tidak mendukung pengaturan dan pengubahan latar belakang. Namun, tidak semua tema mampu melakukan ini, terutama dalam hal salinan gratis. Tetapi bahkan jika Anda memiliki templat seperti itu yang diinstal di situs Anda, di mana Anda dapat mengubah latar belakang WordPress di pengaturan, itu akan menjadi operasi yang sangat sedikit, karena perubahan akan segera diterapkan di seluruh situs. Tidaklah mungkin untuk mengubah latar belakang dalam template biasa hanya untuk beberapa posting, kategori atau halaman.

Pada artikel ini, kami akan memberi tahu Anda tentang dua plugin sederhana yang menyelesaikan masalah ini dalam beberapa klik.

Latar Belakang Per Halaman

Ini adalah plugin paling sederhana yang memungkinkan Anda memanipulasi background WordPress Anda. Setelah menginstal dan mengaktifkannya, tidak ada pengaturan dan item tambahan dari panel kontrol situs yang akan muncul. Hanya di halaman setiap posting dan halaman akan ada opsi baru yang memungkinkan Anda menambahkan gambar latar belakang satu per satu.

Beberapa efek dapat diterapkan pada gambar yang dipilih untuk latar belakang WordPress:

  • Pilih ulangi - horizontal atau vertikal;
  • Buat gambar dapat digulir dengan situs atau diperbaiki, yang disebut;
  • Pilih orientasi latar belakang WordPress - kanan, kiri, tengah;
  • Pilih warna isian biasa daripada gambar.

Plugin ini gratis. Selain itu, setiap latar belakang WordPress yang diunggah dapat diedit di editor bawaan pengaya ini.

Gambar Latar Belakang Layar Penuh Pro

Dan plugin ini lebih sulit untuk digunakan, ini memungkinkan Anda untuk melakukan lebih banyak pekerjaan dengan latar belakang WordPress. Itu dibayar dengan biaya $ 13. Setelah menginstal aktivasi plugin, item menunya akan muncul di panel admin. Ini berisi galeri latar belakang, di sini Anda dapat menambah, menghapus, dan mengedit gambar kapan saja.

Selain itu, Anda dapat mengatur latar belakang WordPress untuk setiap posting atau halaman, mengidentifikasinya dengan ID, untuk halaman utama, kategori apa pun, halaman arsip, dan bahkan halaman 404.

Kemampuan luas dari plugin ini dilengkapi dengan fungsi yang ada pada yang pertama - pada halaman untuk menambahkan setiap halaman dan posting, opsi ditambahkan untuk mengatur gambar latar belakang tertentu, dengan editor dan segala macam efek.

Secara keseluruhan, alat yang hebat untuk membuat latar belakang WordPress. Baik plugin berbayar dan gratis cocok untuk banyak tugas yang terkait dengan ini.

Baru-baru ini saya berbicara tentang solusi untuk - selain menggunakan CSS dan Javascript, 2 plugin WordPress juga mengatasi tugas ini. Salah satunya yang akan saya bahas lebih detail hari ini adalah Background Manager. Tidak setiap tema memiliki pengaturan untuk mengubah latar belakang situs dan tidak setiap pengguna dapat menyesuaikannya melalui gaya di templat. Selain itu, modul tersebut memiliki beberapa fungsi tambahan yang menarik, sehingga diputuskan untuk mempelajarinya lebih detail.

Perbarui 11/8/2018: Sayangnya, modul tersebut belum diperbarui untuk waktu yang lama, dan sekarang telah benar-benar hilang dari repositori Direktori Plugin resmi. Baca artikel atau lihat pemilihan plugin.

Anda dapat menemukan modul di halaman ini atau menginstalnya berdasarkan nama dari area admin WordPress. Pada saat tulisan ini dibuat, itu dianggap cukup tua, sejak itu versi yang didukung berakhir dengan 3.7.8. Sayangnya, plugin tersebut mungkin tidak didukung saat ini. Namun, saya telah berhasil mengujinya pada sistem terbaru versi 4.2.1. Selain itu, 30 ribu unduhan tidak ditemukan di setiap modul.

Tugas utama plugin Background Manager adalah menampilkan latar belakang acak untuk setiap pengunjung baru atau membuat slideshow dari beberapa gambar. Sejujurnya, awalnya saya berpikir bahwa modul ini hanya akan membantu saya membuat latar belakang yang dapat diklik, tetapi fungsinya agak lebih beragam. Ini memungkinkan Anda untuk:

  • membuat kumpulan gambar yang gambarnya akan disisipkan sebagai latar belakang situs. Anda dapat mengunduhnya dari mesin lokal Anda, perpustakaan media WordPress, atau modul lainnya;
  • menentukan posisi latar belakang, "replikasinya" (jika itu adalah pola);
  • pola hamparan di latar belakang;
  • lihat gambar penuh setelah mengunduh, dan tidak menunggu sampai secara bertahap muncul dari atas ke bawah (jika Anda menggunakan Internet lambat);
  • mengatur tampilan latar belakang pada halaman tertentu: utama, seksi, arsip atau posting;
  • tambahkan link untuk background dengan perhitungan statistik konversi melalui Google Analytics.

Seperti yang Anda lihat, satu set opsi yang sangat menarik. Ini secara global tentang kemungkinan, tetapi modul Background Manager penuh dengan segala macam detail. Jadi, misalnya, Anda dapat memilih transparansi pola yang dilapiskan, menentukan efek saat beralih di antara gambar dalam tayangan slide, dll.

Di luar pengaturan modul Anda akan menemukan di bagian "Penampilan" - "Latar Belakang". Ngomong-ngomong, di sini muncul situasi bahwa Anda mungkin memiliki dua item menu dengan nama yang sama sekaligus. Jika Anda ingat, beberapa tema WordPress memiliki pengaturan ini. Jadi plugin Background Manager sepenuhnya kompatibel dengannya dan Anda dapat mengelolanya di bagian ini.

Tapi lebih baik pergi ke "Latar Belakang", yang hanya mewakili pengaturan modul. Di halaman ini, Anda hanya akan melihat banyak pengaturan yang berbeda.

Namun, langkah pertama adalah membuat satu set gambar untuk latar belakang - klik tautan " Tambahkan Kumpulan Gambar Baru". Anda dapat melihat set yang tersedia di tab "Image Sets".

Seperti yang saya katakan, ada banyak pengaturan di sini, yaitu:

  • prinsip memilih gambar untuk latar belakang - secara acak, dll;
  • menampilkan gambar yang berbeda setiap kali atau menyimpannya di sesi browser;
  • warna latar belakang;
  • menampilkan latar belakang dalam layar penuh atau "replikasi";
  • overlay pola di atas gambar;
  • anda dapat menambahkan tombol Pin It dari Pinterest dan menentukan sejumlah opsi lain.

Terakhir, perlu dicatat bahwa terkadang masalah dapat muncul dengan menampilkan latar belakang. Jika Anda memiliki penetapan yang ketat atau penggantian latar belakang di template CSS Anda, plugin Manajer Latar Belakang mungkin tidak berfungsi. Misalnya, di satu situs, misalnya, gambar dengan mudah dimuat dan diganti properti latar belakang dalam gaya, tetapi di blog ini saya harus mengomentarinya secara khusus. Sulit untuk mengatakannya pada apa. Inilah yang terjadi pada akhirnya.

Secara keseluruhan, Background Manager adalah plugin keren yang memungkinkan Anda menampilkan gambar berbeda untuk latar belakang situs web Anda dan bahkan membuat slideshow darinya. Untuk beberapa proyek, ini bisa menjadi elemen "dekoratif" yang bagus.

Adapun link dari background di Background Manager. Ada opsi serupa di pengaturan dan Anda dapat menentukan tautan untuk setiap gambar. Saya menguji fungsi ini dan semuanya tampak berfungsi pada saat penulisan ini. Namun, sekarang ada masalah dengan ini. Satu-satunya hal yang berhasil kami lakukan adalah menempatkan tautan dalam elemen khusus - lihat ikon [+] pada gambar di atas. Fitur plugin ini bekerja tanpa masalah.


Hari ini dalam praktik saya, saya menemukan fakta bahwa untuk latar belakang menu itu perlu diletakkan transparansi... Ada opsi, tentu saja, untuk melakukannya menggunakan gambar.png, tetapi masih memutuskan untuk menggali dan melakukannya latar belakang semi transparan dengan CSS... Ternyata cukup sederhana :)

Dalam kode-html kita menulis sebuah "kelas" yang memerlukan transparansi tertentu:

FON (latar belakang: rgba (200, 54, 54, 0.5);)

jadi, saya menentukan warna latar belakang dengan mengatur nilai untuk tiga warna primer (merah - r, hijau - g, biru - b), dan transparansi latar belakang 50% (alfa - sebuah) oleh satu properti. Nilai warna ditentukan dalam rentang 0 hingga 255, dan untuk transparansi, rentang akan dari 0,0 hingga 1,0

Properti rgba juga berlaku untuk semua elemen lainnya. Namun jika perlu menyetel transparansi untuk semua elemen di kelas ini, Anda dapat menggunakan properti kegelapan, yang mengatur transparansi untuk seluruh elemen atau seluruh halaman. maka kodenya akan terlihat seperti ini:

FON (opasitas: 0,5;)

Dalam hal ini, semua elemen di kelas ini, termasuk gambar dan teks akan transparan.

Berlangganan dan terima artikel bermanfaat melalui surat!

Artikel keren lainnya di blog kita

  • Saya tahu bahwa dalam praktiknya sering kali ada situasi yang membuat pemilik situs "menghapus" atau membuat situs "dari awal" beberapa kali, dan akibatnya tidak mendapatkan hasil yang diinginkan. Dalam hal ini, berikut ...
  • Materi afiliasi! Karena fokus konstan mesin pencari langsung pada pengguna Internet itu sendiri dan indikator pembaruan terbaru pada algoritma Google, menjadi lebih penting bagi pemilik situs untuk memperhatikan kecepatan pemuatan mereka ...
  • Lihat, jika tugas Anda adalah "mengembangkan situs web siap pakai" - ikuti tautan ini dan delegasikan tugas tersebut kepada kami. Jika Anda memerlukan contoh tugas teknis - lihat artikel "Kerangka Acuan untuk pembuatan ...
  • Materi afiliasi! - Apakah Anda ingin mempublikasikan artikel Anda? Bagi banyak pemilik situs web, SEO tampak seperti tugas yang menakutkan. Sebenarnya, hal ini tidak benar. Menarik spesialis berkualifikasi tinggi ke promosi bisa sangat ...