Cara Membuat Postingan Seperti Koran Bagian 2
Assalamualaikum warahmatullahi wabarakatuh.Setelah kemarin libur dari semua aktivitas kerja bagi sobat yang rutinitas kerjanya pada masing-masing tugas dan keahlian pada tempat kerjanya. Maka di hari senin ini semoga anda semua bisa menjalankantugas dan kewajiban sebagaimana mestinya. Setelah kemarin saya bagikan tentang cara : Trik Membuat Halaman Posting Seperti Tampilan Koran. Nah pada kesempatan ini saya akan berbagi juga hal yang agak sama namun beda. Trik ini sedikit akan memangkas susunan kode dari cara membuat halaman posting seperti surat kabar atau Koran. Jika sebelum post ini di terbitkan kodenya agak banyak maka pada artikel ini anda akan di berikan kemudahan dan rasa simpel dengan tampilan halaman posting bak seperti koran. Namun lebih nyaman dan sangat sederhana tampilan dan juga cara menggunakanya. Bagaiman sob anda berminat..? silahkan baca selengkapnya berikut di bawah ini.
Baca juga artikel lainya : Semua Tentang Trik Blogger
Halaman post dengan gaya koran menarik :
Pada postingan kali ini berbeda dengan artikel sebelumnya yang membahas area postingan dengan gaya koran. Di post ini saya sajikan sesederhana dan semudah mungkin untuk anda menerapkan gaya postingan ala surat kabar koran itu. Karena tidak semua sobat blogging suka dan bisa melakukan hal yang sulit dan rumit. Maka di tutorial kali ini saya akan memangkas kode yang segitu banyak pada post sebelumnya menjadi simpel dan sedikit agar lebih praktis dalam penerapanya. Silahkan bagi anda yang berminat dengan tutorial ini baca lebih lanjut tulisan artikel ini selengkapnya.
Memajang hamparan artikel gaya koran 2 :
Pada tampilan hasil dari artikel ini pasti akan berbeda dengan hasil sebelumnya. Karena trik ini di permudah cara pemasangan kode pada area postinganya dan pastinya hasilnya pun akan berbeda. Namun tidak mengurang keunikan dan keindahan area posting yang menyerupai seperti Koran itu. Baik tidak perlu panjang lebar silahkan langsung coba cara pemasanganya pada artikel baru atau artikel lama di blog anda.
Cara pemasanganya :
Cara pemasangan kode untuk tampilan artikel seperti suratkabar koran ini, Masih sama seperti sebelumnya. Hanya beda tutorial ini kodenya lebih sedikit dan praktis cara menggunakanya. Copy kode di bawah ini dan paste kan pada area new post atau entri baru di Kolom HTML, Jangan di Compose. Berikut di bawah ini kode HLML yang harus anda copy nya :
<style type="text/css" scoped>
.koran{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
-moz-column-gap:40px; /* Firefox */
-webkit-column-gap:40px; /* Safari and Chrome */
column-gap:40px;
-moz-column-rule-style:outset; /* Firefox */
-webkit-column-rule-style:outset; /* Safari and Chrome */
column-rule-style:outset;
-moz-column-rule-color:#000000; /* Firefox */
-webkit-column-rule-color:#000000; /* Safari and Chrome */
column-rule-color:#000000;}
</style>
<div class="koran">DISINI LETAKAN TULISAN ARTIKEL ANDA</div>
Keterangan :
Pada kode diatas yang berwarna MERAH silahkan anda ganti dengan tulisan artikel anda. Yang berwarna BIRU, itu kode warna, silahkan anda sesuaikan warna untuk masing masing yang akan di tampilkan pada setiap browsernya, karena trik ini support pada semua perangkat termasuk handphone. Dan pada kode yang berwarna ORANGE silahkan anda tentukan jumlah kolom yang hendak anda tampilkan pada area postingan blog. Misal : count:3; berarti 3 kolom dalam satu postingan, atau count:2; berarti dua kolom yang tampil area postingan. Atau berapa saja sesuai yang anda inginkan.
Demikianlah kiranya yang bisa saya sampaikan dan tuliskan untuk membuat halaman posting dengan gaya ala koran di bagian ke 2 ini. Semoga bisa bermanfaat untuk sobat yang ingin sesekali membuat artikelnya dengan tampilan desain yang agak beda dari yang pernah anda coba. Selamat mencoba semoga berhasil, jika ada perkembangan baru mengenai cara membuat post gaya ala koran ini, silahkan share disini. Terima kasih sudah berkunjung di blog sederhana ini. semoga yang saya kemas ini bisa menjadi ajang untuk mempererat tali silaturrahim antar pemblogging. Tetap samangat berkarya.. Happy Blogging ...
Demikianlah kiranya yang bisa saya sampaikan dan tuliskan untuk membuat halaman posting dengan gaya ala koran di bagian ke 2 ini. Semoga bisa bermanfaat untuk sobat yang ingin sesekali membuat artikelnya dengan tampilan desain yang agak beda dari yang pernah anda coba. Selamat mencoba semoga berhasil, jika ada perkembangan baru mengenai cara membuat post gaya ala koran ini, silahkan share disini. Terima kasih sudah berkunjung di blog sederhana ini. semoga yang saya kemas ini bisa menjadi ajang untuk mempererat tali silaturrahim antar pemblogging. Tetap samangat berkarya.. Happy Blogging ...
113 komentar
Salam Keren mas,,, Maaf baru bisa berkunjung niih...
Wah ada trik baru niiihh,,, bagus nihh,,, untuk tampilan yg berbeda. hehe
Oh yaa,, kapan kapan saya boleh ambil referensi disini yaaa,, untuk psotingan tutorial di blog ku tentunya,,. berbagi link laah gitu,, hihihi...
Thanks ya mas,,
Salam juga Mas, tak apalah Mas kalau memang sibuk, silahkan jika hendak mencubanya Mas, semoga bisa menghiasi post blog Mas ya?
Silahkan dengan senang hati Mas, yang penting kita saling berepresiasi yah Mas, kebersamaan/saling bantu antar pemblogging indah buat saya
weh ,,,, pantas koran sy hari ini blm datang, ternyata nysar dimari tho ,,,,
Kalau gak salah pasti bener deh Mas Fiu. hhkhk bisa aja Mas ini :)
Wah iya bener bener. SUdah persis wis plek dengan format Surat Kabar atau keren. emang keren artikelnya Mas Saud Karrysta. Jempol dua dah, Two Thumbs,. Bole di adopsi nih scriptnya Hiheiheiheiheheiee
Ada mas Afgan ssstttttt
waduh...
postingan seperti koran jilid 1 saja belum sempat nyoba nih mas.eh malah sudah ada yang jilid kedua.
kalau gitu saya simpen dulu yamas
tepatnya cocok ambek regane endog
nanti masalah DP nya bisa urusan sama saya saja
Hanya belajar saja saya Pak Asep. namun jika berkenan silahkan dengan senang hati monggo diambil ya Pak. makasih kujunganya
Eh iyah maaf Mas Yanto gak kesenggol deh, ya udah ta senggol
saya minta tanda tangan dong
Alhamdulilah ternyata ada juga yang mau ngurusi blog ancur saya ini. Makasih Mas Yanto.. :-bd
Baru berkunjung lagi nih, hehe.. Kreatif bget gan tp kyknya gk ccok di psang d blog niche download kyk saya.hehe mantappp
Nanti saya kasih cap jempol ya Mas?
Pilih salah satunya mana suka Mas Yanto, kali aja suatu saat perlu :)
Yah sekedar iseng aja Mas Kudhen saya mah. jika kurang pas gak apa apa ya Mas posingan biasa aja juga gak apa apa makasih kunjunganya :)
Woow, keren mas Saud, pantas dicoba ini..:)
ada kopinya nggak mas?
komentatornya masih cowok semua,nanti deh kalau ada ceweknya saya pilih-pilih
*ups....keceplosan
dipotong ketukang jahit saja yuk biar pas mas
Kopi sudah siap sedia tadi beli satu renceng tinggal ambil di beranda depan blog saya ini mas?
Weeeeeeh mantap bener nih kang saud :TS ,, wah jadi pingin coba ^_^
saya juga pak pengen ngopi nih xixiii....
wah..wah..wah, kali ini mantap artikelnya pak, dari dulu saya mau nanya itu huruf pertama postingan bisa beda gitu blm sampai, sekarang sudah muncul postingan seperti koran, jadi ingin mencoba nih... hehehe... :)
Nah tuh Mas Yanto agak beneran dikit, tapi salahnya banyak hheh
Silahkan Mas De Nif, semoga bisa bermanfaat ya Mas?
Silahkan Mas Eka tinggal ambil dan seduh aja
kang Saud ampuuun
hebat euy hebat pisan dah pokoknya
saya pengin masuk koran jadinya
silakan dicoba sekarang, kalo nggak nanti disetrap
bayar
ya
langsung di kecup nih kang kodenya, kalau koran versi pertama mah saya malahan bingung bacanya, hehe.
makasih kecupannya ah
Nah silahkan Mang yang ini lebih simpel dan sedikit kodenya :)
mang hasil postingannya valid HTML5 ngga?
Padahal saya sudah kunjungi semua sahabat Cewek saya mas, namun kaya nya masih pada sibuk di dapur atau belum pulang kerja padahalkan saya nunggu dah lama nih.?
cuma iya doang? panjang amat Mas.?
jempol kaki dong
udah dikecup?
Silahkan Pak. semoga pada jilid dua ini, semakin mempermudah dalam pemasangan artikel yang menyerupai koran. sama sama Pak Uda :)
Silahkan Mas Yahya,, dengan senang hati saya persilahkan full gratis dari saya mah. Kalau lewat Mas Zach beda lagi urusanya tt3tt3 :D
PAS DI TES, MENTOK sama iklannya euy, kudu di geserin dulu iklannya atuh...hadeuh.
niceee infonyaaa masssss :) ...salam kenalll ..
Naroh kode koranya di bawah kode Iklanya Mang Lembu biar tampilan iklanya gak keganggu Mang. kan sayang penghasilan jadi keganggu kalau iklan yang di geser mah?
Silahkan Mas Eka, jika berkenan coba saja dengan senang hati saya persilahkan. Mas Zach setrap Mas Yanto aja deh yang agak nakal :D
Oke makasih atas kunjunganya. salam kenal juga Mas :mn
Kalau ingin postingan pake cara koran dan ingin Valid HTM5 Kode awal nya ganti dengan yan ini Mang :
<style type="text/css" scoped>
Dan coba cek valid HTM5 gak Mang Lembu?
Jempol Tangan 1 jempol kaki 1 impas kan Mas?
daripada nice info
nanti dipart 2
Dan naruh kode css koranya di tempatkan pada posisi awal Mang. dan kode pada postingan diatas sudah saya lengkapi dengan penambahan tag scope. Coba Mang Lembu Cek Postingan blog saya ini. pasti sudah VALID HTML5
Saya baca dan simpan dulu ya Mas Saud..
terima kasih atas info nya..
Ini sudah di part dua koran Paling nanti di Part 2 sahabat setia dan terbaik ya Mas Yanto, Mas Zach. sodok aja saya nya Mas? hhh =D
Apa apa pun...penggunaan warna warna di blog ini sudah pun cantik...
Kaya nya lagi pada ngehemat jari nie hh
Silahkan Kak Fidah, dengan senang hati. sama sama Kak :)
Hanya upaya sahaja nie Kak, sudah pun cantik cakap Kak Fidah tapi tak belum cantik cakap mereka :ct
wahh keren nih tutorial membuat postingan seperti korannya saya jadi kpincut kpengen nyoba nih kang :D
Bagaimana kalau empat jempol mas ? he,, he, he,,
Wah, dengan hasil postingan seperti koran jadi terlihat lebih hemat halaman ya Kang, jadi terlihat lebih inovasi, keren euy. :D
Salam
yang ini kayaknya simpel ya.. kodenya ga menakutkan seperti kemarin, kalau demonya sama seperti kemarin kang..?
irit..
udah saya coba di postingan terbaru ssaya...dan alhamdulillah sukses dengan sempurna...trimakasih skali mas saud :)
emang ada kode yang menakutkan ya mbak...atut dong
monggoo mas arjuna...mas saud kan orangnya baik sekali... :D
mau komplain nih mas saud...di postingan saya yang terbaru kok kode2nya kelihatan di halaman depan gitu ya ? tolong d cek ya...soalnya bagus sih tampilannya...
Yah Teh ini lebih ringkes kodenya gak nakutin lagi banyak nya :)
Maksudnya kebanyakan kodenya takut berat load blognya kali Pak Mas.. yang ini lebih sedikit kodenya sudah Valid HTML5 Lagi
Nahhh Empat jempol lebih keren Mas Indra :-bd
Irit apa pailit?
Silahkan Mas Ainnul dengan senang hati saya mempersilahkan :)
Bisa juga dibilang gitu ya Mas, yah iseng aja Mas kali aja ada yang berminat. makasih Mas Indra atas kunjunganya salam sukses :)
Subbhanallah betul sekali saya barusan cek di post baru sampean Pak Mas. terima kasih sudah berapresiasi dengan yang saya sajikan Pak :)
Yah silahkan Pak Mas Monggo pinarak. Pak Mas malah lebih baik
Saya sudah cek ke postingan baru sampean Pak dan saya lihat tidak ada kode yang bentrok. hanya saran saya agar halaman postingan Pak Mas bisa lolos VALIDASI HTML5 Taruh kode script Koran itu pada urutan posting paling atas. dan jangan lupa hapus tag kode trabidi on, dan tag </div> yang berlebih karena kode tersebut yang membuat ERROR Validasi HTML5 Pak Mas
Wah baru nemu nih postingan yang seperti ini mas, sip banget artikelnya :)
wah dari surat khabar kok jadinya pada ngopi nih hehe...
duduk menyimak penjelasannya mas saud
baca koran sambil ngopi
makanya koran jangan buat bungkus sayur
pada ngeri diantara cowok ganjen
sugeng enjing kang saud..
pagi2 baru bisa mencermati trik membuat posting dengan tampilan koran diblog, setelah paham tinggal dipraktekin..
matursuwun kang
selamat pagi pak Saud,, inspirasi dari koran ya bagus nih untuk artikel yang mempunyai karakter banyak di tambah biar tidak terlalu sering scroll ke bawah :D
ty
wah saya ketinggalan kereta nie, ternyata ada cara baru lagi toh, kayaknya kalo cara yang ini mendingan rada simpel gak kebanyakan kodenya ya, mudah-mudahan bisa ngikutin kalo pake cara yang ini mah... makasi mas atas sharingnya :)
sama saya juga, Mas Karrys emang top markotop deh :)
semakin keren aja postingan mas saud hehehe
eehh ternyata di postingan sudah di terapakan css column-gap sudah di terepkan disini ya mas. saya ketinggalan dong....
mantabbbb kanngg .. josssss pokoknyaa hehehe
salam siang Kang,,,walahhh ketinggalan berita nih,,,,,hapunten Kang baru bisa mampir nihhh,,,wah beneran seperti koran nih postingan kali ini ,tambah sippppppp
sami sareng abdi kang Marnes sayge ketinggalan nih hehehe
Tuhkan mas ANTHONIE saja baru nemu katanya,sami mawon ternyata
Tambah menarik saja tampilan postingannya ya.
Trims sharingnya !
saya duduk bersila ikutan menyimak penjelasannya sambil seruput kopi item, masih panas banget nie, ciyuuusss duaaah =D
Makin tambah menarik ya Mas Saud tentunya
nya sarua jeng abdi ari kitu mah :)
saya juga menyimak saja, nggak perlu komen di kolom komentar laah
Saya ngikut Mas Marnes deh kalau gitu, sambil nunggu Kopi nya keluar :D
iya kang gak apa-apa deh, lebih baik terlambat daripada tidak sama sekali, tapi bagusan sih jangan terlambat ya =D
Ajarin atuh mas saud kalau liat kode-kode kayak gitu suka puyeng :D
saya juga nyimak, pastinya tau dimana saya cari saat membutuhkan
tapi jangan menyemak ya mbak ocha dan mas em... nanti yang ada jadi ribut dah.. hehe
sore mas saud.. ada lirik yang indah tuk sore ini mas saud..
Alloh soreku ini atas fitrah islam
Atas agama Nabi Muhammad
Dan atas milah Nabi Ibrahim yang hanif
Ya Alloh selamatkanlah hadirku ???
berkunjung disini lagi mas saud...
sebenernya mudah kog mbak Ai... mudah banget pun...
Silahkan Mas Semua di coba yah semoga bermanfaat :)
Assalamualaikum..
BW sini
Assalamu 'alaikum..Kak Saud,..sekadar mampir saje nie Kak, ..!
kalo newspepernya dah dipake, jangan dibuang ya Kak..!, awak nak pake..!
wah mantep nihh kang...
wah mantep juga mas, memang ini sangat keren dan bisa juga untuk dicoba
Keren, Kang.. Thank's for sharing :D
pertamax hehe
Ajarin dong mas jay :D wkwkwk
Jangan Komentar Promosi, Link Hidup, Spam Karena akan terhapus
Silahkan untuk "Follower blog, atau Berlangganan Lainya" di blog ini
Untuk Mengkonversi kode dan icon Smiley silahkan Klik dibawah ini
Show Konversi KodeHide Konversi Kode Show SmileyHide Smiley Follower