Showing posts with label latar tulisan. Show all posts
Showing posts with label latar tulisan. Show all posts

Thursday, November 21, 2019

Mari Berbingkai: Mengoptimalkan Penggunaan Paket Bclogo

Anda sudah mengenali pengemasan tulisan seperti tampak pada gambar di samping ini? Bila Anda menyebut bclogo maka jawaban Anda benar. Paket bclogo memanjakan Anda dalam penggunaan ``kotak'' dengan latar berwarna dengan disertai ``logo'' dan judul untuk tullisan Anda.
Bayangkan, Anda akan menulis pada sebuah papan berwarna, yang dapat Anda warnai oleh suatu warna tertentu atau membiarkannya dalam warna bawaan (Putih). Pada tepi papan dapat Anda buat ``lis'' dengan ketebalan tertentu atau membiarkannya dalam ketebalan bawaan ($0.4\,\textrm{pt}$) atau bahkan Anda dapat menggunakan papan itu tanpa lis. Pada pojok atas-kiri, Anda dapat menempatkan sebuah logo yang telah disediakan dalam paket bclogo atau logo milik Anda sendiri (berupa berkas dalam bentuk *.jpg, *.png, atau *.eps). Pada sisi kiri papan (di bawah logo) dapat Anda hias oleh salah satu dari beragam ``penghias'' (mengambil tempat serupa batang/bar/persegi panjang) yang telah disediakan dalam paket bclogo, atau Anda gunakan yang lainnya sesuai dengan selera Anda. Kemudian di kanan logo (pada bagian atas papan) dapat Anda tuliskan judul untuk tulisan Anda. Sedangkan tulisan Anda akan termuat di bawah judul dan di kanan penghias tadi.

Baiklah, sebelum dilanjutkan, sebaiknya lebih dulu Anda buka dan baca buku pintarnya (dalam bahasa Prancis). 😀

Bagaimana Cara Menggunakan Paket Bclogo?

Perhatikan contoh minimal (minimal working example) berikut ini.

Itu adalah contoh penggunaan paket bclogo secara bawaan (tanpa opsi). Anda peroleh ``papan'' Putih dengan logo bunga dan bar di kiri berupa garis tebal. Anda ingin mengubahnya?
Seperti Anda lihat, pada mukadimah, Anda cantumkan paketnya.
\usepackage[tikz]{bclogo}
Kemudian tulisan Anda dimuat di dalam lingkup perintah (environmentbclogo sebagai berikut.
\begin{bclogo}[<opsi>{<judul>} 
<Tulisan Anda>
\end{bclogo}
Bila Anda menginginkan hasil cetak (tampilan) dari penggunaan paket bclogo sesuai dengan selera Anda, maka Anda harus mengisi beberapa opsi pendukungnya. Apa sajakah itu?
  • couleur. Untuk mengubah warna papan (bidang tulisan), couleur=<nama warna>.
  • couleurTexte. Untuk mengubah warna teks pada tulisan Anda (bukan judul), couleurTexte=<nama warna>
  • couleurBord. Untuk mengubah warna garis tepi papan (lis), couleurBord=<nama warna>
  • couleurBarre. Untuk mengubah warna bar pada sisi kiri tulisan, couleurBarre=<nama warna>
  • epBord. Untuk mengatur ukuran/ketebalan garis tepi papan, epBord=<nilai>. Nilai itu diisi oleh ukuran ketebalan (untuk satuan pt) yang diinginkan, tanpa mencantumkan satuannya.
  • arrondi. Untuk melengkungkan sudut-sudut papan, arrondi=<nilai>. Dalam desimal, nilai yang diisikan dalam kisaran $0\le\textrm{nilai}\le1$.
  • noborder. Untuk meniadakan garis tepi papan (lis), cantumkan noborder=true.
  • marge. Untuk mengatur lebar teks ke arah margin kanan halaman, marge=<bilangan bulat>, ketika opsi noborder=true digunakan. Nilai negatif akan menambah lebar teks.
  • margeG. margeD. Untuk menambah/menyusutkan lebar papan dari margin halaman, margeG=<nilai>margeD=<nilai>. Nilai itu untuk satuan cm, tanpa dicantumkan satuannya. G = Gauche = kiri dan D = Droite = kanan. Anda dapat mencantumkan salah satu atau kedua-duanya dan nilai itu boleh negatif. 
  • cadreTitre. Untuk menempatkan judul di tengah-atas papan dan berbingkai kotak, cadreTitre. Secara bawaan, judul tercetak tebal, berukuran large, tanpa bingkai, dan tercetak dari kiri setelah logo, berkat perintah \renewcommand\bcStyleTitre[1]{\large\textbf{#1}}. Nah, Anda dapat memberikan perintah tambahan di dalam argumen wajib pada perintah bawaan itu sesuai dengan selera Anda. Misalnya, \renewcommand\bcStyleTitre[1]{\hspace*{3mm}\bfseries\large\textsl{#1}}. Dapat pula Anda perintah tikz (node) secara inline.
  • sousTitre. Untuk menyertakan subjudul (di kanan judul), sousTitre=<subjudul>. Untuk mengatur subjudul, dapat Anda gunakan perintah (misalnya) \renewcommand\bcStyleSousTitre[1]{\hfill\textsl{#1}}.
  • logo. Untuk mencantumkan logo (gambar) di atas-kiri papan, logo=<perintah logo>. Untuk memilih perintah logo yang Anda perlukan, silakan buka buku pintarnya pada halaman 11 s.d. 13. Jika ingin Anda gunakan logo sendiri, lebih dulu Anda tetapkan perintah (misalnya) \newcommand{\anu}{\includegraphics[width=\logowidth]{<nama berkas gambar>}}, sehingga dapat Anda gunakan opsi logo=\anu. Secara bawaan, lebar logo ditetapkan $17\,\textrm{pt}$. Bila diperlukan, Anda dapat mengaturnya oleh perintah \setlength{\logowidth}{<nilai>pt}.
  • ombre. Untuk menunjukkan bayangan (shadow) papan, ombre=true. Secara bawaan, ombre=false. Anda juga dapat mengatur ketebalan bayangan, epOmbre=<nilai>. Nilai itu untuk satuan cm dan secara bawaan lebar bayangan adalah $0.2\,\textrm{cm}$. Warna bayangan juga dapat Anda atur, couleurOmbre=<nama warna>. Secara bawaan warnya adalah black!30. Anda juga dapat menggunakan bayangan dalam opsi blur bila didukung oleh \usepackage[tikz,blur]{bclogo}
  • barre. Untuk membuat ``garis'' (bar) pada bidang persegi panjang di sisi kiri tulisan (di bawah logo), barre=<bentuk>. Secara bawaan, Anda diberikan bar berbentuk garis lurus sebagai barre=line. Silakan buka buku pintarnya untuk memilih jenis bar yang lainnya. Tampak bahwa Anda dapat membuat bar sendiri dengan menggunakan opsi bar motif, imageExt, atau imageClip

Bagaimana Contohnya?

Untuk kualitas dokumen yang baik, tentu Anda akan gunakan segala sumber daya yang tersedia agar dihasilkan kualitas dokumen secara optimal. Seperti Anda lihat pada gambar pertama di atas, dalam penggunaan paket bclogo untuk dokumen itu, penulis juga menggunakan pendukung lain seperti paket tcolorbox, paket fontawesome, gambar eksternal, jenis huruf, dan pewarnaan.
Secara khusus, dalam penggunaan paket bclogo, kearifan Anda dalam menetapkan opsi-opsinya akan membawakan hasil dokumen yang menawan. Berikut ini sekadar contoh dokumen dengan penggunaan paket bclogo yang dapat Anda kembangkan lebih lanjut.
\documentclass{article}
\usepackage[a4paper]{geometry} % untuk tata halaman
\usepackage[tikz]{bclogo} % paket utama
\usepackage{charter} % jenis huruf
\usepackage{fontawesome} % untuk penggunaan icon
\usepackage{lipsum} % untuk contoh paragraf
\begin{document}
\renewcommand\bcStyleTitre[1]{\hspace*{3mm}\bfseries\large\textsl{#1}}
\begin{bclogo}[couleur=yellow,arrondi=0,logo=\bcbombe,barre=motif, motifBarre=\faBraille,noborder=true]{Ini judul} 
\textbf{Di sini tulisan Anda}. \lipsum[6]
\end{bclogo}
\end{document}
Demikian semoga bermanfaat.

$\square$ Adjie Gumarang Pujakelana 2019

Monday, July 10, 2017

Bersolek pada Blog


Mukadimah

Beberapa waktu terakhir ini, saya semakin tertarik untuk bersolek lagi pada blog. Seperti dapat Anda lihat di sini, tulisan kali ini pun masih berkaitan dengan hal teknis dalam penampilan tulisan pada blog.
Perhatikan bagian mukadimah ini, Anda melihat suatu warna pada latarnya, bukan? Ini bukan pewarnaan pada latar teks melainkan pewarnaan pada bagian halaman yang berisi teks. Tentang pemilihan warna untuk latar ini, saya sarankan Anda untuk menggunakan w3schools. Hal teknis ini tentu sangat bermanfaat, misalnya ketika kita akan "menyoroti" suatu bagian tulisan agar memperoleh perhatian khusus dari pembaca. Mungkin berupa definisi, dalil, rumus, atau lainnya.
Hal kedua tentang bingkai berisi teks yang dapat dibuka dan ditutup, yang diistilahkan sebagai spoiler, untuk sekadar memberikan "kejutan". Anda biasa menemukan tulisan yang dikemas demikian, bukan?


Kedua hal di atas kita muat di dalam tulisan pada blog dalam modus HTML. Secara teknis Anda cukup menyalin kode yang ditunjukkan itu, kemudian Anda tempelkan dalam tulisan yang Anda buat pada blog (dalam modus HTML) dan Anda sunting sesuai dengan tampilan teks yang Anda inginkan.

Melatari Bagian Halaman oleh Warna

Silakan Anda salin kode HTML berikut ini untuk tulisan pada blog Anda.
<div style="background-color: #FFF8C6; margin-left: 20px; margin-right: 20px; padding-bottom: 8px; padding-left: 8px; padding-right: 8px; padding-top: 8px;">
</a><b>Ini bagian judul (bila diperlukan)</b><br/>
Tuliskan teks di sini.
</div>
Tiap nilai pada masing-masing opsi "background-color", "margin", dan "padding" dapat Anda atur sesuai dengan keperluannya.


Membuat Spoiler

Silakan Anda salin kode HTML berikut ini untuk tulisan pada blog Anda.
<button title="Click to Show/Hide Content" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Lihat/Tutup</button>
<div id="spoiler" style="display:none"> 
Tuliskan di sini teks yang disembunyikan. 
</div>


Penutup

Masih banyak hal yang belum kita ketahui tentang teknis penulisan pada blog. Semoga tulisan ini bermanfaat.

$\square$ Adjie Gumarang Pujakelana 2017

Related Posts Plugin for WordPress, Blogger...