Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
I use the default template
opencart 3.0.3.2 arabic template
I just want to adjust the product size on the home page (start page)
When you open your store from a mobile browser
The default mobile form shows one product per row, but I need to show two products in each row. What is the modification to that?
wish help
You need to change
catalog/view/theme/default/template/product/product.twig
{% set class = 'col-xs-8 col-sm-6' %}
CHANGE TO
{% set class = 'col-xs-6 col-sm-6' %}
Attachments
Screen-Shot-2019-07-29-2.jpg (47.2 KiB) Viewed 789 times
Screen-Shot-2019-07-29-1.jpg (36.26 KiB) Viewed 789 times
DISCLAIMER:
You should not modify core files .. if you would like to donate a cup of coffee I will write it in a modification for you.
https://www.youtube.com/watch?v=zXIxDoCRc84
You would need to change
catalog/view/theme/default/template/extension/module/featured.twig
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12">
CHANGE TO
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-6”>
OR set up a mobile view in css catalog/view/theme/default/stylesheet/stylesheet.css
@media (max-width: 768px){
.product-layout.col-lg-3.col-md-3.col-sm-6.col-xs-12 {
width: 50%;
}
}
OR if you ONLY WANT THIS IN THE featured module (or whatever) - you can add the directive to the twig file in enclosing <style> tag
<style>
@media (max-width: 768px){
.product-layout.col-lg-3.col-md-3.col-sm-6.col-xs-12 {
width: 50%;
}
}
</style>
Attachments
Screen-Shot-2019-07-29-4.jpg (11.09 KiB) Viewed 777 times
Screen-Shot-2019-07-29-3.jpg (68.01 KiB) Viewed 777 times
DISCLAIMER:
You should not modify core files .. if you would like to donate a cup of coffee I will write it in a modification for you.
https://www.youtube.com/watch?v=zXIxDoCRc84
I change
catalog/view/theme/default/template/extension/module/featured.twig
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12">
CHANGE TO
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-6”>
BUT NOTHING CHANG ........
AND USED 2ND WAY>>>>>
set up a mobile view in css catalog/view/theme/default/stylesheet/stylesheet.css
@media (max-width: 768px){
.product-layout.col-lg-3.col-md-3.col-sm-6.col-xs-12 {
width: 50%;
}
}
NOW DONE
THANK YOU VERY MUCH
BUT HAVE NEW PROBLEM NOW . SIZE PRODUCT NOT SAME AT A MOBILE VIEW
HOW CAN FIX THAT
That's because the FAQ was unfollowed: viewtopic.php?f=176&t=200804#p718325m.3ls7hat wrote: ↑Tue Jul 30, 2019 11:52 amyes talking about the featured module on the home page on a mobile
I change
catalog/view/theme/default/template/extension/module/featured.twig
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-12">
CHANGE TO
<div class="product-layout col-lg-3 col-md-3 col-sm-6 col-xs-6”>
BUT NOTHING CHANG ........
AND USED 2ND WAY>>>>>
set up a mobile view in css catalog/view/theme/default/stylesheet/stylesheet.css
@media (max-width: 768px){
.product-layout.col-lg-3.col-md-3.col-sm-6.col-xs-12 {
width: 50%;
}
}
NOW DONE
THANK YOU VERY MUCH
BUT HAVE NEW PROBLEM NOW . SIZE PRODUCT NOT SAME AT A MOBILE VIEW
HOW CAN FIX THAT
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
Users browsing this forum: No registered users and 157 guests