[hyperdrive_boomParticipant]

Hello!

How could I have it so when I click a top main link it could open up text in a lightbox?

Kind Regards,
Jason

[ChristianModerator]

Hey Jason,

Please setup a custom link and add a class (e.g. show-lightbox) and image URL to it (see http://prntscr.com/5a6vjs). Then, add the code below in your functions.php.

add_action('wp_footer', function() {
?>
<script type='text/javascript' src='<?php echo get_site_url(); ?>/wp-content/plugins/x-shortcodes/js/dist/site/vendor-ilightbox.min.js'></script>
<script id="x-responsive-lightbox-1">jQuery(document).ready(function(){jQuery('.show-lightbox a').iLightBox({skin: 'light',overlay: {opacity: 0.875,blur: true},styles: {prevScale: 0.75,prevOpacity: 0.75,nextScale: 0.75,nextOpacity: 0.75},path: 'horizontal',controls: {thumbnail: false}});});</script><script id="x-responsive-lightbox-2">jQuery(document).ready(function(){jQuery('.show-lightbox a').iLightBox({skin: 'light',overlay: {opacity: 0.875,blur: true},styles: {prevScale: 0.75,prevOpacity: 0.75,nextScale: 0.75,nextOpacity: 0.75},path: 'horizontal',controls: {thumbnail: false}});});</script>
<?php
});

Hope that helps. 🙂

[hyperdrive_boomParticipant]

This reply has been marked as private.

[hyperdrive_boomParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi there,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

Thanks!

[hyperdrive_boomParticipant]

This reply has been marked as private.

[Kosher KMember]

Hi There,

I’m not really sure if I understand you correctly, but it sounds like you wanted to add additional attribute to one of your navigation Item,

If so, you can simply do it by adding an item on your current menu, and use #POPUPNAMEHERE as the menu link

Then use the class of that menu to add additional attribute using jquery code below, i use menu-item-6893 class -the standard class for the “Who We are” menu, you can assign custom class to your menu and use that class instead,

code;

(function($){ 
	  $('.menu-item-6893').attr( { rel:"lightbox", data-gall:"gall-frame", data-lightbox-type:"inline" } );
})(jQuery)

The code above will add multiple attribute to a menu item that has a class menu-item-6893

Hope that helps,

Have a great day

[Author]

Posts