Phoca Forum

I use Phoca Cart template on my Joomla site, the Home Page is Category List with 3 columns, on mobile I see only 1 column.
I need 2 columns on mobile but I can't find where insert this information.
Thank You

Hi, can you paste a screenshot of what do you exactly mean? Mostly Phoca Cart is stylized by Bootstrap, so Bootstrap decides how many columns will be displayed on each device

Jan

https://i.imgur.com/a3RqAwf.jpg

These are the screenshots, I have never touched the Bootstrap and I don't even know where to intervene, I'm not very experienced (very little)

Hi, there can be two ways to do:

- change the CSS ond override Bootstrap rules for mobile views
- or change the HTML output of Phoca Cart category view and set own Bootstrap classes

e.g.:
components\com_phocacart\layouts\items_grid.php

line cca 28
FROM TO: Change col-xs-12 (one column for small devices) to col-xs-6 (two columns)

The file can be overriden by your template so the changes will be not lost when updating ( https://www.phoca.cz/documents/116-phoc ... -overrides )


Jan

Thank You Jan, I tried editing all the files in the components\com_phocacart\layouts directory (all the files with col.xs.12 code instruction) but nothing has changed. I read your document but I did not understand where to act, I am almost a beginner and I don't know how to modify bootstrap and how to use override

Hi, if you have changed the files directly, then see if the changes are even displayed on the site (see it with e.g. google chrome devtools). Are the changes displayed in the source code?

Jan

no, I see "<div id="ph-pc-categories-box" class="pc-categories-view"><div class="ph-categories"><div class="row ph-row-flex grid ph-row-cats ph-lazyload"><div class="col-xs-12 col-sm-4 col-md-4 row-item">", i know i should edit "col-xs-12" to "col-xs-6" but i don't know which file to edit

Hi, it depends on which output do you use. If you use standard category view with grid, then:

components\com_phocacart\layouts\items_grid.php

there are thre forms of displaying product boxes in category view:

GRID: LIST GRIDLIST (items_grid.php, items_list.php, items_gridlist.php)

Jan

I modified all the items files, it's like reading other files. I modified all the files in components\com_phocacart\layouts with the "col.xs.12" instruction.
Thanks for your help

And does it work for you now?

Jan