2 Desain Tampilan Blockquote Info - Memberi tanda pada beberapa tulisan yang menurut Anda penting akan sangat menarik jika tampilannya di desain dengan model blockquote, sehingga pesan yang akan Anda jadikan sebagai info penting akan dengan mudah dipahami pengunjung yang membaca tulisan Anda. Block-quote seperti yang sudah Anda ketahui hanya merupakan tanda baca berupa petik dua (kutipan) yang letaknya disebelah atas kiri sebuah teks seperti ini misalnya:
" SAHABAT BLOGGER 77
Fungsi blockquote sama halnya seperti memberi warna pada beberapa tulisan, atau menggaris bawahin sebuah kalimat yang penting, namun pada blockquote teks info dibentuk dengan tampilan box (block), sehingga kalimat tersebut akan dengan mudah kita temukan kembali karena sudah kita beri tanda. Banyak ragam variasi yang dapat kita buat untuk memberi tanda pada beberapa info penting dengan berbagai tampilan, seperti Cara Membuat Tabel Box Untuk Menyimpan Tulisan di artikel sebelumnya saya memberikan 4 model desain. Untuk tampilan teks box kali ini saya akan membagikan 2 Desain Tampilan Blockquote Info dengan model:
1. Blockquote Skew
Tampilan blockquote ini terbilang sederhana, karena hanya bermain dengan border. Namun sudah saya modifikasi dengan menambahkan beberapa fungsi-fungsi elemen untuk mempercantik gaya tampilannya, seperti border-left,border-right saya kosongkan, sedangkan untuk border-top saya buat double (2 garis), gaya arrow (panah info) saya buat miring dengan CSS transform: skew pada border-bottom. Sedangkan untuk keterangan sumber pesan, saya hanya menampilkan teks profile, sehingga info yang sudah tertulis disana akan diberi tanda dengan nama sipenerbit tulisan tersebut seperti ini:
DEMO SHOW
Bagaimana, sederhana tetapi masih terlihat keren bukan, mau mencoba.? Anda cukup copy kode CSS dibawah ini, lalu letakkan pada formulir kosong postingan mode HTML saat Anda akan menulis artikel baru. Kode lengkapnya seperti ini:
2. Blockquote Info With Image Profile
Model desain untuk tampilan blockquote yang satu ini pernah saya terapkan fungsinya untuk membungkus tampilan permalink seperti ini:
➟ Widget Profil Penulis Dengan Background Blur Efek
➟ Membuat Widget Author Box Dengan Blockquote
Dan model ini juga yang saya gunakan sebagai tampilan permalink seperti yang Anda lihat letakknya dibawah disetiap tulisan post. Selain profile-name sebagai teks sumber info, tampilan blockquote ini sudah saya lengkapi dengan foto-profile dan text-link, jadi bukan hanya nama saja yang dapat pengunjung baca disana, tetapi mereka juga dapat membuka profile blog Anda pada URL-link. Lebih tertarik dengan tampilan blockquote yang ini, kode lengkapnya sebagai berikut:
Hasilnya:
DEMO SHOW
Dari ke- 2 Desain Tampilan Blockquote Info diatas, Anda bisa berinovasi lagi. Akan Anda tempatkan dimana atau mau dimodifikasi lagi tampilannya sesuai dengan gaya Anda, namun jangan lupa dibawah tulisan ini sudah dibuka forum tanya jawab, jadi kiranya sahabat semua pecinta SAHABAT BLOGGER 77 mengalami kesulitan, mari sama-sama kita bahas dalam kolom komentar. So....Happy blogging.
" SAHABAT BLOGGER 77
Fungsi blockquote sama halnya seperti memberi warna pada beberapa tulisan, atau menggaris bawahin sebuah kalimat yang penting, namun pada blockquote teks info dibentuk dengan tampilan box (block), sehingga kalimat tersebut akan dengan mudah kita temukan kembali karena sudah kita beri tanda. Banyak ragam variasi yang dapat kita buat untuk memberi tanda pada beberapa info penting dengan berbagai tampilan, seperti Cara Membuat Tabel Box Untuk Menyimpan Tulisan di artikel sebelumnya saya memberikan 4 model desain. Untuk tampilan teks box kali ini saya akan membagikan 2 Desain Tampilan Blockquote Info dengan model:
1. Blockquote Skew
Tampilan blockquote ini terbilang sederhana, karena hanya bermain dengan border. Namun sudah saya modifikasi dengan menambahkan beberapa fungsi-fungsi elemen untuk mempercantik gaya tampilannya, seperti border-left,border-right saya kosongkan, sedangkan untuk border-top saya buat double (2 garis), gaya arrow (panah info) saya buat miring dengan CSS transform: skew pada border-bottom. Sedangkan untuk keterangan sumber pesan, saya hanya menampilkan teks profile, sehingga info yang sudah tertulis disana akan diberi tanda dengan nama sipenerbit tulisan tersebut seperti ini:
Bagaimana, sederhana tetapi masih terlihat keren bukan, mau mencoba.? Anda cukup copy kode CSS dibawah ini, lalu letakkan pada formulir kosong postingan mode HTML saat Anda akan menulis artikel baru. Kode lengkapnya seperti ini:
<style type='text/css'>
.skew-quote {max-width: 650px;font-family: 'PT Serif',serif;font-style: italic}
.skew-quote p {
position: relative;margin: 0 10px;padding: 15px 0;
font: italic 18px/24px 'PT Serif',serif;
border-top: 4px double #8c8c8c;
border-bottom: 1px solid #8c8c8c}
.skew-quote p:after {
content: '';position: absolute;
bottom: -9px;left: 42px;width: 15px;height: 15px;
background: #333;border-left: 2px solid #8c8c8c;
border-bottom: 1px solid #8c8c8c;
transform: skew(45deg) rotate(-45deg)}
.skew-quote footer:before {content:'\201C';font:700 25px/normal serif;margin:6px}
.skew-quote footer {font-size: 14px;line-height: 20px;margin:8px 0 0 12%}
</style>
<blockquote class='skew-quote'>
<p>Tulis Teks Anda Disini...</p>
<footer>By. Devy Indriyani</footer>
</blockquote>
.skew-quote {max-width: 650px;font-family: 'PT Serif',serif;font-style: italic}
.skew-quote p {
position: relative;margin: 0 10px;padding: 15px 0;
font: italic 18px/24px 'PT Serif',serif;
border-top: 4px double #8c8c8c;
border-bottom: 1px solid #8c8c8c}
.skew-quote p:after {
content: '';position: absolute;
bottom: -9px;left: 42px;width: 15px;height: 15px;
background: #333;border-left: 2px solid #8c8c8c;
border-bottom: 1px solid #8c8c8c;
transform: skew(45deg) rotate(-45deg)}
.skew-quote footer:before {content:'\201C';font:700 25px/normal serif;margin:6px}
.skew-quote footer {font-size: 14px;line-height: 20px;margin:8px 0 0 12%}
</style>
<blockquote class='skew-quote'>
<p>Tulis Teks Anda Disini...</p>
<footer>By. Devy Indriyani</footer>
</blockquote>
2. Blockquote Info With Image Profile
Model desain untuk tampilan blockquote yang satu ini pernah saya terapkan fungsinya untuk membungkus tampilan permalink seperti ini:
➟ Widget Profil Penulis Dengan Background Blur Efek
➟ Membuat Widget Author Box Dengan Blockquote
Dan model ini juga yang saya gunakan sebagai tampilan permalink seperti yang Anda lihat letakknya dibawah disetiap tulisan post. Selain profile-name sebagai teks sumber info, tampilan blockquote ini sudah saya lengkapi dengan foto-profile dan text-link, jadi bukan hanya nama saja yang dapat pengunjung baca disana, tetapi mereka juga dapat membuka profile blog Anda pada URL-link. Lebih tertarik dengan tampilan blockquote yang ini, kode lengkapnya sebagai berikut:
<style type='text/css'>
.quote blockquote:after,
.quote blockquote:before {
top: 100%;border: solid transparent;
content: " ";height: 0;width: 0;
position: absolute;pointer-events: none}
.quote blockquote:after {
border-top-color: #ffffff;border-width: 10px;
left: 75%;margin-left: -10px}
.quote blockquote:before {
border-top-color: rgba(0,0,0,0.01);
border-width: 11px;
left: 75%;margin-left: -11px}
.quote blockquote p {
font:400 italic 14px/normal 'PT Serif', serif;
color: #333;padding: 15px;text-indent: 100px;
position: relative}
.quote blockquote p:before{
content: '\201C';font-family: serif;font-style: normal;
font-weight: 700;position: absolute;font-size: 115px;
top: -0.5em;left: -95px;color: rgba(18, 177, 250, 1);
text-shadow: 7px 14px 10px rgba(0, 0, 0, 0.1)}
.quote .desc {text-align: right;padding: 20px 100px 20px 20px;position: relative}
.quote .img {
display: block;width: 77px;height: 77px;
border: 5px solid #2fe45D;border-radius: 50%;
background: url(http://URL-Gambar Anda.jpg) no-repeat center center;
position: absolute;right: 10px;bottom: 5px;
box-shadow: inset 1px 1px 4px rgba(0,0,0,0.5),0 2px 3px rgba(0,0,0,0.6)}
.quote .profile {font:700 18px/normal 'Alegreya SC', serif;color: #ccc}
.quote cite a:hover{color: aqua}
.quote cite a {font:700 italic 13px/normal 'Alegreya', serif;color: orange}
.info-wrap{width: 600px;margin: 20px auto;padding: 10px 20px;position: relative}
.info-wrap p{margin: 0;padding: 0}
.info-wrap blockquote {margin: 0;padding: 0;position: relative}
.info-wrap cite {font-style: normal}
</style>
<div class="info-wrap quote">
<div class="img"></div>
<blockquote cite="http://sahabatblogger77.blogspot.com">
<p>Tulis Teks Anda Disini...</p>
</blockquote>
<div class="desc">
<p class="profile">Devy Indriyani</p>
<cite><a href="http://sahabatblogger77.blogspot.com">Sahabat blogger 77</a></cite>
</div>
</div>
.quote blockquote:after,
.quote blockquote:before {
top: 100%;border: solid transparent;
content: " ";height: 0;width: 0;
position: absolute;pointer-events: none}
.quote blockquote:after {
border-top-color: #ffffff;border-width: 10px;
left: 75%;margin-left: -10px}
.quote blockquote:before {
border-top-color: rgba(0,0,0,0.01);
border-width: 11px;
left: 75%;margin-left: -11px}
.quote blockquote p {
font:400 italic 14px/normal 'PT Serif', serif;
color: #333;padding: 15px;text-indent: 100px;
position: relative}
.quote blockquote p:before{
content: '\201C';font-family: serif;font-style: normal;
font-weight: 700;position: absolute;font-size: 115px;
top: -0.5em;left: -95px;color: rgba(18, 177, 250, 1);
text-shadow: 7px 14px 10px rgba(0, 0, 0, 0.1)}
.quote .desc {text-align: right;padding: 20px 100px 20px 20px;position: relative}
.quote .img {
display: block;width: 77px;height: 77px;
border: 5px solid #2fe45D;border-radius: 50%;
background: url(http://URL-Gambar Anda.jpg) no-repeat center center;
position: absolute;right: 10px;bottom: 5px;
box-shadow: inset 1px 1px 4px rgba(0,0,0,0.5),0 2px 3px rgba(0,0,0,0.6)}
.quote .profile {font:700 18px/normal 'Alegreya SC', serif;color: #ccc}
.quote cite a:hover{color: aqua}
.quote cite a {font:700 italic 13px/normal 'Alegreya', serif;color: orange}
.info-wrap{width: 600px;margin: 20px auto;padding: 10px 20px;position: relative}
.info-wrap p{margin: 0;padding: 0}
.info-wrap blockquote {margin: 0;padding: 0;position: relative}
.info-wrap cite {font-style: normal}
</style>
<div class="info-wrap quote">
<div class="img"></div>
<blockquote cite="http://sahabatblogger77.blogspot.com">
<p>Tulis Teks Anda Disini...</p>
</blockquote>
<div class="desc">
<p class="profile">Devy Indriyani</p>
<cite><a href="http://sahabatblogger77.blogspot.com">Sahabat blogger 77</a></cite>
</div>
</div>
Hasilnya:
Dari ke- 2 Desain Tampilan Blockquote Info diatas, Anda bisa berinovasi lagi. Akan Anda tempatkan dimana atau mau dimodifikasi lagi tampilannya sesuai dengan gaya Anda, namun jangan lupa dibawah tulisan ini sudah dibuka forum tanya jawab, jadi kiranya sahabat semua pecinta SAHABAT BLOGGER 77 mengalami kesulitan, mari sama-sama kita bahas dalam kolom komentar. So....Happy blogging.
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul= 2 Desain Tampilan Blockquote Info
Ditulis oleh= Devy
Rating Blog 5 dari 5
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip (meng-Copy), baik itu sebagian atau keseluruhan isi dari artikel ini harap menyertakan link dofollow ke >>
selalu penuh dengan inovasi segar, sukses terus mbak Dev.
BalasHapusbagus nih tampilan blockquotenya, jadi lebih menarik
BalasHapusiya sederhana tapi terlihat simple dan cantik ,,,, hehe
BalasHapusyg ini mw sy cba pasang di blog sebelah ah ,,, walau puyeng ,,, tapi tak coba dulu, hehehe berhasil atau gk urusan belakang..hehehe ... kn ada devy klo sy gagal ,,, :)
sy dah nyoba pasang ... tapi kok photo nya nda nongol yah ...heheh
Hapusbantu aku devy ,,,, :)
hehe.. kurang menggigit.. Mas Fi..!,
Hapusbiat menggigit banget gmn tho mas al ? hheee
Hapusbelom ada rebananya.., tung taak..tak tung taak.. tung taak tak tuung taak..!,
HapusMas Fi .. ada yg bau wangi nih /..berasa nda?..
.quote .img {
Hapusdisplay: block;width: 77px;height: 77px;
border: 5px solid #2fe45D;border-radius: 50%;
background: url(http://URL-Gambar Anda.jpg) no-repeat center center;
position: absolute;right: 10px;bottom: 5px;
box-shadow: inset 1px 1px 4px rgba(0,0,0,0.5),0 2px 3px rgba(0,0,0,0.6)}
ganti background dengan URL gambar mas Fiu, jangan gambar Devy ya, hehe..
ow .... pantes ,, sy gk aca ada tulisan url gambar anda ... klo gmbar devy boleh kan ? xixixixi ?
Hapusboleh kok mas, apa sih yang gak kalau sudah mas Fiu yang minta,,hehe.
Hapus(prettttt....)
asik ,,,,hehehehe .... tpi masa sih klo sy minta pasti dibolehin ? hehehe :)
Hapusselama itu tidak merusak MORAL bangsa kaum wanita, kenapa gak mas, hehe..
Hapussip .... Insya Allah nggak kok ... devy tenang aja ,,,, hehehe (f)
Hapussoalnya bukan kenapa-kenap mas, sampai saat ini Devy bisa dibilang masih pilih-pilih mencari cowok atau apalah, bukan karena sesuai type, tetapi karena devy dah banyak trauma dengan hal-hal sepele seperti ini yang berujung pada rasa merana.
Hapusgitu mas.
hehehe, justru itu bgus buat devy ,,, mengambil pelajaran dri kejadian2 seblmnya biar gak terjadi lg ,,, (h)
Hapuskok jadi curhat, sudahlah lupakan..bay.....
Hapusxixixixixixxi ,,, iya lupakan ,,,, kita kembali ke laptop ......!!!! :)
Hapuspemirsa...eya..eya,,eya..eya..
Hapustuh ka, bahasannya jadi semakain kacau, tadi tentang curhat, sekarang malah bahas pak TUKUL, kalau sudah ketemu dengan mas FIU, bawaannya jadi kacau, haddewhhh...hehehe..
hehehehehe ... kan biar selalu ceria ,,, gak cemberut + manyun terus ....
Hapusdi dumay aja kek gini, gmn klo ketemu beneran ya ? hehehehe :p
kalau ketemu beneran palingan juga mas fiu, gaya tangannya lemah gemulai (iya cinn) :d
Hapusih .... ogah deh ... klo gtu....bahahahahaha ... :p
Hapussaya seneng yang ke dua mbak, keren dan elegan (o)
BalasHapusbener mas, karena terlihat cantik dan elegan, model itu juga yang saat ini Devy gunakan sebagai tampilan permalink
Hapusbackground nya gausah diganti boleh ga cz aku mau tetep pakai fotonya mbak devy :d
BalasHapuspake photonya sy aja deh kg jum biar makin keren ,,,,hehehehe :p
Hapuslebih keren lagi kalau pakai foto kita berdua mas Fiu..xixixi...
Hapussy setju deg devy .... tuh kg jum pasa foto kita berdua yah ,,, sy ama devy dijmin lbh keren ...hehe x-)
Hapuslemas seketika melihat kekompakan diantara kalian berdua ini.
Hapus(hallah bahasane)
okey mas fiu ntar saya kasih fotonya mas fiu sama mbak devy dech.
foto mas fiu : 2%
mbak devy : 98%
setuju ga mbak devy :d
hmmm...kurang setuju sih mas, 2% masih terlalu banyak buat mas Fiu, kasih 0.2% saja sudah lebih dari cukup, pasti mas Fiu setuju.xixixix....
Hapusjlebbbb .... kiraen teh devy bilng kurang stju mw jdi fifty : fifty ... eh mlh jdi 0.2% ...hehehe ....
Hapusskitny tuh dsini ,,,,hehehe :o
dah sy coba berhasil ,,, tpi fotnya yg kgedean apa yah ,,, yg muncul cuma idung ama bibir nya doank nih ,,hehehe
BalasHapusganti format dimensi gambar menjadi s80 sampai ketemu sesuail lingkaran.
Hapushttp://1.bg.JJJlmmmm......../s1600.jpg, ganti s1600 menjadi s80.
sip ,,, jadi deh ,,,, devy mmg cerdas euy ,,,, hehehe
Hapuskira2 kpn yh mw psng fotony devy ....heeee :)
mau dipasang dimana mas, devy kagak mau ah kalau foto devy di iklankan di blognya mas Fiu,
Hapussemua format gambar di blog ini, sudah devy licensikan loh mas, jadi jangan dicuri, nanti mas bisa terkena banned, mau..?..hehe..
eh .... gak di blog ,,, tapi di hati sy ......hahahahahahahahahah :p
Hapusoiya ,,, klo blockquote mw di patenkan di css caranya sama gk dg yg ada di judul "Membuat Widget Author Box ,,,,,,
kalau untuk widget author kan menggunakan perintah untuk memanggil tag title dimana widget ini berada, misalnya artikel dengan judul ini, maka widget akan merespon dan mengambil judul itu untuk ditampilkan, begitu seterusnya pada halaman posting artikel yang lain,
Hapuselemen CSS sama, namun ada tambahan perintah HTML yang langsung dibalut dengan kondisional tag. kalau caranya mas fiu bisa pelajari disni..
► Smart-Link Blogger Author Profile
sebentr sy pelajari dulu ,,,, hehehe :)
Hapusklo yg judul "Membuat Widget Author Box Dengan Blockquote"
sy dah coba buat tapi kok hasilnya lebar dan panajng yah ,,, sudah gtu tulisan author dan link nya gak teratur (numpuk) he
format-format dalam CSS saya membuat manual mas, bukan responsive, karena berpikir dengan sahabat lain yang ingin meng-edit agar tidak menemukan kendala saat melakukannya..
Hapusmas tinggal lakukan perubahan pada lebar widgetnya mas, jika kode responsive widget sudah tertanam di Template yang mas pakai, maka widget itu tidak perlu diubah dimensi lebar dan tingginya..
fokus pada kode width
okeh ... siap master devy .... heee ...segera laksanakan ..... hehehee (o)
Hapusdevy jngn bosen klo sy tny mulu ttg css dkk yah ... mklum sy msh blm menguasai ...heeee
tadi sudah Devy lihat hasilnya, tidak ada yang berantakan kok mas, hanya deskripsi teks tidak muncul sempurna seperti tampilan DEMO.
Hapuskita ambil contoh tampilan Widget Author Box Dengan Blockquote
sesuai dengan elemen CSS, kode pemanggil HTMLnya seperti ini:
<b:if cond='data:blog.pageType == "item"'>
<div class='mb-wrap mb-style-3'>
<div class='mb-thumb'>
</div>
<blockquote cite='http://sahabatblogger77.blogspot.com'>
<p>TERIMA KASIH ATAS KUNJUNGAN SAUDARA</p><div style='padding:12px 5px;'>
Judul= <b><span itemprop='itemreviewed'><data:post.title/></span></b><br/>
Ditulis oleh= <b><span itemprop='reviewer'><data:post.author/></span></b><br/>
Rating Blog <span itemprop='rating'>5</span> dari 5<br/>
Semoga artikel ini bermanfaat bagi saudara. Jika ingin mengutip (meng-Copy), baik itu sebagian atau keseluruhan dari isi artikel ini harap menyertakan link dofollow ke >> <div style='font-family: Arial;font-size: 13px;font-weight:400;'><a expr:href='data:post.url' expr:title='data:post.title' target='_blank'><data:post.url/></a></div><blink><div style='text-align: center;color: red;font-size: 17px;'><b>= TERIMA KASIH =</b></div></blink></div>
</blockquote>
<div class='mb-attribution'>
<p class='mb-author'>
Devy Indriyani</p>
<cite><a href='http://sahabatblogger77.blogspot.com' target='_blank' title='My Website'>Join To Sahabat Blogger 77</a></cite>
</div>
</div>
</b:if>
barangkali ada kode yang salah penempatan letak.
tidak brantakan ? devy liat diman ? kn sy dh delete ... yg ada bru satu yg dipasang di post (html) hehe
Hapussebelum mas Fiu delete, tadi devy lihat widgetnya sudah terpasang disalah satu blog mas pada artikel rebana..hehe..
Hapushehehehe.... ih ternyata dh liat duluan tho ...hehehe
Hapusiya tapi kn tadi tulisan Fiu dan Choppie88 numpuk kn ? hehe
tidak mas, serius..
Hapushanya deskripsi teks yang tidak tampil sempurna,
klimat ini "//link desain blockquote by //don't editting in area please... "
Hapuskok muncul di atas tulisan terima kasih ?
yang sabar ya mbak devy, abang aku yang satu ini emang banyak tanya. terlebih lagi kalau sama cewek cantik kaya mbak devy. pasti ada saja sepikan ala #mbak_deva
Hapusitukan hanya sebagai intruksi keterangan teks yang saya sisipkan langsung pada kode area..jangan ikutan diCopy attuh mas, hehe..
Hapusdihapus saja.
ow jngn diikutin tho ..hehehe.... klo yg ikut devy sh gpp deh ,, :)
HapusAh mas al ,,, dh di kasih makan blm kodok nya ?
tuh kn bner ada tulisan yg numpuk.... hehe
Hapuskalau masih terlihat menumpuk, tambahkan kode paragraf pada teks pertama, contoh seperti ini:
HapusFiu. S<br/> ←
Choppie88
yeee ... jadiii ....hehehe
Hapusselamat ya sudah jadian sama blockquote nya, hehe..
Hapussemoga langgeng hubungannya
yah ..kok ama blockquote sih... knp gk ama adminnya aja coba ,,,, heheee :p
Hapuseh .... sy cri tuk merubah warna tanda kutip di pjok kanan atas kok gk ada yah ? hehe
Hapusmasa sih..?? lihat pada CSS ini mas:
Hapus.mb-style blockquote:before{
color: rgba(255,255,255,0.2);
position: absolute;
content: '\201C';
font-size: 150px;
line-height: 130px;
font-style: italic;
top: 0px;
right: 20px;
font-family: Cambria, Georgia, serif;
/*tambahkan kode background*/
background:....;}
mas tinggal tambahkan kode background-nya saja, contoh seperti ini:
yg ini : color: rgba(255,255,255,0.2); ...
Hapusutk merubah biar jd warna putih ?
itu sudah color-white, tinggal mengatur kepekatan warna saja mas, ubah menjadi seperti ini:
Hapuscolor: rgba(255,255,255,1);
yeeeee .... jadi lagi ,,,hehehe ... maksih yah devyyyyyyyy ..... (f) hehe
Hapuskeren nih mbak blockquote nya,
BalasHapussaya sering ngeliat ini sama blog tetangga..tapi pusing gimana cara bikinnya...hehe
tetangganya juga pasti pusing mas, soalnya widget yang mas tanyakan dibahas ditetangga lain, hehe..
Hapustermasuk sy ... udah pusing dari tadi pagi ...hehehe
Hapusseperti biasa mas, tidak semua kode yang saya publish ditampilkan secara sempurna, karena jika hanya tinggal Copy, sahabat lain tidak akan pernah tahu bagaimana bermain editing HTML.
Hapusbeberapa elemen lay-out seperti:
- margin,
- padding, dan
- peramban detector kode tidak selalu saya sertakan. tujuannya
Agar mereka paham dan cepat mengerti tingkat kesalahan apa dan bagaimana mengubahnya, dengan begitu akan terbiasa jika menghadapi dunia kode pada blog ini.
sama seperti mas Fiu, kalau seandainya kodenya tinggal pakai, bagaimana mas mau mengubahnya sesuai selera, dengan begitu mas akan sedikait paham kan dengan semuanya.hehe..
iya ,,,, gtu lbh bagus jadi gak sllu asal caplok ,,,,heheh ,, devy mmg sesuatu deh ,,, bkin mkin nggreget aja ,,,,hehehehe :p
Hapussemuanya sudah beres, jadi devy nyatakan forum tanya jawab ini ditutup untuk sementara, karena devy mau mandi, biar wangi karena mau ajak mami jalan-jalan sore dulu keliling kota, hehe..
Hapusdevy pamit off dulu ya mas, dan buat semua pecinta SAHABAT BLOGGER 77 devy ucapkan terimakasih sudah mau hadir di blog ribet ini, see u guys..
@uda widkey: yang pasti tetangganya juga pusing buatnya dan lebih pusing lagi kalau kalau yang ngeliat blockquotenya ikutan pusing...jadi pusing-pusingan deh gara-gara blockquote
Hapusmenarik juga ya dev...bisa kita pendekin kodenya dengan memasang css dalam template terus tinggal menggunakan html blockquote pendek dalam postiing ya dev...ok tertarik sama yang pertama....biasalah yang pertama selalu menarik ya gan....heheheee....ok saya izin menggunakan blockquote yang pertama dev...ok deh makasih...
BalasHapustetapi banyak loh mbah, kalau yang ke-2 itu lebih disempurnakan tampilannya, karena mengikuti gaya yang pertama, kan ada kesempatan ke-2 jika pertama belum berhasil, hehe..
Hapussalam sukses mbah
akhirnya saya sederhanakan sista devi...dan lumayanlah untuk meambah modis tampilan dalam posting heheheee
Hapushampir lupa mengucapkan terima kasih....terima kasih yaaa...sista devi...oh ya kalau namamu di disingkat jadi dev...jadi kayak orang india heheheee #guyon
Hapusuntung aku baca dulu tadinya mau tanya : ini apaan? hehe.. kayaknya aku perlu juga buat memberi warna posting beberapa kaidah ya dev ya..
BalasHapusmantap nih! buat percobaan keren
BalasHapus:)
HapusSalam Singgah Devy...
BalasHapusYa salam.. dapat ilmu lagi nih. makasih mbak. izin pake. :D
BalasHapuskayaknya kalau lomba komentar mas fiu juaranya dech (c)
BalasHapustidak apa attuh mas, mungkin ada beberapa hal yang ingin ditanyakan, jadi beliau bertanya dan terus bertanya, kan lebih baik kalau kita saling belajar bersama.
Hapusdevy juga sering lakukan hal yang sama kok, jika sesuatu hal yang belum ditahu, pasti bertanya, karena memang ingin tahu dan ingin segera menguasainya.
sebenernya saya juga pengen tanya banyak hal mbak, tapi berhubung sayanya sudah gada kompi jadinya hanya bisa komen oot. mau praktek tapi ga bisa lewat andro mbak :-(
HapusGa bisa di blog saya gunakan sekarang mba.. (p)
BalasHapusmantap.... pinter banget mbak (h)
BalasHapusblockquotenya bagus tuh, bisa mempercantik tampilan posting (h)
BalasHapusDevy... It's really really cool. Kapan-kapan aku boleh coba ya :-d
BalasHapus