top of page
Anchor 1

Wix Tutorial - Displaying elements in mobile only with Wix Code

Wix Code can be used to display elements only in the mobile version of your site.

The basic steps to set up an element to display only in mobile are:

  • Set the element to be hidden when the page loads.

  • Use Wix Code to check if your site is being viewed on a desktop or mobile device.

  • If your site is being viewed on a mobile device, use Wix Code to display elements that are hidden on desktop.

Elements:

  • An image that we only want to display on mobile: #Image1   |   Hidden on load

Wix Code:

import wixWindow from 'wix-window';

$w.onReady(function () {
 if(wixWindow.formFactor === "Mobile"){
  $w("#Image1").show();
 }
});

Demo:

Smiling Skater

This is the image that is hidden when viewed on a desktop but is visible when viewing on a cell phone:

Wix Code Show Image in Mobile Only
bottom of page