Last active
January 9, 2018 03:59
-
-
Save JRMorris77/723348ea80c6b1a8e536a154ed01b9b9 to your computer and use it in GitHub Desktop.
Force MarketPress Variation Modal 100% Width
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/* The following code forces the WPMU DEV MarketPress plugin variation | |
* modal (popup) to use 100% of the active window width. This works for | |
* both desktop and mobile. The code also applies custom CSS that makes | |
* the product image take 100% width of the parent container. The code | |
* applies to both the Store homepage and Products page. This should be | |
* added to the active theme's functions.php AFTER MarketPress has been | |
* installed and activated. | |
*/ | |
add_action( 'wp_footer', function(){ | |
if ( ! is_page( array( | |
mp_get_setting( 'pages->products' ), | |
mp_get_setting( 'pages->store' ) | |
) ) ){ | |
return; | |
} | |
?> | |
<script type="text/javascript"> | |
(function($){ | |
$(document).ready(function(){ | |
$( '.mp_button-has_variations' ).each(function(){ | |
let cur_button = $(this); | |
let new_button = $( '<a/>', { | |
'class': 'mp_button mp_link-buynow cboxElement', | |
href: cur_button.attr('href'), | |
text: cur_button.text() | |
}); | |
var mywidth = $(window).width(); | |
new_button.attr( 'data-href', cur_button.data( 'href' ) ).colorbox( { | |
"close": "x", | |
"href": function() { | |
return new_button.attr( 'data-href' ); | |
}, | |
"overlayClose": false, | |
"trapFocus": false, | |
//"width": 630, | |
"width": mywidth, | |
"overlayClose": true, | |
"escKey": true, | |
onLoad: function() { | |
$( "#colorbox" ).removeAttr( "tabindex" ); //remove tabindex before select2 init | |
}, | |
onComplete: function() { | |
$( "select.mp_select2" ).mp_select2( { | |
"dropdownCssClass": "mp_select2", | |
"dropdownAutoWidth": 1, | |
"minimumResultsForSearch": -1 | |
} ); | |
} | |
} ); | |
cur_button.replaceWith( new_button ); | |
}); | |
}); | |
})(jQuery); | |
</script> | |
<?php | |
}, 10 ); | |
add_action('wp_head', 'tweak_cboxContent_css', 100); | |
function tweak_cboxContent_css(){ | |
?> | |
<style type="text/css" media="screen"> | |
#cboxContent{ | |
margin: 0 -2px -4px !important; | |
overflow:hidden !important; | |
} | |
#cboxLoadedContent img { | |
max-width:100% !important; | |
height:auto !important; | |
} | |
</style> | |
<?php | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment