Memodifikasi Blockquote Pada Blog (2)

Melanjutkan artikel yang sebelumnya pada pembahasan modifikasi fitur blockquote pada blogger saya akan memberikan tips lain dengan hasil yang lumayan menurut saya baik untuk dipandang oleh mata kita ini, hehehe. 

Hasil gambar untuk blockquote

Jika anda tertarik melihat modifikasi blockquote lainnya anda bisa lihat dibawah ini
  1. Modifikasi Blockquote Pada Blog (1)
Pada dasarnya sebuah blockquote adalah fitur yang diberikan blogger untuk penggunanya yang berfungsi untuk menyematkan sebuah kalimat yang penting atau lebih tepatnya kata kunci yang mencakup dari beberapa kalimat diatasnya. Untuk sebuah contoh ;

Apa itu Laman?
Laman adalah sebuah fitur yang disediakan oleh pihak blogger untuk konten yang khusus terkait dengan blog. Dan laman juga biasanya disebut dengan static page atau halaman statik. Kemudian biasanya sebuah laman diisi oleh beberapa halaman diantaranya membuat sebuah :
About
Contact us
Privacy Police
Disclaimer
Sitemap

Sedangkan Apa itu postingan?
Postingan adalah sebuah artikel yang akan dibagikan atau yang akan dibaca oleh pengunjung biasanya disebut dengan artikel atau juga Entri  namun dalam konteks ini postingan lebih banyak fitur dalam tools bagian kanannya antara harus memasukan Label, Atur Waktu Pemostingan, Tautan Permanen, Lokasi, dan kawan-kawannya. Dan biasanya postingan itu bebas alis tidak terikat intinya tidak seperti laman diakan sebenarnya hanya untuk bagian-bagian penting saja pada sebuah blog.
Jadi kita bisa simpulkan bahwa Laman adalah sebuah fitur untuk konten khusus terkait dengan blog misalnya seperti About, Sitemap, Disclaimer, Privacy Police, Contact. Sedangkan postingan adalah sebuah fitur yang terkhususkan untuk sebuah artikel atau konten yang akan diberitakan atau dibahas. 

Nah secara singkatnya kita bisa lihat dari kata Jadi kita.... hingga ....dibahas. itulah yang menggunakan blockquote nah itulah rangkuman dari sedikitnya kalimat diatas maka saya masukan ke dalam blockquote. Nah pastinya kali sudah tahu dong cara membuat sebuah blockquote kalo belum tahu sedikit pencerahan saja caranya :
  1. Masuk ke dashboard blogger anda
  2. Pilih bagian Postingan - Entri Baru
  3. Anda akan disuguhkan sebuah kotak seperti microsoft word namun ini lebih sedikit simple. Nah anda lihat disana ada bagian seperti kutip dua (") bagian pojok kanan atas berwarna biru.
  4. Klik ikon tersebut maka selanjutnya anda tinggal masukan deh kata yang akan dijadikan quote.
Nah kali ini mari kita memodifikasi sebuah blockquotenya.
Hasilnya seperti ini 
Seperti ini ya gan, hehehe
  1. Anda masuk terlebih dahulu ke dashboard blogger
  2. Kemudian ke option Tema - Edit HTML
  3. Kemudian cari sebuah kode blockquote atau .blockquote
  4. Jika ada berarti kode default blockquote anda seperti itu. Namun kali ini kita akan memodifnya dengan menambahkan kode dibawah ini simpan diatas ]]></b:skin>
  5. /* blockquote by Marwanzaen */
    blockquote {
    	background: #f8e38d;
    	margin-left: 2em;
    	margin-right: 2em;
    	border-left: 7px solid #27768e;
    	padding: 15px 18px 15px 48px;
    	font-style: italic;
    	display: block;
    	font-style: normal;
    	position: relative;
    	line height: 21px;
    	border-radius: 4px;
    	border-bottom: 1px solid rgba(0,0,0,.1);
    }
  6. Kemudian anda masukan lagi kode dibawah ini tepat diatas kode blockquote default anda atau simpan dibawah kode diatas
  7. blockquote:before{
    	content:"\f0a1";
    	font-family:FontAwesome;
    	font-size:21px;
    	font-style:normal;
    	font-weight:normal;top:0;left:0;
    	position:absolute;
    	padding: 10px;
    	background:none;
    	color:#c9bc88;
    	margin-right:8px;
    	margin-left:5px;
    }
  8. Nah jika sudah anda tinggal Simpan.
  9. Coba membuat sebuah artikel kemudian anda masukan fitur blockquote tadi. maka hasilnya akan sama seperti pada blog ini.
Sampai disini sebenarnya sudah dinyatakan selesai dan beres tanpa adanya problems. Pada awalnya saya sempat kebingungan bagaimana caranya menambahkan sebuah ikon pada sebuah blockquote namun tidak menyatu dengan teks. Sebagai contoh seperti ini

Lorem ipsum dolor sit amit-amit jabang bayi ih, Hahaha. consectetur adipiscing elit. Phasellus massa dolor, facilisis at ante a, ornare lobortis est. Proin a accumsan tortor, non lacinia lorem.

Berbeda dengan ini
Lorem ipsum dolor sit amit-amit jabang bayi ih, Hahaha. consectetur adipiscing elit. Phasellus massa dolor, facilisis at ante a, ornare lobortis est. Proin a accumsan tortor, non lacinia lorem.
Lihatlah pada kedua kotak tersebut ada sebuah ikon bullhorn  namun penempatannya berbeda yang satu menyatu dengan teks dan yang satu berada diluar teks.

Nah cukup sekian cara yang saya pernah lakukan dalam memodifikasi blockquote pada blog. Semoga bermanfaat dan jangan lupa untuk dipraktekan ya 

Terima kasih anda telah membaca artikel Memodifikasi Blockquote Pada Blog (2). Jika anda kurang paham silahkan berkomentar dibawah & Ada baiknya jika artikel ini bermanfaat Share ke saudara atau teman anda.

Related Posts:

2 Responses to "Memodifikasi Blockquote Pada Blog (2)"

Jika ada kurang paham atau mau memberikan tambahan ilmu tentang hal serupa segera layangkan pada kolom komentar. Karena ilmu yang kita miliki mesti kita amakan karena itu akan berbuah pahala bagi pengamal dan pemberi ilmunya.

"Barangsiapa yang menunjuki kepada kebaikan maka dia akan mendapatkan pahala seperti pahala orang yang mengerjakannya.” (HR. Muslim no. 1893).

Kode Emoticon :



Your Ads Here 970x90
Di desain dengan sepenuh oleh Marwan Abdul Anwar | Font & Ikon : SSP ▪ Fontawesome