How to debug Prestashop locally via your mobile

Recently, I worked for a client who had very specific needs in front-end with Prestashop. For some details, the Chrome debugger was not enough and I had to check with my mobile. (the 100vh does not work on safari mobile..)

So I had to find a way to inspect my mobile browser to find the problem and fix it.

Find the IP of your computer on your local network

On mac:

or you can use the following command: ipconfig getifaddr en0

On linux:

ifconfig

On windows:

google it 🙃

Configuration of prestashop + on your iPhone

  • Go to Back-office > Shop settings > traffic and SEO
  • Change the values by replacing with your IP:

Refresh your local site, it should not have changed

  • Enter your local IP in your Safari mobile browser
  • Then, go to Safari with your macbook: Preferences > Advanced > See the developer menu in the menu bar
  • The developer tab should now be available, feel free to select your iPhone and the item inspector should open


in Prestashop Posted on May 17, 2021