Tutorial Utama untuk Modul Paragraf Drupal

Selama beberapa bulan terakhir kami telah bekerja dengan lebih banyak situs Drupal 8. Semua proyek itu memiliki satu kesamaan ... mereka menggunakan modul Paragraf Drupal.

Paragraphs adalah modul yang sangat populer untuk menangani konten di Drupal 8.

Paragraf bekerja dengan cara yang mirip dengan bidang konten, tetapi juga menyediakan berbagai opsi untuk desain, tata letak, dan pengelompokan konten Anda.

Jika Anda ingin mempelajari Paragraf, ini adalah panduan utama! Baca, tonton, dan ikuti semua 10 bagian dari tutorial ini. Pada akhirnya, Anda juga akan menggunakan Paragraphs untuk semua situs Anda!

Bagian 1. Mengapa menggunakan modul Paragraf Drupal?

Jenis Paragraf dapat berupa apa saja, mulai dari blok teks atau gambar sederhana hingga tayangan slide yang kompleks dan dapat dikonfigurasi.

Alih-alih menempatkan semua konten mereka dalam satu bidang isi WYSIWYG, pengguna akhir dapat memilih dengan cepat di antara Jenis Paragraf yang telah ditentukan sebelumnya. Anda dapat membuat beberapa fitur lanjutan dan pengguna akhir dapat memilih mana yang ingin mereka gunakan.

Ini memudahkan pengguna untuk menambahkan konten lanjutan. Misalnya, pengguna mungkin memahami cara menambahkan kutipan tarik ke dalam isi konten, tetapi mungkin tidak berakhir di tengah atau diformat dengan benar. Mereka mungkin juga ingin melakukan sesuatu yang lebih kompleks seperti menyertakan kotak info di dalam artikel, tetapi tidak tahu cara menambahkan gaya yang diperlukan.

Modul Paragraf Drupal dapat membuat proses seperti ini jauh lebih mudah dikelola untuk pengguna non-teknis sementara juga memberi pengembang kemampuan untuk mengontrol pemformatan dan tampilan elemen yang diformat khusus di tingkat tema.

Dalam praktiknya, Paragraphs memungkinkan kita untuk menyisipkan elemen seperti bidang konten, tetapi alih-alih menambahkannya di sekitar isi konten tertentu, elemen tersebut secara efektif dimasukkan ke seluruh isi.

Untuk panduan ini, kami akan membayangkan kami membuat situs web yang disebut "Saran Hidup Gratis", yang menawarkan konten informasi dalam bentuk artikel. Anda dapat mengikuti situs web pengembangan lainnya jika Anda mau, membuat penyesuaian kecil seperlunya.

Bagian 2. Memasang Modul Paragraf Drupal

Kami merekomendasikan menggunakan situs uji Drupal 8 kosong untuk proyek ini.

• Klik di sini untuk mengunduh modul Paragaphs.
• Paragraf juga membutuhkan modul Revisi Referensi Entitas.
• Setelah Anda mengunduh kedua modul ini dan menempatkannya di direktori /modules Anda, instal untuk situs Anda.

Bagian #3. Membuat Paragraf Pertama Anda

Paragraphs bekerja dengan memungkinkan kita untuk membuat apa yang disebut "Paragraphs types" yang dalam kasus kita secara kolektif akan menggantikan bidang Body dari setiap jenis konten yang kita inginkan untuk menggunakan jenis Paragraphs ini.

Untuk mulai memanfaatkan Paragraf, Anda harus terlebih dahulu membuat setidaknya satu tipe Paragraf, lalu Anda harus menambahkan tipe Paragraf tersebut ke tipe konten. Proses ini mungkin tampak membingungkan pada awalnya, tetapi mudah untuk membiasakan diri setelah Anda menyiapkan satu atau dua jenis Paragraf.

Dalam demonstrasi kami, kami akan mengganti bidang Badan dari jenis konten Artikel default dengan beberapa jenis Paragraf.

Penting: Jika Anda menguji ini di situs yang sudah memiliki konten tipe Artikel, jangan hapus bidang Body tipe konten Artikel seperti yang akan kita lakukan dalam demonstrasi ini. Jika Anda melakukannya, Anda akan kehilangan isi semua Artikel di situs web Anda. Jika Anda bekerja di situs di mana tipe konten Artikel telah digunakan, Anda harus membuat tipe konten baru untuk menguji modul Paragraf.

Di situs "Saran Hidup Gratis", kami akan mulai mengonfigurasi Paragraf dengan mengedit jenis konten Artikel.

• Pergi ke Struktur > Jenis konten.
• Klik tombol "Kelola bidang" di baris Artikel.
• Anda sekarang akan berada di halaman "Kelola bidang" untuk jenis konten Artikel. Di halaman ini, klik panah tarik-turun di sebelah tombol “Edit” pada baris Isi, dan klik Hapus.
• Konfirmasi penghapusan di halaman berikutnya.

Sekarang kita akan membuat jenis Paragraf pertama kita.

• Arahkan ke Struktur> Jenis paragraf.
• Klik "Tambahkan jenis paragraf."
• Pada halaman berikutnya, kita perlu memberikan label untuk jenis paragraf ini. Untuk demonstrasi kami, kami akan menyebutnya "Teks isi", karena kami akan menggunakannya sebagai isi konten kami.
• Klik "Simpan dan kelola bidang."
• Pada halaman "Kelola bidang" ini, klik "Tambah bidang".
• Di daftar tarik-turun "Tambah bidang baru" berikut, gulir ke bawah, dan di bawah "Teks", pilih "Teks (diformat, panjang, dengan ringkasan)". Ini mirip dengan bidang Badan default yang sering digunakan oleh tipe konten Artikel—area teks bentuk panjang dengan editor WYSIWYG.
• Pada halaman "Tambah bidang" berikut, kami akan memberi label bidang khusus ini "Teks isi" juga.
• Klik "Simpan dan lanjutkan."
• Selanjutnya kita dibawa ke tab "Pengaturan bidang" bidang ini. Untuk salah satu bidang ini, kami dapat menentukan jumlah nilai yang diizinkan. Mungkin berguna untuk mengizinkan lebih dari 1 nilai untuk beberapa bidang—khususnya yang menerima potongan informasi individual, seperti tanggal, file gambar, atau bidang teks bentuk pendek untuk informasi seperti nama—tetapi untuk area teks bentuk panjang , seringkali tidak perlu memberikan nilai tambahan karena paragraf dapat dengan mudah ditempatkan satu demi satu dalam satu area teks. Dalam contoh ini, biarkan pengaturan default di "Terbatas" dan 1.
• Klik "Simpan pengaturan bidang."
• Pada halaman “Body text settings for Body text” berikut, kita dapat menyimpan semua defaultnya. Perhatikan bahwa pengguna masih akan memiliki semua opsi pemformatan yang biasanya mereka lakukan dengan editor WYSIWYG area teks. Kami tidak mengambil apa pun dari mereka. Apa yang akan kami lakukan sebagai gantinya adalah memberi mereka metode tambahan yang ditingkatkan untuk menambahkan jenis elemen tertentu ke konten mereka.
• Klik "Simpan pengaturan."
• Anda sekarang akan melihat bidang baru Anda di dalam Jenis Paragraf baru Anda:

• Di halaman berikutnya ini, klik tab "Kelola tampilan".
• Saat ini jenis Paragraf ini hanya memiliki satu bidang—bidang teks Isi. Kami tidak ingin label muncul bersama teks dari bidang ini, jadi pilih "Tersembunyi" di bawah kolom Label untuk bidang ini. Format harus tetap sebagai Default.
• Klik "Simpan."

Sekarang kita perlu menambahkan tipe Paragraf ini ke tipe konten Artikel agar tipe konten tersebut dapat menggunakannya. Inilah cara kami melakukannya:

• Arahkan ke Struktur > Jenis konten.
• Klik "Kelola bidang" untuk jenis konten Artikel.
• Klik “Tambahkan bidang.”
• Untuk menggunakan jenis Paragraf baru kami dengan bidang ini, buka daftar tarik-turun "Pilih jenis bidang" dan pilih "Paragraf" di bawah "Revisi referensi."
• Setelah memilih "Paragraf", berikan label "Tubuh" karena inilah yang kami gunakan sebagai isi konten kami.
• Klik "Simpan dan lanjutkan."
• Pada halaman berikutnya, "Jenis item untuk referensi" harus diatur ke "Paragraf".
• “Jumlah nilai yang diizinkan harus “Tidak terbatas.” Dengan memilih “Tidak terbatas”, kita dapat menyisipkan bidang khusus yang disediakan oleh jenis Paragraf yang kita konfigurasikan sebanyak yang kita inginkan. Ini akan membantu ketika kita mulai memasukkan hal-hal lain selain teks ke dalam isi konten.
• Klik "Simpan pengaturan bidang."
• Pada halaman “Body text settings for Article” berikut, kita perlu membuat jenis Paragraph yang kita buat sebelumnya tersedia untuk field ini. Untuk melakukannya, centang kotak di samping "Teks isi" di bawah "Ketik", di dekat bagian bawah halaman. Inilah cara kami membuat jenis Paragraf tertentu tersedia di bidang ini. Saat kami menambahkan lebih banyak jenis Paragraf ke situs kami, kami dapat kembali dan menyediakannya untuk bidang ini juga.

• Klik "Simpan pengaturan," dan situs akan membawa Anda kembali ke halaman "Kelola bidang" untuk jenis konten.

Sekarang kita telah selesai mengganti bidang Body sebelumnya (default) dengan bidang Body baru kita, yang menggunakan Paragraphs, dan khususnya jenis Paragraphs “Body text” yang kita buat. Sekarang kita akan mengkonfigurasi beberapa pengaturan lagi sehingga muncul seperti yang kita inginkan.

• Untuk memulai, kami akan mengklik tab “Kelola tampilan formulir” sehingga kami dapat menempatkan bidang Badan baru di lokasi yang menonjol pada halaman pembuatan konten untuk Artikel.
• Pada halaman ini, gulir ke bawah untuk menemukan bidang Badan baru kami, dan seret ke dekat bagian atas daftar, tepat di bawah Judul.
• Klik "Simpan."

Sekarang kita perlu memastikan Jenis Paragraf baru tersedia di tempat yang tepat untuk pengunjung situs.

• Klik "Kelola tampilan".
• Sekali lagi Anda akan menemukan Tubuh di bagian bawah. Seret ini di dekat bagian atas, tepat di bawah Gambar. Kami akan memperlakukan bidang gambar itu sebagai semacam besar pengantar atau gambar utama untuk Artikel kami dan bukan bagian dari konten itu sendiri.
• Klik "Simpan."

Pada titik ini, kami telah menyelesaikan pengaturan untuk jenis konten Artikel kami menggunakan bidang Paragraf baru ini. Sekarang saatnya membuat beberapa konten untuk mengujinya.

• Buka halaman Konten situs Anda, dan klik "Tambahkan konten".
• Klik "Artikel".
• Anda dapat memasukkan judul apa saja untuk artikel Anda. Untuk contoh ini, sebut saja artikel kita “Cara Mendapatkan 100 Teman”.
• Sekarang, ke bidang Body, Anda mungkin telah memperhatikan bahwa itu terlihat sedikit berbeda, meskipun masih menggunakan bidang bentuk panjang yang sama dengan editor WYSIWYG seperti sebelumnya. Perbedaannya sekarang adalah bahwa kami memiliki bidang Body yang mencakup yang saat ini berisi satu bidang teks Body. Tepat di bawah bidang teks Badan, Anda akan melihat tombol "Tambahkan teks Badan", yang memungkinkan kita untuk menambahkan beberapa bidang. Pada titik ini, itu tidak perlu karena bidang teks panjang yang saat ini digunakan sangat cocok untuk memasukkan teks multi-paragraf yang panjang, jadi kita tidak perlu menambahkan bidang tambahan ketika kita bisa menambahkan lebih banyak teks di bidang yang sama . Namun, nanti, kita akan melihat bahwa menambahkan bidang Paragraf tambahan menjadi sangat berguna bila Anda telah menerapkan beberapa jenis Paragraf di situs Anda. Untuk saat ini, cukup masukkan satu atau dua paragraf teks ke dalam bidang teks Tubuh Anda.

Simpan artikel Anda dan lihat halaman seperti yang akan dilihat oleh pengunjung mana pun.

Pada titik ini, Badan baru yang menggunakan Paragraf terlihat tidak berbeda dengan artikel yang menggunakan bidang Badan default. Namun, dengan Paragraphs, kami akan segera dapat mengizinkan pembuat konten kami untuk menambahkan elemen tambahan ke konten tanpa harus tahu cara menatanya dengan benar.

Bagian #4. Menambahkan CSS Anda ke Paragraf

Bagian besar dari apa yang membuat Paragraphs sangat berguna adalah kita dapat menulis CSS untuk elemen dalam konten tertentu sehingga pembuat konten tidak perlu mencoba menata secara manual karena banyak dari elemen ini sendiri menggunakan editor WYSIWYG atau CSS sebaris. Ini berarti kita akan menyesuaikan tema situs kita untuk membuat elemen-elemen ini muncul persis seperti yang kita inginkan.

Dalam banyak kasus dunia nyata, Anda mungkin akan bekerja dengan tema atau subtema khusus Anda sendiri, dalam hal ini Anda dapat mengeditnya dengan bebas. Untuk tutorial ini, kita akan membuat subtema cepat dan mudah dari tema Bartik default sehingga kita dapat mengikuti praktik terbaik dan menambahkan CSS kita sendiri tanpa mengedit Bartik itu sendiri. (Kami menghindari mengedit Bartik—atau tema inti atau kontribusi lainnya—secara langsung karena jika kami melakukannya dan kemudian menerapkan pembaruan yang dirilis ke tema itu, modifikasi kami sendiri akan hilang.) Jika Anda tidak terbiasa membuat subtema, tidak apa-apa. Kami tidak menggali ke dalam proses secara ekstensif tetapi sebaliknya membuat salinan langsung dari tema, yang kemudian akan kami terapkan beberapa perubahan kecil. Ini adalah proses yang mudah.

• Untuk membuat subtema, pertama-tama Anda harus mengakses server tempat situs Anda di-host, dan menavigasi ke direktori root situs Anda.
• Sesampai di sana, buka direktori "tema". Di sinilah semua tema dan subtema kustom dan kontribusi ditempatkan. Di direktori "tema" ini, buat folder baru bernama "custombartik," dan navigasikan ke direktori baru ini.

Sekarang kita perlu menambahkan beberapa file ke direktori baru ini. Yang pertama adalah file info tema. Buka perangkat lunak pengedit kode apa pun yang Anda gunakan untuk pengembangan web. File info ini memerlukan beberapa informasi: nama proyek (nama tema kami), jenis proyek ("tema" dalam kasus ini), nama mesin dari tema dasar jika ini adalah subtema (seperti milik kami adalah), deskripsi singkat, dan versi utama Drupal (7.x, 8.x, dll.) untuk tema tersebut dibuat. Kami akan memasukkan informasi ini dalam formulir berikut (ketik semuanya persis seperti yang Anda lihat):

 name: Custom Bartik type: theme base theme: bartik description: A custom theme based on the core Bartik theme core: 8.x

Pastikan nama tema dasar "bartik" tetap tidak menggunakan huruf besar—ini adalah nama yang dapat dibaca mesin peka huruf besar/kecil yang kita butuhkan. Dengan memasukkan informasi ini, simpan file sebagai "custombartik.info.yml". Penting bahwa Anda menyimpannya dengan nama yang sama persis dengan folder yang Anda buat diikuti dengan ".info.yml".

Sekarang kita perlu membuat file perpustakaan tema kita, di mana kita akan memberi tahu Drupal di mana menemukan CSS tema dan versi tema apa ini. Lebih banyak informasi dapat diberikan, tetapi hanya ini yang kami butuhkan untuk tujuan kami.

• Buka file baru. Dalam file ini, perhatikan baik-baik lekukan di sini. Setiap lekukan harus berupa tab dua spasi.
• Masukkan informasi berikut persis seperti yang muncul:

 global-css:  version: 0.1  css:    theme:      css/style.css: {}

• Simpan file ini sebagai "custombartik.libraries.yml". File ini pada dasarnya memberi tahu situs web bahwa ini adalah versi 0.1 dari tema (kami dapat memberikan ini nomor versi apa pun) dan bahwa akan ada lembar gaya yang terletak di dalam direktori tema kami (“custombartik”) di css/style.css.

Sekarang kita perlu kembali ke file info kita untuk memberi tahu Drupal agar menggunakan informasi di bawah wadah "global-css" untuk menemukan stylesheet kita.

• Buka file custombartik.info.yml Anda, tambahkan baris kosong di bawah baris “core: 8.x” Anda, lalu tambahkan baris informasi berikut, sekali lagi pertahankan lekukan persis seperti yang muncul di bawah ini:

 libraries:  - custombartik/global-css

Seluruh file sekarang akan terlihat seperti ini:

 name: Custom Bartik type: theme base theme: bartik description: A custom theme based on the core Bartik theme. core: 8.x libraries:  - custombartik/global-css

Pada titik ini, kami siap untuk menambahkan dua file ini ke tema kami.

• Unggah atau salin file custombartik.info.yml dan custombartik.libraries.yml Anda ke dalam folder custombartik Anda.
• Sekarang tambahkan folder bernama "css" di dalam folder custombartik Anda.
• Silakan buat file kosong bernama "style.css" dan unggah ke direktori ini. Ini akan menjadi stylesheet kita.
• Namun, sebelum kita membuat stylesheet, navigasikan ke halaman "Tampilan" situs web Anda.
• Gulir ke bagian bawah halaman, dan di bawah bagian “Uninstalled theme”, Anda akan melihat tema Custom Bartik Anda. Jika Anda tidak melihatnya, pastikan folder custombartik Anda dan semua filenya ada di folder tema sistem file situs Anda.
• Klik "Instal dan atur sebagai default" di bawah tema khusus Anda sehingga situs Anda akan mulai menggunakan tema Anda.
• Setelah ini selesai, navigasikan ke beranda Anda, dan itu akan terlihat hampir persis seperti tema Bartik default Drupal, dengan pengecualian bahwa Anda mungkin akan melihat ikon gambar rusak menggantikan logo Drupal. Temanya terlihat seperti Bartik karena yang kami buat adalah subtema dari Bartik tanpa penyesuaian. Jika situs Anda tidak terlihat seperti Bartik, dan terutama jika terlihat seperti HTML biasa tanpa gaya CSS, kembali ke dua file .yml Anda dan pastikan keduanya terlihat persis seperti yang dicetak di atas.

Terakhir, untuk memperbaiki gambar logo yang rusak, kami akan menyalin logo langsung dari Bartik ke subtema kami. Tidak apa-apa karena kami sebenarnya tidak mengubah apa pun di Bartik.

• Arahkan ke direktori root situs Anda, dan buka core/themes/bartik. Di sini, Anda akan melihat file bernama "logo.svg".
• Salin file ini ke subtema Anda (direktori "custombartik").
• Di situs web Anda, navigasikan ke Konfigurasi> Kinerja, dan klik "Hapus semua cache." Sekarang logo akan muncul di situs Anda.

Bagian #5. Menata Bidang Paragaph Anda

Sekarang kita memiliki subtema yang dapat kita edit dengan aman, kita dapat mulai mengatur aturan penataan untuk elemen konten kita yang dikontrol oleh Paragraphs. Sebelum kita melakukannya, kita harus membuat tipe Paragraphs baru yang membutuhkan aturan styling khusus. Kami akan mengikuti contoh kami memiliki bidang yang menyisipkan gambar terpusat di tengah-tengah artikel.

• Arahkan ke Struktur> Jenis paragraf.
• Klik "Tambahkan jenis paragraf."
• Kami akan menetapkan label untuk yang ini sebagai "Gambar di tengah".
• Klik "Simpan dan kelola bidang."
• Di halaman berikutnya, klik "Tambah bidang," dan pilih "Gambar" di bawah "Tambah bidang baru."
• Kami akan memberi label bidang ini "Gambar tengah" juga.
• Klik "Simpan dan lanjutkan."
• Di halaman berikutnya, kami dapat mempertahankan semua nilai default, jadi klik "Simpan pengaturan bidang."
• Kemudian, pada halaman “Pengaturan gambar di tengah untuk gambar di tengah”, kami akan menambahkan beberapa batasan sederhana. Atur resolusi gambar Maksimum ke 650x450 dan resolusi minimum ke 50x50. Setel ukuran unggahan maksimum menjadi 1 MB, dan klik "Simpan pengaturan." Pengaturan khusus ini tidak diperlukan agar jenis Paragraf berfungsi dengan baik; kami menyertakan mereka hanya untuk meniru skenario dunia nyata.

• Sekarang klik pada tab "Kelola tampilan", atur label gambar Terpusat sebagai "Tersembunyi," dan klik "Simpan."

Pada titik ini, kita perlu menambahkan tipe Paragraf ini ke bidang Paragraf yang kita miliki di tipe konten Artikel kita.

• Pergi ke Struktur > Jenis konten.
• Klik "Kelola bidang" di sebelah "Artikel".

Anda mungkin tergoda untuk mengklik "Tambah bidang" di sini untuk jenis Paragraf "Gambar tengah" baru kami, tetapi ingat, ini akan bercampur dengan bidang Badan khusus kami. Jadi, sebagai gantinya, kita akan menambahkan gambar Centered ke bidang Body yang kita buat.

• Klik "Edit" di sebelah "Tubuh", dan gulir ke bagian bawah halaman.
• Di sini Anda akan melihat "Gambar tengah" tersedia di bawah jenis Paragraf "Teks isi" kami.
• Centang kotak di sebelah "Gambar tengah" untuk membuatnya tersedia untuk bidang ini, dan simpan pengaturan Anda.

Sekarang kita akan menambahkan gambar menggunakan bidang ini.

• Arahkan ke halaman Konten Anda, dan edit artikel “Cara Mendapatkan 100 Teman” Anda.
• Mari kita bayangkan kita ingin menambahkan gambar terpusat di suatu tempat di tengah artikel kita. Di bawah bidang teks Badan, Anda akan melihat lagi tombol "Tambahkan teks Badan" untuk menambahkan bidang teks Badan lain dalam bidang Badan ini. Namun, jika Anda mengklik panah tarik-turun di sebelah tombol ini, Anda akan melihat bahwa "Gambar tengah" sekarang juga tersedia. Klik tombol ini, dan pilih beberapa file gambar untuk diunggah di sini. Kemudian berikan beberapa teks alternatif, karena itu diperlukan.

Sekarang kami telah menambahkan gambar ke konten kami, tetapi saat ini ditempatkan di bawah semua teks. Di sinilah kita akan menggunakan bidang teks Badan tambahan.

• Klik "Tambahkan teks Badan." Sekarang kita memiliki, dari atas ke bawah, bidang teks isi, gambar di tengah, dan bidang teks Badan lainnya. Perhatikan bahwa, meskipun Anda tidak perlu melakukannya pada saat ini, Anda dapat dengan bebas memindahkannya melalui panah seret dan lepas di kiri atas masing-masing bidang Paragraf. Agar gambar di tengah tampak terjepit di antara teks artikel, cukup buka bidang teks Badan pertama, pilih teks apa pun yang Anda ingin tampilkan setelah gambar, dan potong teks itu dari bidang. Kemudian gulir ke bawah dan rekatkan potongan teks itu ke bidang teks Badan kedua (setelah gambar Anda).
• Klik "Simpan."

Ketika Anda melihat artikel Anda sekarang, itu masih tidak akan terlihat benar. Karena kami belum menambahkan aturan gaya apa pun ke tema kami, gambar kemungkinan akan melayang ke kiri (seperti secara default), daripada di tengah. Namun, itu akan muncul setelah teks bidang teks Badan pertama dan sebelum teks bidang teks Badan kedua. Sekarang kami memiliki artikel di mana kami dapat menguji beberapa aturan gaya kustom.

Bagian #6. Mengontrol Paragraf dengan CSS

Kami akan pergi ke subtema kustom kami sekarang untuk mulai menata output dari bidang Paragraf yang telah kami buat. Untuk saat ini, kami akan menargetkan bidang "Gambar tengah" secara khusus, daripada bidang Paragraf yang mencakup dari jenis konten. Kami melakukan ini karena kami ingin bidang ini dipusatkan kapan saja, di mana pun itu. Jadi, dengan menetapkan aturan secara langsung untuk "Gambar tengah", kami menghindari pengaturan beberapa aturan yang tidak perlu untuk beberapa konteks.

Namun, kita perlu menargetkan kelas "simpul", karena akan ada, secara default, beberapa gaya untuk bidang ini yang ditargetkan di bawah kelas "simpul". Jadi, kita harus mengesampingkan aturan itu.

• Buka stylesheet subtema “custombartik” Anda di custombartik/css/style.css.
• File seharusnya masih kosong, tetapi sekarang kita akan mulai menambahkan aturan ke dalamnya. Kami akan menjaga hal-hal sederhana untuk saat ini. Tambahkan baris kode berikut ke stylesheet Anda:

 .node .field--name-field-centered-image {  float: none;  text-align: center; } .node .field--name-field-centered-image img {  max-width: 100%;  max-height: 450px; }

Dengan set aturan pertama, kami hanya memusatkan gambar secara horizontal di dalam kelas bidangnya dan memastikan tidak ada teks atau apa pun yang mengapung di sebelahnya. Kumpulan aturan kedua tidak sepenuhnya diperlukan, tetapi merupakan beberapa kode umum untuk memastikan gambar tidak menjadi lebih besar dari yang seharusnya dalam kaitannya dengan area konten.

• Setelah Anda menambahkan ini ke file style.css Anda, simpan perubahan Anda (mulai dari sini dan seterusnya, referensi apa pun untuk menyimpan perubahan di subtema Anda juga mengasumsikan mengunggah atau menyalin file ke server Anda jika Anda tidak mengedit langsung di server pada di mana situs pengujian Anda berada).
• Kemudian di situs Anda, navigasikan ke Konfigurasi> Kinerja, dan klik "Hapus semua cache" untuk memuat perubahan tema di situs Anda.
• Navigasikan kembali ke artikel tempat Anda menambahkan gambar untuk dipusatkan (atau segarkan halaman jika Anda sudah membukanya).

Gambar yang ditempatkan melalui jenis Paragraf "Gambar tengah" sekarang harus dipusatkan tanpa teks melayang di kedua sisinya. Mungkin ada gaya lebih lanjut yang ingin kami tambahkan, tetapi untuk tujuan tutorial ini, kami telah melakukan apa yang ingin kami lakukan saat ini—pastikan bahwa output dari bidang ini dikontrol secara ketat oleh CSS sehingga pengguna menambahkan konten tidak harus menata apa pun sendiri menggunakan editor WYSIWYG atau metode penataan sebaris lainnya.

Bagian #7. Paragraf Dengan Beberapa Bidang

Kami juga dapat membuat jenis Paragraf yang terdiri dari beberapa bidang.

Misalnya, alih-alih jenis "Gambar di tengah", kita dapat membuat jenis "Gambar di tengah dengan teks", yang akan terdiri dari bidang unggah gambar dan bidang teks yang menyertainya untuk setiap elemen dari jenis itu. Ini juga membantu kami menghilangkan beban tata letak dari mereka yang menambahkan konten ke situs sehingga kami dapat mengontrol tampilan konten di tingkat tema.

Mari kita buat tipe "Gambar di tengah dengan keterangan" ini untuk mempraktikkan proses pembuatan tipe Paragraf multi-bidang. Seperti yang Anda harapkan, proses ini akan serupa dengan membuat tipe bidang tunggal.

• Arahkan ke Struktur> Jenis paragraf, dan klik "Tambahkan jenis paragraf."
• Beri label jenis ini "Gambar tengah dengan teks", dan klik "Simpan dan kelola bidang."
• Klik “Tambahkan bidang.”

Karena bidang "Gambar tengah" yang kami buat sebelumnya persis seperti yang kami inginkan untuk bagian gambar dari jenis Paragraf baru kami, alih-alih membuat bidang baru, kami dapat menggunakan kembali yang sebelumnya. Jadi, jangan pilih apa pun di bawah "Tambah bidang baru" di halaman "Tambah bidang".

• Di bawah "Gunakan kembali bidang yang ada", pilih "Gambar: bidang_pusat_gambar".
• Simpan label "Gambar tengah", dan klik "Simpan dan lanjutkan."
• Kita perlu mengonfigurasi pengaturan untuk batas ukuran gambar di halaman berikutnya. Mari kita sekali lagi memasukkan resolusi gambar maksimum 650x450 piksel, dan minimum 50x50 piksel. Setel ukuran unggahan maksimum menjadi 1 MB.
• Klik "Simpan pengaturan."

Sekarang kita akan menambahkan bidang lain. Ingatlah bahwa kita masih berada di dalam pengaturan untuk jenis Paragraf baru kita, jadi setelah kita menambahkan bidang kedua ini, "Gambar di tengah dengan keterangan" akan menjadi satu jenis dengan dua bidang.

• Klik "Tambah bidang," dan tambahkan bidang baru dengan jenis "Teks (polos)".
• Beri label pada bidang ini "Keterangan".
• Klik "Simpan dan lanjutkan."
• Beberapa teks yang lebih panjang mungkin perlu melebihi batas default 255 karakter, jadi ubah panjang maksimum untuk bidang ini menjadi 500. Pertahankan jumlah nilai yang diizinkan pada "Terbatas" dan 1, dan simpan pengaturannya.
• Default pengaturan teks berikut semuanya baik-baik saja, jadi simpan pengaturan di halaman itu juga.

Sekarang jenis Paragraf baru kita memiliki semua bidang yang dibutuhkan, jadi mari kita kendalikan tampilannya.

• Klik tab "Kelola tampilan" sehingga kami dapat menghapus label bidang, yang tidak diperlukan dalam kasus ini.
• Pilih "Tersembunyi" di bawah kolom "Label" untuk kedua bidang, dan klik "Simpan."
• Jika kedua bidang tersebut rusak, kami akan mengatur ulang sehingga bidang keterangan muncul setelah bidang gambar, tetapi karena kami menambahkan bidang keterangan terakhir, itu harus sudah diposisikan setelah bidang gambar, seperti yang kita inginkan. .

Sekarang kita akan menambahkan tipe baru ke tipe konten Artikel kita.

• Arahkan ke Struktur> Jenis konten, dan klik "Kelola bidang" untuk Artikel. Seperti halnya ketika kami menambahkan jenis Paragraf "Gambar tengah" pertama kami ke tipe konten, kami akan menambahkan jenis Paragraf baru ini dalam bidang Badan khusus kami daripada menambahkan bidang baru sama sekali.
• Pada halaman “Kelola bidang” untuk Artikel, klik “Edit” untuk Isi.
• Gulir ke bagian bawah halaman, dan centang kotak di samping "Gambar tengah dengan teks" untuk membuat jenis itu tersedia dalam bidang Badan ini.
• Klik "Simpan pengaturan."
• Sekarang jenis Paragraf baru ini akan tersedia bagi mereka yang menambahkan Artikel ke situs.

Mari kita lanjutkan dan buat artikel baru menggunakan bidang ini, dan kemudian kita akan menambahkan gaya kita untuk mengontrol tampilannya.

• Arahkan ke halaman Konten, klik "Tambahkan konten," dan klik "Artikel."
• Sebut saja artikel ini “Belajar Memainkan Instrumen Dapat Meningkatkan Kehidupan Anda”.
• Klik “Tambahkan teks Badan” untuk mulai menambahkan beberapa teks ke artikel. Masukkan satu atau dua paragraf teks ke dalam bidang ini.
• Kemudian, di bawah bidang teks Badan, klik panah tarik-turun di sebelah "Tambahkan teks Badan", dan pilih opsi "Tambahkan gambar di tengah dengan teks" yang baru tersedia. Perhatikan bahwa kita sekarang disajikan dengan dua bidang untuk input data, seperti yang diharapkan—bidang "Gambar tengah" dan "Keterangan" yang termasuk dalam jenis Paragraf ini.
• Unggah gambar apa pun ke dalam bidang gambar dan berikan beberapa teks alternatif.
• Kemudian ketik, "The Les Paul adalah salah satu gitar paling legendaris di rock and roll."

Sekarang kita akan menambahkan beberapa teks artikel lainnya setelah gambar dan keterangan.

• Di bawah jenis gambar dan keterangan Paragraf, klik "Tambahkan teks Badan" sekali lagi.
• Tambahkan satu atau dua paragraf teks lagi.
• Terakhir, klik "Simpan dan publikasikan."

Saat ini, tampilan "Gambar dan keterangan tengah" kami harus setengah benar. Karena kami menggunakan kembali bidang "Gambar tengah" sebelumnya, gambar itu sendiri seharusnya sudah berada di tengah seperti halnya bidang sebelumnya yang hanya terdiri dari gambar yang akan dipusatkan. Teks caption tentu saja belum memiliki aturan CSS, sehingga akan tampak rata kiri dan terlihat seperti teks artikel lainnya. Jadi, kita perlu menambahkan beberapa aturan ke tema kita untuk menata teks teks ini.

Kali ini, saat menulis CSS, kita akan menargetkan seluruh jenis Paragraf "Gambar di tengah dengan teks" dan kemudian menelusuri bidang teks dalam kelas itu, daripada menargetkan teks teks secara independen dari wadahnya, seperti yang kita lakukan sebelumnya dengan gambar terpusat. Kami akan mengambil pendekatan ini karena kami mungkin ingin menggunakan kembali bidang teks keterangan ini di tempat lain, dan kemungkinan dalam beberapa kasus kami ingin itu ditata secara berbeda (seperti disejajarkan ke kiri atau ke kanan daripada di tengah) dari cara ini jenis Paragraf tertentu.

Kami akan memusatkan teks keterangan kami karena gambar yang sesuai berada di tengah, dan untuk memberikan perbedaan visual antara teks ini dan teks artikel, kami akan membuatnya tebal (miring juga akan memberikan efek itu).

• Tambahkan baris kode berikut ke stylesheet Anda, dan simpan perubahan Anda:

{codecitation}.paragraph--type--center-image-with-caption .field--name-field-caption { font-weight: bold; perataan teks: tengah; }{kodesitasi}

• Kemudian, untuk melihat perubahan kami di situs, navigasikan ke Konfigurasi > Kinerja, dan hapus semua cache.
• Kembali dan segarkan artikel yang baru saja dibuat, dan Anda akan melihat aturan gaya baru yang berlaku. Teks keterangan sekarang harus dicetak tebal dan di tengah di bawah gambar.

Kita tentu saja dapat menerapkan beberapa gaya ke jenis Paragraf ini secara keseluruhan. Salah satu alasan untuk melakukan ini adalah untuk memisahkan elemen gambar/teks dari teks di sekitarnya dan membuatnya jelas secara visual bahwa itu harus dilihat sebagai satu kesatuan.

• Tambahkan kode berikut ke stylesheet Anda, dan simpan perubahan Anda:

{codecitation}.paragraph--type--center-image-with-caption { batas: 2px abu-abu solid; margin: 4 piksel 0; bantalan: 4px; }

Sekarang bersihkan cache situs Anda sekali lagi, dan segarkan halaman artikel. Gambar dan keterangan harus terlihat hampir sama; namun, sekarang seluruh unit gambar/teks dikelilingi oleh batas abu-abu dan memiliki margin kecil di sekitar bagian atas dan bawah. Kami dapat berbuat lebih banyak untuk meningkatkan estetika di sini (dan perbatasan kemungkinan tidak diperlukan), tetapi ini menunjukkan kemampuan kami untuk menyediakan gaya untuk komponen individual tipe Paragraf serta tipe Paragraf secara keseluruhan.

Sekarang jika pengguna non-teknis menambahkan konten ke situs dan ingin menyertakan gambar besar di tengah dengan keterangan, yang harus mereka lakukan adalah memilih bidang Paragraf ini saat mengedit artikel, mengunggah gambar, dan memasukkan teks ke bidang teks. Pemformatan akan diterapkan secara otomatis.

Bagian #8. Menggunakan Seluruh Node dalam Paragraf

Pada titik ini, kita telah melihat beberapa contoh penggunaan dasar Paragraf. Sekarang kita akan menangani contoh yang sedikit lebih maju: menggunakan Paragraphs untuk menempatkan seluruh simpul di dalam isi konten. Satu kasus penggunaan untuk ini adalah menempatkan informasi tambahan yang terkait tetapi berdiri sendiri di dalam salah satu artikel Anda (mirip dengan sesuatu seperti bagian "Tahukah Anda?" yang mungkin Anda lihat menyertai artikel majalah).

Sebagai contoh, kita akan membayangkan bahwa kita ingin memiliki opsi untuk menambahkan apa yang kita sebut "Kotak info" ke artikel kita, dan kita akan melakukannya dengan menempatkan konten pendek berjudul "Sejarah Singkat Harpa ” dalam artikel yang kami buat sebelumnya tentang belajar memainkan alat musik.

Pertama, kita perlu membuat tipe konten untuk "kotak info" ini.

• Arahkan ke Struktur> Jenis konten, dan klik "Tambahkan jenis konten."
• Kami akan memberi nama jenis konten ini "Kotak info".
• Untuk deskripsi, tulis “Informasi singkat yang digunakan untuk melengkapi artikel.”
• Click the “Display settings” tab, and uncheck “Display author and date information” because we don't want author and date information showing up within our Info box content.
• All of the rest of the default settings on this page should be fine. Click “Save and manage fields.”
• On the “Manage fields” page, we already have a basic long-form “Body” field, and this is all we want for this content type, since all pieces of content of this type should be short and simple. No changes are therefore necessary here. Click “Add field.”

Now that our content type has been created, we need to create the Paragraphs type that will reference it.

• Navigate to Structure > Paragraphs types, and click “Add paragraphs type.”
• Give this type the label “Info box.”
• On the “Manage fields” page, click “Add field".
• Beneath “Add a new field,” select “Content,” found under the “Reference” header.
• For the label, write “Info box,” and save.
• All defaults are fine on the next page, so click “Save field settings” there.
• On the next settings page, scroll down until you see the “Reference type” settings.
• Since we want to use this Paragraphs type to reference and display Info box nodes, check the box next to “Info box” beneath the “Content types” header. You can leave “Sort by” set to “None” because the field will autofill based on what we type and is not a list of all content of this type. Click “Save settings.”
• Back on the “Manage fields” page, click the “Manage display” tab.
• As we've been doing so far, we'll remove the label, so select “Hidden” under the label column for the Info box field.
• Then, because we want to display the entire Info box node whenever we choose to include an Info box in one of our articles, we need to select “Rendered entity” in the column labeled “Format.”
• Click “Save.”

It's time to make this Paragraphs type available to our Article content type.

• Navigate to Structure > Content types, and click the “Manage fields” button for the Article content type.
• As we've been doing, click “Edit” for the Body field.
• Scroll down and check the box next to “Info box” under the “Paragraph types” header.
• Save your settings.

With the structure side of this implementation complete, we'll now create some content to test it out. We'll start by adding our site's first “Info box.”

• Navigate to the “Content” page, and click “Add content.”
• Choose Info box.
• For the title, enter “A Short History of the Harp.”
• Enter two or three paragraphs of text into the Body field, and click “Save and publish.”

At this point we will divert briefly from Paragraphs. Currently the home page of our site lists all of our articles and info boxes, but we don't want the latter to appear on the homepage; we want them only placed within other articles. So, let's quickly edit the view for our homepage to exclude these pieces of content.

• You can either click the “Edit view” icon (which is displayed as a pencil icon) on the top right corner of the view area of the homepage.
• Navigate to Structure > Views, and edit the “Frontpage” view.
• On the view's settings page, next to the “Filter criteria” header, click “Add.”
• Select “Content type,” and then click “Apply (all displays).”
• For the filter criterion, select “Is not one of” under “Operator,” and under “Content types,” check “Info box.” Then click “Apply (all displays).” This, as you probably know, will exclude all content of type “Info box” from the Frontpage view.
• Back at the view's settings page, click “Save.”
• Now when you view the homepage of your site, you will no longer see the “A Short History of the Harp” info box.

Now we'll add our Info box to the “Learning to Play an Instrument” article.

• Scroll down to the bottom of the Body Paragraphs field (the larger field encompassing all individual Paragraphs fields).
• Click the dropdown arrow next to “Add Body text,” and select “Add Info box.” You can type in any piece of the title of your “A Short History of the Harp” Info box node into the autofill field, and that Info box should then be displayed as an option.
• Select it to include that Info box in the body of this article.

With the Info box now included in our Body, we need to place it where we want it.

• Drag and place it after the first Body text field and before the Centered image field.

With this new organization, we should probably have some text between the Info box and the Centered image. To simulate doing this in a real-world scenario, we'll cut some of our current text and paste it into a new Body text field, as opposed to arbitrarily adding text to the article.

• So that we have a field to paste our new text in, go ahead and click the “Add Body text” button beneath all of the Paragraphs fields.
• Then scroll to the first Body text field and select and cut one or two paragraphs of text from the field (making sure to leave at least some text in the field).
• Paste the cut text into the newly created (currently empty) Body text field.
• Once this is done, drag the new Body text field, and place it after the Info box field and before the Centered image field.
• Click “Save and keep published”.

Upon viewing the article, you'll see that the referenced Info box node is displayed in its entirety within the larger article. (If all you see is the title of the Info box node, that means you forgot to select “Rendered entity” in the Format column Paragraph type's “Manage Display” page.) As it currently is, the lack of styling on the referenced Info box is likely to be confusing to most viewers. We won't go through the task of applying additional CSS to these Info box references because we already now how to do that, but it is important to note that, in practice, these references should be styled to appear significantly different from the containing article. It should be made extremely clear—through the use of some combination of background color, borders, text size, and font family—that the information contained in the Info box is not part of containing article and is simply supplementary information.

Part #9. Using Field Layout with Paragraphs

Just as the Field Layout module can be used to control the layout of nodes, it can also be used to control the layout of individual Paragraphs types. In some cases, this can be a viable alternative to controlling the layout via CSS, depending on the situation and on the developer's (your) preference.

Important: As of this writing, Field Layout is an experimental module. As such, any implementation of Field Layout should be considered a risk. If you do decide to use the module during its experimental phase, it should be tested extremely thoroughly on a development site before being used on a production site. Otherwise, play it safe by considering this information useful for future situations after the module has graduated into non-experimental core.

Because Field Layout is a core module, it does not need to be downloaded.

• Begin by navigating to your site's Extend page.
• Select the Field Layout and Layout Discovery (a dependency) modules, and click “Install.”
• Then, if prompted, click “Continue.”

Let's use Field Layout to control the layout of a new Paragraphs type in which we create a two-column unit of “Pros and cons” information.

• Navigate to Structure > Paragraphs types, and add a new Paragraphs type.
• Give it the label “Pros and cons,” and add a field.
• For this field, select “Text (formatted, long),” and give this first field the label “Pros”.
• Save and continue, and keep all of the default settings through the next two pages.
• You are back at the “Manage fields” page. Add another field with a Text (formatted, long) input type, and label this one “Cons”.
• Save, and continue through the subsequent settings pages, once again keeping all default settings.
• Once you're back at the “Manage fields” page, click the “Manage display” tab. This time we will keep the label (positioned above, as is default) for each field so that when visitors are reading them, they know that we are listing pros and cons accordingly.

If we look below the listed fields, we will see a new group of settings called “Layout settings.” This is made available by the Field Layout module. Click to expand these settings.

• We have a handful of options here, and for our Pros and cons lists, we'll select “Two column.”
• Then click “Save,” and you'll be taken back to the “Manage display” page.
• Now we have additional layout areas to place our fields in for this Paragraphs type. In total, we have “Top” for the area spanning the width of the content space above our columns, “First” for the left column, “Second” for the right column, “Bottom” for the area spanning the width of our content space below the columns, and “Disabled” for fields we do not want to display.
• Drag-and-drop your Pros and Cons fields so that Pros is in the “First” column and Cons is in the “Second” column, and save.

Now, as usual, we need to add the new Paragraphs type to our Article content type.

• Navigate to Structure > Content types, and click “Manage fields” for Article.
• Edit the Body field, scroll to the bottom of that field's settings.
• Check the box next to “Pros and cons” to add that Paragraphs type to this custom Body field. Then save.

Now we're ready to begin using this “Pros and cons” Paragraphs type. Let's use it in a new article.

• Create a new article called “Swimming Is a Great Way to Stay in Shape.”
• Add two or so paragraphs of Body text to this article.
• Click the dropdown arrow next to the “Add Body text” button, and select “Add Pros and cons.” Notice that this Paragraphs type has two long-form text areas to fill in, one labeled “Pros” and the other labeled “Cons.”
• Enter text for five or so pros, each separated by a simple line break (in other words, separated by pressing the Enter key). If you'd like, you can alternatively make these 5 bullet points. Do the same in the Cons field.
• If you'd like to fill out this article a bit more, you can then add another field of Body text below the Pros and cons field.
• Click “Save and publish.”

Viewing the article, you'll see your comparison of pros and cons listed, with the pros listed in a left-hand column and the cons listed next to them in a right-hand column. You should also see your “Pros” and “Cons” labels above each list.

In most cases you would likely want to apply some CSS to these elements via your stylesheet. Again, we won't take the time do so here because you have seen how that works. Some styling suggestions might be to add a vertical border between the lists of pros and cons (and potentially borders surrounding the entire Paragraphs type) and to make the “Pros” and “Cons” labels more prominent. Additionally, you may consider going back and editing the Pros and cons Paragraphs type to add a title field which can be displayed in the “Top” area above both columns. In this case, such a field might read, “Some Pros and Cons of Swimming for Exercise.”

Part #10. Permissions for the Paragraphs Module

At this point, we've set up all of our Drupal Paragraphs types and integrated them the way we want, aside from some styling we would need to apply to the Info box and Pros and cons types. However, we have not yet configured any permissions pertaining to Paragraphs. This is an important step. Currently, if an anonymous visitor were to view our site, they would not be able to see any of the content entered via Paragraphs types (which is all of the content we have entered in this tutorial) because by default, only administrators have permission to view such content. You can see this for yourself by logging out of the site in its current state and trying to view the content. You will see the titles of articles but none of the body content.

Additionally, we want to have a “Content creator” (or similar) role on the site so that not everyone adding content has full access to all administrative configuration on the site. These users need permission not only to view Paragraphs content but to create, edit, and delete it.

We'll start by giving everyone permission to view Paragraphs content.

• Navigasikan ke halaman Orang di situs Anda, dan klik tab "Izin".
• Gulir ke bawah hingga Anda melihat bagian "Izin Jenis Paragraf". Di bawah tajuk ini, temukan "Teks isi: Lihat konten", dan centang kotak untuk Pengguna Anonim dan Pengguna Terotentikasi.
• Lakukan hal yang sama untuk izin "Lihat konten" dari semua jenis Paragraf lainnya yang kami buat: Gambar di tengah, Gambar di tengah dengan keterangan, kotak Info, dan Pro dan kontra.
• Klik "Simpan izin".

Pada titik ini, semua pengguna dapat melihat semua konten Paragraphs. Jangan ragu untuk keluar dan melihat situs sebagai pengunjung anonim untuk mengonfirmasi.

Sekarang untuk membuat peran baru bagi mereka yang akan menambahkan dan mengedit konten di situs kami.

• Arahkan ke Orang, klik tab "Peran", dan klik "Tambah peran."
• Sebut peran ini sebagai “Pembuat konten”.
• Kembali ke halaman Peran, klik panah tarik-turun di sebelah Peran pembuat konten, dan pilih “Edit izin.”
• Ada beberapa izin yang perlu kami berikan kepada pengguna peran ini. Beberapa di antaranya tidak terkait dengan Paragraphs, tetapi kami tetap menyertakannya untuk meniru skenario dunia nyata. Selain itu, akan sulit untuk menguji peran baru secara andal jika tidak memiliki semua izin yang ada dalam praktiknya. Perhatikan juga bahwa kami memberikan izin ini dengan asumsi bahwa semua pembuat konten kami bekerja sendiri. Artinya, kami tidak memiliki banyak pengguna yang diautentikasi secara teknis tetapi masih pseudo-anonim yang membuat konten di situs kami, jadi kami merasa kami dapat dengan aman memberikan izin kepada pengguna ini untuk melakukan hal-hal seperti menggunakan format teks Full HTML, yang di lain kasus akan menyebabkan beberapa masalah keamanan.

Berikut adalah daftar izin yang harus diberikan oleh peran pembuat Konten:

Komentar

• Edit komentar sendiri
• Kirim komentar
• Lewati persetujuan komentar
• Lihat komentar

Kontak

• Lihat formulir kontak seluruh situs
• Gunakan formulir kontak pribadi pengguna

Saring

• Gunakan format teks HTML Dasar
• Gunakan format teks HTML Lengkap
• Gunakan format teks HTML Terbatas

simpul

• Akses halaman ikhtisar Konten
• Kelola konten
• Lihat konten yang tidak dipublikasikan sendiri
• Kembalikan semua revisi
• Lihat semua revisi
• Lihat konten yang tidak dipublikasikan sendiri
• Artikel: Edit konten apa pun
• Artikel: Edit konten sendiri
• Artikel: Kembalikan revisi
• Artikel: Lihat revisi
• Kotak info: Buat konten baru
• Kotak info: Edit konten apa pun
• Kotak info: Edit konten sendiri
• Kotak info: Kembalikan revisi
• Kotak info: Lihat revisi

Izin Jenis Paragraf

Berikan semua izin di bagian ini kecuali untuk "Abaikan kontrol akses konten tipe paragraf".

Mencari

• Gunakan pencarian lanjutan
• Gunakan pencarian

Sistem

• Gunakan halaman administrasi dan bantuan
• Gunakan situs dalam mode pemeliharaan
• Lihat tema administrasi

Taksonomi

• Edit istilah di Tag

Bilah Alat

• Gunakan bilah alat administrasi

Pengguna

• Lihat informasi pengguna

Pastikan Anda mengklik "Simpan izin" setelah selesai.

Beberapa catatan tentang beberapa izin yang kami lakukan dan tidak berikan di sini: Kami tidak memberikan izin untuk mengelola jenis Paragraf karena kami tidak ingin mereka membuat jenis Paragraf baru atau mengubah cara kerja jenis Paragraf yang ada. Mereka hanya akan memasukkan informasi menggunakan jenis Paragraf yang telah kami buat sebagai pengembang untuk mereka. Selain itu, meskipun dalam beberapa kasus adalah bijaksana untuk menghindari pemberian peran non-administratif kemampuan untuk menghapus konten (dalam kebanyakan kasus, cukup bahwa mereka dapat membatalkan publikasi konten, dan menghapus konten membuatnya tidak dapat dipulihkan), kami perlu memberi mereka izin untuk menghapus konten jenis Paragraf di bawah "Izin Jenis Paragraf." Ini diperlukan karena jika mereka tidak dapat menghapus jenis konten ini, dan jika mereka secara tidak sengaja mengeklik untuk menambahkan konten apa pun melalui jenis Paragraf yang sebenarnya tidak mereka butuhkan dalam artikel tertentu, tidak akan ada cara bagi mereka untuk menghapus unit tersebut. isi dari artikel. Ini akan mirip dengan melarang penggunaan tombol Backspace.

Untuk menguji izin baru kami, kami akan membuat pengguna baru dari peran Pembuat konten dan melalui proses penambahan artikel baru sebagai pengguna tersebut.

• Arahkan ke Orang, dan klik "Tambah pengguna."
• Buat pengguna bernama Mary (Anda dapat melewati alamat email), dengan kata sandi yang mudah Anda ingat.
• Pastikan status pengguna ditandai sebagai "Aktif", dan yang terpenting, pastikan Anda mencentang peran "Pembuat konten" untuk pengguna ini.
• Kemudian klik "Buat akun baru".
• Logout, dan login kembali sebagai Mary. Jika izin ditetapkan dengan benar, Anda harus memiliki akses ke toolbar admin.
• Klik "Kelola" di bilah alat jika Anda tidak melihat tautan administratif ("Konten", "Struktur", dll.).
• Kemudian navigasikan ke Konten, dan tambahkan konten baru dengan tipe Artikel. kamu
• Anda dapat memberi judul artikel ini “Broccoli Is Great for You”.
• Tambahkan bidang teks Badan, dan masukkan beberapa teks.
• Anda kemudian harus melalui dan mencoba menambahkan konten dari setiap jenis Paragraf yang telah kami buat: Gambar di tengah, Gambar di tengah dengan keterangan, kotak Info, dan Pro dan kontra.
• Setelah melakukannya, simpan artikel tersebut, dan lihatlah. Proses lengkap ini harus sama seperti ketika kami melakukannya sebagai administrator situs, dan Anda akan dapat melihat semua konten tanpa masalah.

Jika Anda tidak memiliki opsi untuk menambahkan satu atau lebih dari ini, atau jika Anda mengalami masalah lain saat mencoba melakukannya, Anda mungkin melewatkan satu atau beberapa izin yang diperlukan saat memberikannya ke peran Pembuat konten. Kembali ke izin untuk pembuat Konten, dan pastikan Anda memberi mereka semua izin seperti yang tercantum di atas—terutama yang ada di bawah tajuk "Izin Jenis Paragraf".

Membungkus Tutorial Paragraf

Setelah Anda mengonfirmasi bahwa Anda dapat membuat dan melihat konten menggunakan konten Paragraphs sebagai pembuat Konten, Anda telah menyelesaikan tutorial ini. Pada titik ini, Anda harus memiliki pemahaman tentang mengapa dan bagaimana menggunakan modul Paragraphs.

Singkatnya, kegunaan modul ini terletak pada kemampuannya untuk kita mendefinisikan komponen konten dalam artikel khusus, seperti kotak informasi tambahan dan gambar di tengah dengan keterangan, tanpa memaksa pembuat konten untuk mencoba menata sesuatu sendiri.

Dengan Paragraphs, mereka hanya diminta untuk menyediakan konten untuk bagian artikel kami ini, dan kami sebagai pengembang dapat menulis aturan di seluruh situs (menggunakan CSS) tentang bagaimana konten itu harus ditampilkan. Ini membuat proses pembuatan konten lebih mudah bagi pengguna non-teknis, dan membuat tampilan konten tersebut lebih konsisten untuk pengguna teknis dan non-teknis.