When the background logo is replaced with HTML image element per my earlier article, the same image is going to appear on every device. What if you want to swap it with a high res version on retina devices? In this article I show how Foundation's Interchange can be loaded in WordPress and used to replace a non-retina version of the logo (as set up per my earlier tutorial) in Genesis with a retina version.
Interchange uses media queries to dynamically load responsive content that is appropriate for different users' browsers.
Step 2Extract the zip file and upload foundation.interchange.js and foundation.js inside js/foundation to your child theme's 'js' directory (create if not existing)
Step 3Create a file named say, global.js in the same location on your server (where you have uploaded the js files in the earlier step) having the following:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.