kondangmurah Posted September 6, 2013 Share Posted September 6, 2013 Mau tanya para master... Bagaimana cara agar halaman prestashop menjadi full screen [ margin dengan tepi layar kira2 15px ] menggunakan CSS.. Saya sudah mencoba edit global.css sedemikian rupa tetapi hasilnya nihil.. presta saya ada di www.indogadgetstore.com Thanks master. Link to comment Share on other sites More sharing options...
gonebdg - webindoshop.com Posted September 6, 2013 Share Posted September 6, 2013 Mungkin yang dimaksud adalah Full width ya ... bukan Full Screen Prestashop pada dasarnya menggunakan themes dengan aturan Fixed Width. Dengan demikian tampilan halaman menjadi full width atau tidaknya tergantung target monitor client. Qlo width diatur ke 980px lalu client menggunakan monitor 1280px, ya tidak akan tampil full width. Dan jika client menggunakan monitor lama yang resolusinya masih 800px, maka lebar halaman akan overlapping. Jika ingin tampilan websitenya selallu full width tanpa peduli berapa resolusi monitor client, maka theme-nya harus di rubah menggunakan aturan layout Fluid yaitu menggunakan nilai relative (persentase) untuk nilai width-nya Misalnya sebuah halaman website dibagi dengan html division seperti dibawah ini : <div id="page"> <div id="left_column">LEFT CONTENT</div> <div id="center_column">CENTER CONTENT</div> <div id="right_column">RIGHT CONTENT</div> </div> Kalau ingin tampilannya sellalu Full Width, maka CSS-nya dibuat seperti ini : #page {width: 100%} #left_column, #right_column {width: 10%} #center_column {width:75%;margin: 0 5px;} Namun ... kemudian yang harus anda cermati adalah kontennya, terutama gambar. Bila semua kolom diatur secara fluid, maka lebar masing-masing kolom tsb akan berubah mengikuti lebar monitor client, namun isi atau konten dalam masing-masing kolom tsb terutama gambar ukurannya adalah fixed. Konten gambar yang ukurannya fixed tidak akan ikut menyesuaikan sehingga kemungkinan besar tampilan konten menjadi tidak enak dilihat atau bahkan acak-acakan. Nah hal inilah yang harus anda perhitungkan baik-baik, apa dan bagaimana agar tampilan tetap baik dan enak dilihat. Untuk lebih jelasnya mengenai Layout Fluid, silahkan merujuk ke : http://matthewhartman.github.io/base/docs/grid.html CSS kodenya menurut saya sangat baik serta support mobil browser sehingga biasa saya gunakan/terapkan untuk website klien 2 Link to comment Share on other sites More sharing options...
Rizki22 Posted November 27, 2013 Share Posted November 27, 2013 (edited) Misi gan sya mau tnya sya kan sudah menghilangkan smua block module yg ada dibagian kiri dan kanan Jadi di tampilan index cma ada image slider dan featured product Nah yg sya mau tanyain Bgaimana ch cara ya membuat featured product satu halaman dari kiri smpai kanan ,, atau gak bagaimana cara ya menambahkan featured product menjadi 5 atau 6 ke samping ya Kan default ya cma 4 yg ditampilin difeatured product. Mksi sblm ya Mhon bantuan ya Sya pakai prstashop 1.5.6 Edited November 27, 2013 by Rizki22 (see edit history) Link to comment Share on other sites More sharing options...
Rizki22 Posted November 28, 2013 Share Posted November 28, 2013 Mungkin yang dimaksud adalah Full width ya ... bukan Full Screen Prestashop pada dasarnya menggunakan themes dengan aturan Fixed Width. Dengan demikian tampilan halaman menjadi full width atau tidaknya tergantung target monitor client. Qlo width diatur ke 980px lalu client menggunakan monitor 1280px, ya tidak akan tampil full width. Dan jika client menggunakan monitor lama yang resolusinya masih 800px, maka lebar halaman akan overlapping. Jika ingin tampilan websitenya selallu full width tanpa peduli berapa resolusi monitor client, maka theme-nya harus di rubah menggunakan aturan layout Fluid yaitu menggunakan nilai relative (persentase) untuk nilai width-nya Misalnya sebuah halaman website dibagi dengan html division seperti dibawah ini : <div id="page"> <div id="left_column">LEFT CONTENT</div> <div id="center_column">CENTER CONTENT</div> <div id="right_column">RIGHT CONTENT</div> </div> Kalau ingin tampilannya sellalu Full Width, maka CSS-nya dibuat seperti ini : #page {width: 100%} #left_column, #right_column {width: 10%} #center_column {width:75%;margin: 0 5px;} Namun ... kemudian yang harus anda cermati adalah kontennya, terutama gambar.Bila semua kolom diatur secara fluid, maka lebar masing-masing kolom tsb akan berubah mengikuti lebar monitor client, namun isi atau konten dalam masing-masing kolom tsb terutama gambar ukurannya adalah fixed. Konten gambar yang ukurannya fixed tidak akan ikut menyesuaikan sehingga kemungkinan besar tampilan konten menjadi tidak enak dilihat atau bahkan acak-acakan. Nah hal inilah yang harus anda perhitungkan baik-baik, apa dan bagaimana agar tampilan tetap baik dan enak dilihat. Untuk lebih jelasnya mengenai Layout Fluid, silahkan merujuk ke : http://matthewhartman.github.io/base/docs/grid.html CSS kodenya menurut saya sangat baik serta support mobil browser sehingga biasa saya gunakan/terapkan untuk website klien Misi gan sya mau tnya sya kan sudah menghilangkan smua block module yg ada dibagian kiri dan kanan Jadi di tampilan index cma ada image slider dan featured product Nah yg sya mau tanyain Bgaimana ch cara ya membuat featured product satu halaman dari kiri smpai kanan ,, atau gak bagaimana cara ya menambahkan featured product menjadi 5 atau 6 ke samping ya Kan default ya cma 4 yg ditampilin difeatured product. Mksi sblm ya Mhon bantuan ya Sya pakai prstashop 1.5.6 Link to comment Share on other sites More sharing options...
Recommended Posts