Tutorial Memperindah Blockqoute pada PostWordPress

Abd Asis
Abd Asis
Aug 26, 2017 · 3 min read

Blockquote: biasanya di gunakan oleh para blogger membuat sebuah link menuju artikel lainnya.

Yang mana trik ini di gunakan untuk mendapatkan sebuah view pada halaman yang dituju.

Di artikel kali ini saya ingin berbagi sebuah panduan untuk memperindah tampilan blockqoute pada blog WordPress anda.
Baca: Cara Membuat Fitur Guest Post di WordPress
Yang harus anda pahami untuk memperindah blockquote ini yaitu setidaknya anda paham dengan Script CSS. namun jika anda masih belum paham tenang saja akan saya bantu agar anda bisa membuatnya juga.

Baik langsung saja mari persiapkan plugin yang akan kita pakai untuk mengikuti artikel ini

Langkah-langkahnya silahkan simak di bawah ini
Cara Memperindah Blockqoute pada Post WordPress
Pertama silahkan kamu install dulu plugin yang bernama AccessPress Custom CSS. Plugin ini akan berfungsi untuk membuat custom css yang kita inginkan untuk mengubah tampilan pada tema yang di pakai.

Untuk install plugin silahkan klik Plugins>Add plugin kemudian cari plugin yang sama sebutkan diatas. lihat gambar dibawah ini untuk lebih jelasnya

gambar 1: menginstall plugin

setelah proses instalasi selesai silahkan anda aktifkan plugin yang telah anda install tadi. dengan cara klik activated, silahkan lihat gambar dibawah ini

gambar 2: mengaktifkan plugin

Proses pemasangan plugin sudah sekarang menuju ke pokok pembahasannya. Silakan anda masuk ke halaman dari plugin yang telah di pasang sebelumnya. dengan cara Klik Settings> AccessPress Custom CSS maka anda akan di bawah ke halaman utama untuk memasukan plugin yang ingin di custom.

Silahkan anda salin script CSS dibawah ini yang sudah saya siapkan.
blockquote p:after{
content: “\f058”;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
color: green;
margin-left: 10px
}

blockquote {
padding: 5px 5px 5px 10px;
background: #F5F5F5;
color: black;
border-left: 5px solid red;
box-shadow: 0px 0px 4px 1px #ddd;
}

blockquote:hover {
box-shadow: 0px 0px 6px 3px #ddd;
border-left: 5px solid green;
}

silahkan tempelkan pada plugin diatas seperti gambar dibawah ini

gambar 3: halaman untuk meletakan kode yang telah di buat

Itulah cara mudah untuk Memperindah Blockqoute pada Post WordPress jika sudah anda ikuti tutorial diatas dengan baik maka tampilannya akan seperti berikut

gambar 4: contoh sebelum di custom

Sebelum di custom

Sesudah di custom

gambar 5: setelah di custom

Baca: Cara Memasang Fitur Like dan Dislike pada Komentar
Mungkin hanya seperti itu yang bisa saya jelaskan, semoga mudah di mengerti dan selamat belajar. Jumpa lagi di materi selanjutnya, dan jika di rasa bermanfaat silahkan bagikan artikel ini pada teman anda.

Click to Post

)
    Abd Asis
    Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
    Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
    Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade