Help me :)

Hey,

You can override the opening JS by adding something like this to your themes js

jQuery('.eModal-1').click(function(e){
  e.preventDefault();
  var $this = $(this);
  var src = $this.attr('src');
  var $modal = $('#eModal-1');
  $('img', $modal).attr('src', src);
  $('span.imgsrc', $modal).text(src);
  $modal.emodal('open');
});

You of course will need to tailor it to your needs.

The modals content is generated with the rest of the page so shortcodes would already be processed.

What you are after would be better done with JS.

For instance say you had 20 links that all need to open a modal with an iframe with that links website shown in the modal ( you wont use an iframe of course ).

To accomplish this you would make just 1 modal. Set its content to be an iframe with no src tag, basically a blank ifarme.

Then in the code above you would change

var src = $this.attr('src');
  var $modal = $('#eModal-1');
  $('img', $modal).attr('src', src);
  $('span.imgsrc', $modal).text(src);

to

var src = $this.attr('href');
  var $modal = $('#eModal-1');
  $('iframe', $modal).attr('src', src);

Basically i take information from the link clicked and insert it into the modal just before opening. This way i can pass any info needed.

If you can explain in detail how you want it to work im sure we can get a working solution pretty easily.

Say if you had a paragraph of text and wanted to replace several key variables throughout. You could do it like this.

Modal Content

<p>
  Hello my name is <span class="name"></span>. I work at <span class="company"></span>.
</p>

and buttons might look like this.

<button class="eModal-1" data-name="olivertwist2007" data-company="WordPress">Click Me</button>

And for the JS

jQuery('.eModal-1').click(function(e){
  e.preventDefault();
  var $this = $(this);
  var $modal = $('#eModal-1');
  var name = $this.data('name');
  var company = $this.data('company');
  $('span.name', $modal).text(name);
  $('span.company', $modal).text(company);
  $modal.emodal('open');
});

Now you can litterally have hundreds of buttons on one page with different data. Each will open the same modal but changing the variables before it shows.

Im assuming you mean how do you take the info from the button and apply it to the modal? If so that’s precisely what this does

jQuery('.eModal-1').click(function(e){
  e.preventDefault(); // Prevent the default opening
  var $this = $(this); // Set variable representing button
  var $modal = $('#eModal-1'); // Set variable representing modal
  var name = $this.data('name'); // Get the buttons name
  var company = $this.data('company'); // Get the buttons company
  $('span.name', $modal).text(name); // Replace the text inside span class="name"
  $('span.company', $modal).text(company); // Replace the text inside span class="company"
  $modal.emodal('open'); // Open the modal window.
});

`

So to make that work checklist goes

Set modal content to include empty containers with unique classes/ids that you can target for replacement.

Create button / link / or even a html structure that has the correct info that needs to be passed for each button.

Copy and customize that JS code above into your themes main javascript code or using a plugin to add it.

Hope this helps.