Cara Mengatur Halaman Blog Agar Responsive - Responsive atau "RESPON" berarti menerima dan dapat menyesuaikan diri terhadap hal-hal yang diterima serta dapat mengatur letaknya sesuai dengan dimana halaman tersebut terbuka sebagai tempat. Responsive bisa juga diartikan sebagai fleksibel area halaman blog, jika halaman dibuka pada resolusi layar yang kecil, maka tampilan halaman blog akan mengikuti lebar layar yang Anda gunakan saat membuka halaman blog saat ini. Sebagai contoh coba Anda minimalkan ukuran layar monitor Anda saat ini, maka secara otomatis halaman akan ikut menyusut mengikuti resolusi layar, hal inilah yang disebut dengan Responsive Page.
Bukan hanya itu, bahkan sebuah website dituntut harus mampu malakukan pendekatan untuk mengatur hasil tampilan halaman yang menunjukkan bahwa desain dan perkembangan dapat merepon dan tanggap pada perilaku pengguna berdasarkan ukuran, platform dan orientasi layar secara otomatis. Dengan kata lain sebuah website harus memiliki sistem teknologi otomatis untuk dapat merespon preferensi pengguna berdasarkan resolusi layar yang digunakan seperti Komputer PC, Laptop, Netbook, Tablet, SmartPhone dan Mobile Phone.
Top Artikel - CSS Flower Navigasi Efek Rotasi
Tidak semua ukuran resolusi layar pada perangkat yang Anda gunakan sama, semua memiliki lebar dan tinggi yang berbeda-beda, untuk itu kita perlu mengatur halaman blog agar responsive, sehingga letak dan layout halaman tetap dalam tampilan yang rapi dimanapun halaman tersebut terbuka dengan menambahkan kode @media-screen, contoh seperti ini:
Dengan pengaturan @media-layout diatas, maka jika halaman blog terbuka pada resolusi layar yang kurang dari 800px, halaman akan secara otomatis berubah tampilan menjadi 1 kolom full, contohnya pada layar tablet atau mobile phone yang memiliki ukuran layar yang cukup kecil, sehingga tampilan halaman akan menempatkan kolom sidebar dibawah setelah halaman posting secara sejajar dalam 1 kolom.
Berikut Cara Mengatur Halaman Blog Agar Responsive
1. Penempatan Kode
1.1. Tag Meta Responsive
Temukan kode <head> pada Template Anda, lalu letakkan kode ini dibawahnya:
1.2. CSS Lay Out Media
Kemudian letakkan kode berikut pada HTML Template Anda sesuai elemen id pada area masing-masing untuk mengatur lebar tampilan halaman yang responsive seperti ini:
2. Penyesuaian Kode
Pengaturan kode ini saya ambil langsung untuk mengatur halaman blog ini agar responsive, bahkan letak menu navigasi, kolom pencarian dan tombol share semua sudah saya atur agar responsive yang artinya elemen ID untuk halaman yang saya gunakan belum tentu sama seperti yang Anda gunakan, jadi silahkan Anda sesuaikan terlebih dahulu ID apa yang Anda gunakan untuk mengatur letak halaman pada Template Anda. Contoh seperti kode ini:
Nah jika sudah ketemu, Anda bisa tambahkan pada pengaturan media-screen pada masing-masing area pada CSS diatas, mudah bukan..!!! hehe.... semoga artikel ini dapat membantu sahabat semua pecinta SAHABAT BLOGGER 77 dalam mengatur halaman blog yang responsive dengan tampilan yang rapi. Happy blogging.
Bukan hanya itu, bahkan sebuah website dituntut harus mampu malakukan pendekatan untuk mengatur hasil tampilan halaman yang menunjukkan bahwa desain dan perkembangan dapat merepon dan tanggap pada perilaku pengguna berdasarkan ukuran, platform dan orientasi layar secara otomatis. Dengan kata lain sebuah website harus memiliki sistem teknologi otomatis untuk dapat merespon preferensi pengguna berdasarkan resolusi layar yang digunakan seperti Komputer PC, Laptop, Netbook, Tablet, SmartPhone dan Mobile Phone.
Top Artikel - CSS Flower Navigasi Efek Rotasi
Tidak semua ukuran resolusi layar pada perangkat yang Anda gunakan sama, semua memiliki lebar dan tinggi yang berbeda-beda, untuk itu kita perlu mengatur halaman blog agar responsive, sehingga letak dan layout halaman tetap dalam tampilan yang rapi dimanapun halaman tersebut terbuka dengan menambahkan kode @media-screen, contoh seperti ini:
//halaman hanya akan tampil dengan lebar maksimal 800 piksel
@media only screen and (max-width:800px) {
//pengaturan halaman full (1, 2 atau 3 kolom)
#outer-wrapper {width:750px; margin:0 auto;}
//halaman posting (jika pada mobile phone akan tampil individu)
#main-wrapper {width:750px;}
//layout sidebar
#sidebar-wrapper {width:750px;}
//layout kolom footer
#footer {width:750px;}
}
@media only screen and (max-width:800px) {
//pengaturan halaman full (1, 2 atau 3 kolom)
#outer-wrapper {width:750px; margin:0 auto;}
//halaman posting (jika pada mobile phone akan tampil individu)
#main-wrapper {width:750px;}
//layout sidebar
#sidebar-wrapper {width:750px;}
//layout kolom footer
#footer {width:750px;}
}
Dengan pengaturan @media-layout diatas, maka jika halaman blog terbuka pada resolusi layar yang kurang dari 800px, halaman akan secara otomatis berubah tampilan menjadi 1 kolom full, contohnya pada layar tablet atau mobile phone yang memiliki ukuran layar yang cukup kecil, sehingga tampilan halaman akan menempatkan kolom sidebar dibawah setelah halaman posting secara sejajar dalam 1 kolom.
Berikut Cara Mengatur Halaman Blog Agar Responsive
1. Penempatan Kode
1.1. Tag Meta Responsive
Temukan kode <head> pada Template Anda, lalu letakkan kode ini dibawahnya:
<meta content='width=device-width, initial-scale=1, maximum-scale=1' name='viewport'/>
1.2. CSS Lay Out Media
Kemudian letakkan kode berikut pada HTML Template Anda sesuai elemen id pada area masing-masing untuk mengatur lebar tampilan halaman yang responsive seperti ini:
<style type='text/css'>
@media only screen and (min-width:768px) and (max-width:999px){
#outer-wrapper{width:754px}
#main-wrapper{width:60%}
#sidebar-wrapper{width:40%}
#headnya{max-width:260px;min-width:250px}
#head-ads .widget{margin:15px 0}
#header h1,#header p{padding:15px 0 0;font-size:240%}
#header .description{padding:0 0 10px}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:767px){
#outer-wrapper{width:440px}
#sidebar-wrapper,#main-wrapper,#isifooternya{width:100%}
#isifooternya .footer-wrap{width:100%}
#nav{...}
#search-result-container{width:100%}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#outer-wrapper{width:310px}
#header h1,#header p{font-size:230%}
//tambahkan elemen id lainnya disini...
}
@media only screen and (min-width:768px) and (max-width:999px){
#slides ul{height:200px}
#slides h4{font-size:15px}
#slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:11px}
.post-outer{width:100%}
.post{width:370px}
.blog-posts.hfeed::before{left:27px}
.post-body p{overflow:visible}
.post h2.post-title{height:auto;}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#slides ul{height:450px}
.post{width:228px}
.post h2.post-title{max-height:200px;}
.post-body p{font-size:11px;padding:0}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#social-side2{padding:0}
#social-side2::before{content:""}
//tambahkan elemen id lainnya disini...
}
</style>
@media only screen and (min-width:768px) and (max-width:999px){
#outer-wrapper{width:754px}
#main-wrapper{width:60%}
#sidebar-wrapper{width:40%}
#headnya{max-width:260px;min-width:250px}
#head-ads .widget{margin:15px 0}
#header h1,#header p{padding:15px 0 0;font-size:240%}
#header .description{padding:0 0 10px}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:767px){
#outer-wrapper{width:440px}
#sidebar-wrapper,#main-wrapper,#isifooternya{width:100%}
#isifooternya .footer-wrap{width:100%}
#nav{...}
#search-result-container{width:100%}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#outer-wrapper{width:310px}
#header h1,#header p{font-size:230%}
//tambahkan elemen id lainnya disini...
}
@media only screen and (min-width:768px) and (max-width:999px){
#slides ul{height:200px}
#slides h4{font-size:15px}
#slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:11px}
.post-outer{width:100%}
.post{width:370px}
.blog-posts.hfeed::before{left:27px}
.post-body p{overflow:visible}
.post h2.post-title{height:auto;}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#slides ul{height:450px}
.post{width:228px}
.post h2.post-title{max-height:200px;}
.post-body p{font-size:11px;padding:0}
//tambahkan elemen id lainnya disini...
}
@media only screen and (max-width:479px){
#social-side2{padding:0}
#social-side2::before{content:""}
//tambahkan elemen id lainnya disini...
}
</style>
2. Penyesuaian Kode
Pengaturan kode ini saya ambil langsung untuk mengatur halaman blog ini agar responsive, bahkan letak menu navigasi, kolom pencarian dan tombol share semua sudah saya atur agar responsive yang artinya elemen ID untuk halaman yang saya gunakan belum tentu sama seperti yang Anda gunakan, jadi silahkan Anda sesuaikan terlebih dahulu ID apa yang Anda gunakan untuk mengatur letak halaman pada Template Anda. Contoh seperti kode ini:
#outer-wrapper
#main-wrapper
#sidebar-wrapper
#main-wrapper
#sidebar-wrapper
Nah jika sudah ketemu, Anda bisa tambahkan pada pengaturan media-screen pada masing-masing area pada CSS diatas, mudah bukan..!!! hehe.... semoga artikel ini dapat membantu sahabat semua pecinta SAHABAT BLOGGER 77 dalam mengatur halaman blog yang responsive dengan tampilan yang rapi. Happy blogging.
TERIMA KASIH ATAS KUNJUNGAN SAUDARA
Judul= Cara Mengatur Halaman Blog Agar Responsive
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 >>
ngemeng2 blog sy sih dh responsive blb yah .... hehehehe :)
BalasHapushmmmm,,,,,kasih tahu gak ya..?
Hapusciaaaaaaaaaaaaaah ..... devy mw maen petak umpet nih rupanya ,,,
HapusLho koq malah main kucing kucingan bukanya cepetan pasang script responsive ini pada blog Mas Fiu. biar lebih keren bloge Mas? yah Kan Mbak Devy..? :-bd
Hapushahahaha,,, itu mas saud ,,, devy nya ngajak petak umpet dulu ama sy ,,, :)
Hapusmana jurus modusnya nih mas afgan.kwkwk
Hapusmodus apa sih yah ? hmmmm ,,,,hehe
Hapusaku nggak trimaa....
Hapushahahah,,,, klo gak trima besok request lg tadz ,,,biar kirimanya bisa dikirm lg ,,,, :P
HapusKalau gak salah blog saya sudah pasang yang begituan deh Mbak Devy.. tapi kayanya script Responsive Mbak Devy lebih kerenan dikit eh dengan yang ada pada template saya. makasih atas berbaginya ya Mbak salam ceria :)
BalasHapusmenambahkan letak layout halaman posting, tidak ada pengecualiaan, semuamya saya tambahkan disana, seperti ini:
Hapus[pre]@media only screen and (min-width:768px) and (max-width:999px){
#slides ul{height:200px}
#slides h4{font-size:15px}
#slides li:nth-child(3) h4,#slides li:nth-child(2) h4{font-size:11px}
.post-outer{width:100%}
.post{width:370px}
.blog-posts.hfeed::before{left:27px}
.post-body p{overflow:visible}
.post h2.post-title{height:auto;}
}[/pre]
karena bisa saja, seperti menu navigasi tidak ikut menyusut saat layar diminimalkan, kalau bisa sebisa mungkin apa saja yang tampail pada halaman utama blog semua diatur ke tampilan yang responsive
Saya masih setia dengan yang sekarang sih Mbak. namun yang Mbak Devy sarankan bagus juga. cuma jangan kelewat gak tau aja dengan Responsive. rada mumet soalnya kalau harus bongkar bongkar lagi. pas ada yang keliru maka lumayan nyari yang errornya. makasih pencerahanya :)
Hapuskalau template yang saya pake, masih ada scroll di bawah browser kalau browser dikecilkan mbak
BalasHapusberarti belum responsive kang..
Hapusya..ya ..makasi juga pernah menyarankan agar memakai template responsive..!,
BalasHapusaku ga pernah nyuruh kok hehe.. *lariiii*
Hapustangkep mbak santika yuu b-(
HapusOya tambahan elemen disini itu bisa diisi dengan apa aja ya lebih jelasnya?
BalasHapusIni sangat bermanfaat jadi memaksimalkan tampilan.
Datang juga ya ada puisi yang perlu dikomentari.
Sudah saya terapkan mbak (o)
BalasHapusterus berhasil gak..?? hehehe...
Hapuskasi tau ga yaaa :p
HapusKayanya blog saya sudah responsive jadi ga perlu repot-repot lagi. Terima kasih mbak, tapi saya amankan dulu deh siapa tau kapan-kapan membutuhkan
BalasHapusuntung blogku udah responsive jadinya nggak perlu susah2 nerapin kodenya mbak
BalasHapusiya mas... saya juga responsive.. tapi yang lebih menantang lagi blogazine itu mas.. :) setiap postingan gitu harus responsive.. hehe :)
Hapuspengaturan melalui sistem yang otomatis mas, karena suka lupa jika harus mengeditnya secara manual
Hapusheemmm yang mengatur-ngatur responsive ini lah sangat membingungkan.. apalagi dengan gaya blogazine, tampilan postingannya harus responsive juga... ;(
BalasHapusThanks mbak atas informasinya, sangat membantu.
BalasHapusSalam blogger, halo semua,, Newbie disni nih...
BalasHapusNice Interaction.. Knjungi kembali yaaahh..,Trimakasih. :)
selalu dapat pelajaran baru tiap berkunjung kesini, template aku sudah responsive ya mba, aku masih pakai template orang, andai aku bisa bikin template sendiri..
BalasHapusSemakin responsive template blog maka semakin cepat laju untuk lebih mendapat visitor di serp ya Mbak. Apa keuntungan lain tentang Responsive dengan Validasi HTML 5 Mbak Devy.? Maaf nih saya hanya bertanya mohon pencerahan maksudnya. Terkadang begini Mbak pada jiwa seorang blogging. Tentang SEO Dan segala bisa pada semua element kode, namun pada yang nama nya validasi HTM5 Suka mengabai kan..? menurut Mbak Devy sendiri, tanggapan mengenai html 5 gimana coba Mbak. maaf rada meleset dikit. thx
BalasHapustidak kenapa-kenapa mas, kan ada kolom komentar untuk saling berbagi.
HapusHTML 5 adalah rekomendasi yang harus digunakan web oleh W3C, karena versi-versi pada HTML untuk saat ini sudah pada tahap akhir perubahan dan perkembangan yaitu HTML versi 5.
apa itu HTML5 dan keunggulannya.?
Lihat disini - Pengertian HTML Versi 5
sedangkan tentang validasi kode ini merupakan unsur yang ada didalam konsep HTML5 tersebut. makanya apakah kode yang akan kita sisipkan sudah valid HTML5 atau belum pada versi templatenya.
[blockquote]Responsive Page dan HTML5 tidak ada hubungannya dengan SEO. karena tujuan SEO adalah posisi serp pada google penelusuran, karena SEO adalah identik dengan pekerjaan kita dalam membangun sebuah blog.[/blockquote]
Rupanya seperti itu yah Mbak Devy makasih atas pencerahanya (c)
Hapusnyimak saja ahh soalnya saya nda ngerti mba devy..dengan script mba devy diatas blog saya ahirnya jadi responsive juga.mksh atuh tlh berbagi
BalasHapusrequest cara membuat halaman blogger jadi satu kolom donk mbak....
BalasHapusditunggu banget lho tutorialnya :d
tidak sulit kok mas, jadi tidak perlu saya buatkan tutorialnya, karena secara umum template memiliki 3 kolom halaman tampilan
Hapus1. posting page
2. sidebar <aside>
3. footer
yang semua tampilannya sangat jelas dituliskan saat kita membentangkan struktur HTML template, mas tinggal hapus saya elemen-elemen yang mengatur kolom halaman tersebut, misalnya menghapus kode elemen sidebar.
namun ingat, jika sudah dihapus, maka blog hanya menampilkan halaman posting saja, sedangkan lebar halaman masih sama saat sidebar masih tampil, tinggal ubah lebar halaman postingnya sesuai keinginan.
atau jika dengan js, mas bisa pelajari disini-
► Menampilkan Postingan Blog Secara Layar Penuh
Disana saya membuat sebuah tombol pemicu untuk mengubah halaman blog menjadi 1 layar penuh (Full Screen).
ini yang uptodate,
BalasHapusblog saya responsiv nggak yah ? :)
kta si mpunya template sih udah responsiv tapi pastinya ya Wallaahu a'lam...
BalasHapussaya kok kagum ya sama mbak devy,,,njelasin soal ginian kayak njelasin pelajaran klas 1 sd... dulu gimana sih blajarnya... :D
dulu belajarnya sama saya, pak :p
Hapuskebetulan saya sama mbak devy satu bangku :p
satu bangku, satu kelas, dan satu sekolahan, namun waktu naik kelas kita berpisah, devy ambil jurusan bandung jakarta, dan kang jum ambil jurusan jakarta bogor, jadi tidak sebangku lagi dalam bis. hehe..
Hapusinfo baru nih jadi tahu hehehe
BalasHapusterimakasih mba devy :)
dengan penambahan doce tersebut, semua browser baik desktop maupun mobile akan dapat menampilkan halaman website kita dengan sempurna ya Mbak
BalasHapuskurang lebih seperti itu mas, karena dewasa ini, mobile sudah dapat mengakses internet layaknya komputer PC, yang membedakannya adalah revolusi layar yang digunakan.
Hapuskodenya lama-lama kalau dilihat makin kerenz ya mbak :p
BalasHapusdalam artian : bisa membuat bintang kejora diatas kepala (pusing) :p
weh mantap sekali, saya sudah responsive jadi tak perlu lagi, hahaha
BalasHapusNumpang nyimak artikel tantang Cara Mengatur Halaman Blog Agar Responsive. :)
BalasHapusternyata di blog ini banyak sekali artikel yang bisa menambah wawasan saya.
trima kasih ya....
kode template yg sy pake sudah ada script dasar responsive, tapi sepertinya blm responsive. save kode dulu ntar diterapin.
BalasHapusWah template saya udah responsive bos...
BalasHapusberarti tidak perlu menambahkan lagi ya secara manual,
HapusKunjungan perdana mba
BalasHapuswahhh kira" tampilan blogg saya udah responsive blom yah mbak hehe ? maklum saya masih bener bener newbie mbak jadi belom begitu faham :)
BalasHapusKeren infonya nih, makasiih yaaa ;)
BalasHapussalam blogger..
BalasHapusnice blog, bisa di terapin nih tutornya,,
Tampilan blog ku, di dekstop sama mobile perbedaan mencolok banget.. Knapa itu ya ^-^
BalasHapuskan sudah jelas perbedaan pada resolusi layar mas. kalau pada layar mobile apakah halaman blog dapat tampil semua (tidak terpotong), atau tidak, ini yang dimaksud responsive page.
Hapussuper sekali mbak, langsung saya pelajarin :-b
BalasHapuswah aku sangat membutuhkan artikel kakak ini lah, terima aksih ya kakak...
BalasHapusjadi menyesuaikan lebar dan tinggi kolom pada masing-masing blog untuk membuat responsive dalam tampilan ya gan. ok terima kasih atas pencerahannya. salam sababat blogger.
BalasHapusSy menggunakan template responsif..! Tapi ketika sy mengganti logo header dengan gambar, dan membukanya menggunakan android, tampilan logo tersebut terpotong sebagian, karn tdk menyesuaikan dengan perangkat yg sy gunakan, kira kira kode apa yg perlu sy tambahkan agar logo yg sy gunakan jg bisa menyesuaikan dengan perangkat mobile. Makasih
BalasHapusibarat kolom komentar yang kita tidak pernah membuat untuk menampilkan gambar sipemberi komentar, itu karena ada script yang terpasang secara otomatis saat template diadopsi ke blog untuk digunakan.
Hapussama seperti header, yang merupakan salah satu area halaman dalam HTML template, jika gambar yang kita sisipkan secara langsung dengan menggatinya lewat edit-tata letak, maka gambar akan tampil secra default (tidak akan menyusut bila gambar dibuka pada revolusi layar yang kecil), jadi tidak ada penambahan kode, tetapi tempatkan gambar pada HTML header-page ditemplate Anda, sehingga gambar ada pada area header.
jadi gambar musti diupload dulu yah ke media penyimpanan online, kemudian kita ambil link kode gambarnya dan menyisipkannya dalam header ??
Hapustepatnya sih bukan di upload, tetapi letakkan URL-gambar pada area header-page secara langsung pada kode HTML Template.
Hapusnie kode HTML Headernya kaya gini
Hapus/* CSS Global Wrapper */
#outer-wrapper {max-width:1100px;margin:20px auto;padding:20px;overflow:hidden;}
#post-wrapper {float:left;width:70%;margin:0 0 10px;}
.post-inner {padding:15px 15px 0 0;}
#header-wrapper {width:100%;margin:0 auto;margin-bottom:15px;overflow:hidden;}
#header {float:left;width:100%;max-width:257px;}
.header-right {float:right;padding:0;overflow:hidden;margin:0;width:100%;
max-width:728px;}
.header-wrapper2 {position:relative;z-index:999;}
#sidebar-wrapper {float:right;width:30%;margin:0 auto;}
.sidebar-inner {padding:15px 0;}
#footer-wrapper {width:100%;text-align:left;overflow:hidden;margin:20px 0px 0px 0px}
#footer-widgetfix .footer-widget {width:30.6%;float:left;margin-left:20px;}
#footer-widgetfix {max-width:1100px;overflow:hidden;margin:0 auto;}
#footer-wrapper .widget-content {text-align:left;margin:20px 0 15px;}
#footer-wrapper .widget-content li {margin-left:-14px;}
#footer-wrapper .widget li {margin:5px 0 0 0;padding:5px 0 0 15px;display:block;}
#credit {width:98%;margin:0 auto;}
.credit-left {text-align:center}
.credit-right {float:right;margin:9px 0 0}
.footer-bottom {min-height:40px;}
#footx1,#footx2,#footx3 {margin:0 .2%}
.footer {padding-bottom:.2em;}
#social_networks{width:100%;display:block;margin:0 auto;text-align:center;}
#social_networks ul {list-style:none;}
.lyco-search {position:relative;padding:0;height:0;margin:0 auto;}
/* CSS Header Wrapper */
#header-wrapper {width:100%;margin:15px auto;overflow:hidden;padding:0;}
#header {float:left;width:100%;max-width:257px;color:#46515e;margin:0;}
#header h1, #header p {font-family:'Open Sans';font-size:250%;font-weight:400;color:#46515e;text-transform:uppercase;display: none;}
#header a {color:#46515e;text-decoration:none;transition:all 0.3s ease-in-out;}
#header a:hover {color:#cbbb7f;}
#header .description {font-family:'Open Sans';font-size:100%;font-weight:400;color:#5b686a;text-transform:none;display: none;}
.header img {display:block;}
.header-right {float:right;padding:0;overflow:hidden;margin:0;width:100%;
max-width:728px;}
.header-right img {display:block;}
kira kira sy harus merubah kode / menyisipkan kode apa jika header menjadi responsif secara keseluruhan
malam sobat mau nanyak soal buat halaman blog utama gimana cara nya makasih
BalasHapushalaman blog utama maksudnya seperti apa ya, membuat diagaram blog menjadi beberapa sumber dengan 1 halaman utama atau giman.?
Hapuskalau saya kurang ngerti sama yang beginian, download yang sudah jadi saja :D
BalasHapusmaksihhh bossss
BalasHapusSusah juga ya template responsive untuk dipahami he...he...maklum baru beralih ke responsive. Ok makasih dah berbagi. Salam sukses Sob
BalasHapusbenar2 ga ngerti saya mba devy, kmarin saya coba terapin, hasilnya malah kacau balau
BalasHapusmohon pencerahannya mba... soalnya kemarin saya cek blogsaya seonya cuman 48% mba.. mengerikan
boleh ga minta emailnya mba... saya kirim aja sekalian template saya... saya bingung sekali
BalasHapusmba devy
Devy akan kirimkan ke akun G+ aja ya, soalnya kalau disini ntar banyak yang tahu, hehe..!!
HapusYa mba.... makasih ya 'Mba...
Hapusmaaf Mba devy...
Hapusklo boleh ini E-Mail saya
mtpurba86@gmail.com
ntar coba liat dan coba...makasih tipsnya
BalasHapustolooooonnngggggg....toloooooooonnngggggg.... ;((
BalasHapuspunya saya menu dan widget bawah pada halaman utama tidak ikut responsive bingung cari elemen id-nya tuoloooongggg... mohon pencerahannya guru!!!! ;-(
Mba, sy pakai template responsive tp ga full responsive, jadi sy coba pakai cara yg mba tulis diatas tapi blank. Tolong kalau bisa mba email kosong sy ke jagatrayadi01@gmail.com biar sy bisa kirim template lengkapnya mba. Terima Kasih sebelumnya.
BalasHapusoceeeee
BalasHapusgan saya masih bingung gan untuk penerapan css layoutnya dimana ya gan. thx
BalasHapus