List&Grid elements hide in mobile

I use List & Grid.
I want to hide elements in mobile display.
I can do that, but when another page edit the elements appear automatically.
Can I hide List & Grid elements in mobile?

Use wix-window.formFactor to determine whether you are running on desktop or mobile . You can then hide() or show() depending on the result.

Yisrael Thanks your reply.
I saw the wix-widow.formFactor, but I can’t understand how to write.
So Please tell me sample code or something.


import wixWindow from 'wix-window';
$w.onReady(() => {
   let formFactor = wixWindow.formFactor;
   if (formFactor === 'Mobile') {


Thank you Roi

I wrote your code, but its not work,

so I wrote like this page Velo Tutorial: Displaying Elements in Mobile Only | Help Center |

but It’s not work,

This is the code I wrote.
Please tell me where is wrong.
*I selected the Hidden on load checkbox in the Properties panel.
*button5 & button7 is differ List & Grid items

import wixWindow from ‘wix-window’;
$w.onReady( function () {
if(wixWindow.formFactor === “mobile” &&
wixWindow.rendering.renderCycle === 1) {
} );

Mobile not mobile

Hi Yisrael,
Does renderCycle can work in Mobile device now???
It’s because I have used renderCycle in my page code $w.onReady( ) but mobile device cannot do the function inside my renderCycle.

See this: Appendix: Rendering Optimization

I would suggest testing it without the check for renderCycle and see how it works. You can always put the renderCycle test back in.

1 Like

Thanks Yisrael :slight_smile:
I try it now

After all It will not move.

I have to delete the button use hide element button.
But when another place edit, the button I want to hide appear again.

import wixWindow from ‘wix-window’;
$w.onReady( function () {
if(wixWindow.formFactor === “Mobile” &&
wixWindow.rendering.renderCycle === 1) {
$w(" #button5 “).hide();
$w(” #button7 ").hide();
} );