-
AuthorPosts
-
October 11, 2019 at 4:42 pm #1147151
Hi
I want to link a magnific popup with a form in my burger menu. I have two menu items I want to link two different form popups (‘Arrange Valuation’ and ‘Sign up for alerts’). ‘Arrange valuation’ works but ‘Sign up for alerts’ just opens the ‘Arrange valuation’ form.
Here is my magnific popup code, that I put in the functions.php. The first two classes are the ones that relate to my burger menu links (‘.menu-item-17225 a’ and ‘.menu-item-17226 a’:
/* popup button */
function popup_inline() { ?>
<script type=”text/javascript”>
jQuery(window).load(function(){
jQuery(‘.menu-item-17225 a,.menu-item-17226 a,.popup-button a,.archive-button,.header-button-1,.header-button-2′).magnificPopup({
type:’inline’,
midClick: true // Allow opening popup on middle mouse click. Always set it to true if you don’t provide alternative source in href.
});
});
</script>
<?php }
add_action(‘wp_head’, ‘popup_inline’);This is the code for the actual popups:
<div id=”property-alerts” class=”white-popup mfp-hide av-animated-generic pop-up avia_start_animation avia_start_delayed_animation”>
[gravityform id=’4′ title=’true’ description=’false’ ajax=’true’]
</div><div id=”arrange-valuation” class=”white-popup mfp-hide av-animated-generic pop-up avia_start_animation avia_start_delayed_animation”>
[gravityform id=’3′ title=’true’ description=’false’ ajax=’true’]
</div>I’ve left a link to my site in the private content section. The burger menu is on desktop as well as mobile.
Thanks in advance for your help
October 11, 2019 at 6:40 pm #1147200Dear Bluehoop – here on the inputfield there are above some tags you can place.
It would be nice if you use for code the code tag.
You can do this either by click on code – paste your code and click again on code button.
Or past in your code and activate all of it and press once the code button.It is difficult to check a code if we can’t see if, for example, the quotes are correct.
If I were to copy/paste your code now, it wouldn’t be usable because the quotes aren’t the usual code quotes.Now : i do not think that you can row the items – comma separated – in this way.
i think you had to use the items option – like in Documentation said: https://dimsemenov.com/plugins/magnific-popup/documentation.html#public_methodsOctober 11, 2019 at 6:51 pm #1147204But maybe you can do it with one common class on those items:
function popup_inline() { ?> <script type="text/javascript"> (function($) { $(window).load(function(){ $('.menu-item-17225 a, .menu-item-17226 a, .popup-button a, .archive-button, .header-button-1, .header-button-2').addClass('open-popup-link'); $('.open-popup-link').magnificPopup({ type:'inline', midClick: true }); }); })(jQuery); </script> <?php } add_action('wp_footer', 'popup_inline');
October 12, 2019 at 8:46 am #1147315and if this synthax work with the magnific popup function – you should have a space after each comma:
jQuery('.menu-item-17225 a, .menu-item-17226 a, .popup-button a, .archive-button, .header-button-1, .header-button-2').magnificPopup({ …
October 13, 2019 at 4:37 am #1147489October 14, 2019 at 1:28 pm #1147836Hi Guenni
Thanks for your input. Unfortunately, I’m not quite as technical as you are and am struggling to understand what code to put in.
I have looked at the magnific popup items option and have tried to implement this in a few different ways but I still can’t get my popup to work.
October 16, 2019 at 5:22 pm #1148519Hi Bluehoop,
You might want to hire someone or Guenni to help you with this customization as this is out of the scope of our support.
If you need further assistance please let us know.
Best regards,
Victoria -
AuthorPosts
- You must be logged in to reply to this topic.