I wrote some code that will change the logo URL of a website for mobile.
There is an $alt_logo variable you will need to change to the URL of your alternate logo. You can also change the $threshold variable to change when the logo is swapped.
<script type="text/javascript"> (function($) { $(document).ready(function() { // Change to the URL of the alternate mobile logo var $alt_logo = '/wp-content/uploads/freshysites-logo-green.png'; // Original logo URL var $logo = $('#logo').attr('src'); // Mobile width threshold in pixels var $threshold = 767; // This will fire when document is ready: $(window).resize(function() { // This will fire each time the window is resized: if ($(window).width() <= $threshold) { // if smaller or equal $('#logo').attr('src', $alt_logo); } else { // if larger $('#logo').attr('src', $logo); } }).resize(); // This will simulate a resize to trigger the initial run. }); })(jQuery); </script>
Just add the code to the “Body” area of the Divi > Theme Options > Integration section, or to the “Footer” area of the Settings > Header and Footer Plugin.