Change Backstretch Background Image When Mobile – AgentPress Pro

This download contains the code which enables AgentPress Pro theme owners to use a special image on mobile screens.

The mobile image replaces the default image added via Customize > Background Image > Home Image Upload to the image you add using the custom settings via customize > Background Image > Mobile Image Upload.

Watch the following demo video to see how the image changes at the same time the mobile menu is displayed :

Demo Video #

Shows a different image displaying at the same time the mobile menu kicks in for the AgentPress Pro child theme by StudioPress.

This solution will also work with any Genesis child theme that uses Backstretch to control the background image of any HTML element.

Code Installation #

There’s 3 steps :

Step 1 – Copy & paste the PHP code from the functions.php file to the end of the AgentPress Pro themes functions file or merge the code with the existing agentpress_customizer() function in the lib > customize.php file.