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.
