Personal
- 1 Site
- Unlimited Modals
- Unlimited Themes
- 1 Year Updates &
Support
Developer
- Unlimited Sites
- Unlimited Modals
- Unlimited Themes
- 1 Year Updates &
Premium Support
Best Deal!
As we mostly do Website Design, Search Engine Optimization & Internet Marketing often we use wordpress along with Contact Form 7 with the CF7 db Plugin. Often forms look bulky on just any given page. In comes Easy Modal. With Easy Modal you can create not only Popup forms with CF7 but you can also create a modal with any text or wordpress shortcode from other plugins. Ideas off the top of my head would include; Promotional Video, Newsletter Signup, Social Media feeds and likeboxes.
Now Available Easy Modal Pro & Easy Modal Lite!
Features include:
- Visual Theme Editor
- Unlimited Modals
- Easily Add Modals in Post Editor
Description
Easy Modal plugin for WordPress allows you to create unlimited modal window with just about any content.
Works with Contact Form 7 Custom forms and many other shortcodes.
Examples
- Contact Forms – Contact Form 7 (Try submitting it for a nice effect)
- Youtube Videos – Regular, HD
- Social Media -Facebook
Links
Get the Plugin – Easy Modal Plugin
Incoming search terms:
- easy modal
- wordpress modal window
- wordpress modal
- easy modal lite
- had to modal
- wordpress modal login
- wordpress modal plugin
- wordpress wizard plugin
- easymodal
- wordpress modal window plugin
- wordpress modal box
- modal box wordpress
361 Comments
*Follow-up to last Question…
I notice on some of the samples for the Modal – the close “X” is at the Bottom Right border (instead of the Top Right)…
This would solve the problem of it accidentally clicking the Menu Tabs (when positioned at the “upper right”) – If the “X” could be moved.
Thanks
Check the z-index value of your menu and menu items. Most likely they are set too high causing them to be above the modal. They shouldn’t be higher than 10 and modal is at 100.
Great plug-in (beats the heck out of writing the Modal Code from scratch)!
Only having one problem (Any way to “tweek” it)?
If the Modal’s border pops-up with the (to close) “X” over the WP Blog’s Menu – You get a on the MENU TAB instead of closing the Modal.
Thanks
Hi, I’m having that redirect error…
My test page (http://www.delinea.com.br/teste/) (you have to click on “Solicitar Ementas”) redirects to http://www.delinea.com.br/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f1207-t1-o1. The message IS SENT successfully, but I need to solve this redirecting problem. Do you have any ideas?
Thanks!
This is typically caused by an error in the JavaScript. Usually either because multiple instances of jquery are being loaded. Often this is caused because jquery is hardcoded into your themes header as well as being output by wp_footer and wp_header functions. I am currently away from my PC and unable to debug the link you sent but can almost guarantee the issue is the same as above or similar.
Thanks, but could you tell me what exactly should I do to fix this issue?
Just to add some info, I’ve checked and I have wp_head() and wp_footer(), and also wp_enqueue_script. Could some of the plugins still be loading jquery the wrong way?
I’m confused, because my test page is really simple… http://www.delinea.com.br/teste/
Looking at it there are a lot of js scripts being loaded. The error that keeps it from working properly is saying that the ajax form plugin is not loaded, but i can see it in the files loaded. Most likely something is queing improperly. I would recommend disabling a couple plugins at a time and see if you cant narrow it down. Firefox with Firebug would help you check it.
I try to share and download the free version but all I get is an error from FB. What am I doing wrog?
Plugin looks promising, but I’m getting a bug with my tests. Unfortunately I can’t send you link as it’s a client site in a staged environment, but I’m using Gravity Forms to drop a form in the modal and nothing else. I get the following error in Firebug:
Uncaught TypeError: Object [object Object] has no method ‘textareaCount’
(anonymous function)
v.event.dispatch jquery.js:2
o.handle.u jquery.js:2
v.event.trigger jquery.js:2
(anonymous function) jquery.js:2
v.extend.each jquery.js:2
v.fn.v.each jquery.js:2
v.fn.extend.trigger jquery.js:2
(anonymous function)
l jquery.js:2
c.add jquery.js:2
v.fn.v.ready jquery.js:2
(anonymous function)
(anonymous function) jquery.js:2
v.extend.globalEval jquery.js:2
(anonymous function) jquery.js:2
v.extend.each jquery.js:2
v.fn.extend.domManip jquery.js:2
v.fn.extend.append jquery.js:2
(anonymous function) jquery.js:2
v.extend.access jquery.js:2
v.fn.extend.html jquery.js:2
(anonymous function) jquery.js:2
l jquery.js:2
c.fireWith jquery.js:2
T jquery.js:2
r
On the front end, the window goes dark and the progress wheel spins, but nothing else. I can’t escape out or anything. Halp? Thx
Sorry…forgot to mention the form I’m trying to insert works when I place it in a post or widget.
Im sorry i must have overlooked your comment above. It sounds like there is a js function not being loaded properly. I havent updated gravity forms in a while and he may have added some new features i need to adapt for.
Hello Friends,
I’m using your free Easy Modal before deciding whether to upgrade to the paid version. All went well until I was creating a form for the modal and wanted to add a tag to enable the viewer to leave comments. If I have something like this:
<textarea> text </textarea> (the problem occurs no matter what attributes are used, such as rows, cols, name, etc.)
…when I save the modal contents, the tag </textarea> and everything I coded after that is erased, such that the modal contents end up looking like this:
<textarea> text ….(everything is erased from this point on)
Is there some kind of problem using <textarea> </textarea>
Kindest Regards,
Jeffrey!
I do appologize for the delay in responding. If you have an example link i can look at to debug it would be very helpful.
Hello David… I’m sorry that I did not include details with my report. I had assumed (incorrectly) that you were aware of the WP3.5 issue because I’d seen a few other people post comments about this. I don’t remember where I saw those comments, so my apologies again.
Here’s an example of one of my test sites in which we’re using WP 3.4.2 and your plugin works great: http://soulpurposeparenting.com/pre-launch-notices-2/
… at the bottom of the large image, click on the phrase “Click here for our pre-Launch mailing list…” and that fires up your modal just fine.
I took that entire site, and ported it to one of my “test” sites which recently upgraded it WP installs to 3.5 and you can see the problem here: http://lastinghappiness.com/spp1/pre-launch-notices-2/
… again, click on the phrase “Click here for our pre-Launch mailing list…” … and you can see your modal “begin to work” by loading the overlay, and then freezes before loading the modal window.
If I port my functioning WP3.4.2 install to one of my test areas of lastinghappiness.com which is WP3.4.2 then your modal works fine, so I know is not the process I use to migrate WP from one server to another (“WordPress Move” found here: http://www.mertyazicioglu.com/projects/wordpress-move/). On the WP3.5 site, I even uninstalled your plugin and re-installed, but it’s behavior is still the same.
Kindest Regards,
Jeffrey!
Hey there, im having trouble getting this widget to work correctly, when i click on the link to the modal window, instead of appearing in the center of the screen it appears underneath the footer and aligned to the left – so the loading icon remains spinning in the center of the screen and you have to actually scroll to the bottom of the page to see the modal content. http://kche.co.uk/engineering/hndautomotiveengineering/ is the site and the ‘CLICK ME TEST’ is the modal link. Any help would be appreciated
Thank you!
This sounds like a css themeing issue.
Terrific plugin. Quesiton that is probably simple but I can’t figure it out.
I have a post which executes a PHP file. That PHP file makes a call to a DB and pulls make, for example, a PersonID and a FirstName.
I show the list of FirstName and am using easyModal so when a user clicks on it, a new modal shows. I want to be able to pass the PersonID into the easyModal, and then have a code execute and do something with that PersonID. I can get all this to execute, and all components work, EXCEPT, I don’t know how to pass the PersonID variable into the easyModal which executs a shortcode I wrote. Any ideas? I’ve been struggling with this for days!
Thanks
Does this works on Internet Explorer?
also if we use the pay version will powered by Easy Modal dissapear?
The plugin is now installed and running, and for a while it was working. I started working on a new theme for the modal and suddenly it doesn’t display any content, just the title.
I have tried deactivating and reactivating the plugin as well as deleting the modal settings and theme and starting again, but nothing I do makes any difference.
You can view the test page I am building at http://www.platformblack.com/request the modal is link to the red ‘request a call’ button.
Cf7 is working fine, as are all other plugins etc.
Wow! nice and it work well!
I encounter only a problem using a shortcode for ninja form. It’s all ok except that form are not validated.
Maybe a jQuery conflict?
Hello, I am using this plugin with contact form 7 and all seems to be working ok except for the ajax submission thanks message on IE 8.
The easy modal window opens fine and submits the form to my email correctly, but the thank you message is never displayed in IE 8 specially (rest it is fine with all browsers like Firefox, Chrome, Opera, Safari etc).
Any ideas why only with IE 8?
I have tried to delay the fadeout time in css for both Div IDs from 4000, 2000 to 9000, 8000 respectively
I’m using emodal and cf7 to load a contact form, and I’m trying to also popup my cart underneath the contact form. Unfortunately my cart keeps showing up on top, where / how can I adjust the zindex on the emodal container?
I’d like to pay you to create a page to learn how to use the Easy Modal Plugin. I’ve looked around your site and I cannot find a How to Use Easy Modal Plugin, or How to Setup Easy Modal Plugin. I downloaded, installed and activated the plugin on my WP site. I went into the Modal Settings > Add New and I’m at some crazy screen with a code heading called Change_me Modal. Okay. Whatever. Then a field label says, “ClassesCopy these to the link/button used to open this modal.” But I don’t know what “ClassesCopy” means. The word “Classes” is plural but there is only one field with the label. There are two other fields, “Name” and I know what a name is but the field is already filled, and there are two more fields. Are both of the first two filled fields the ClassesCopy? Should I copy both of these ClassesCopy? And then do I paste both of these as classes in the link? Or is the Name an ID I must paste in the link? I wish I could send you a screenshot of the settings page! You should see the end user quality of a plugin you want to sell for money. This is a great idea but it really needs to look like a real, professional tool, and have some Use Instructions somewhere before you convince me to go from Lite to paid.
hi all,
I am using easy model and its work fine.
i want to say thanks to developer team and support team as well.
Your Support team is too good.
one thing i want to know is,
how can i send some php variable via model for a form??
thanks again in advance.
hi there,
i tested you plugin on my “test-blog” and it worked fantastic. nice work. however, now i want to use it on a multisite-installation but i cannot get it to install properly.
it throws the error:
Warning: Invalid argument supplied for foreach() in /…myroot…/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 200
any suggestions would be more than welcome. thanks
Hmm is it the version from wp directory? if so try the lite version above and let me know. You can email me at danieliser at wizardinternetsolutions.com
yeah i used the one from the WP directory…
please send me a download link via mail. this facebook share thing doesnt work for me and i dont have twitter. thanks a lot
Hej Daniel,
Thanks so far, i installed the lite version but i still get an error when looking into the settings of the plugin.
Warning: Invalid argument supplied for foreach() in /…/easy-modal-lite/easy-modal-lite.php on line 276
Name
+ all my pages now show these errors as well:
Warning: Invalid argument supplied for foreach() in /easy-modal-lite.php on line 390
Warning: Invalid argument supplied for foreach() in /easy-modal-lite.php on line 1054
Warning: Invalid argument supplied for foreach() in /easy-modal-lite.php on line 390
Warning: Invalid argument supplied for foreach() in /easy-modal-lite.php on line 1054
Any idea?
Any additional info you can provide on your setup when you get errors, WP Version, Theme and plugins used would be great.
The newest version 1.0.6 seems to fix all of this. Let me know if you find any further issues.
i m also getting this one in all of my pages:
Warning: Invalid argument supplied for foreach() in …easy-modal.class.php on line 84
Hi
Just to confirm that I am facing the same issue as well with the one from the WP directory (using 3.4.1, Twenty Eleven and only Contact Form 7 v3.2 activated) – the modal window pops up just fine, but when attempting to submit a form, I either receive the foreach error or I get redirected to a link like this: …. plugins/easy-modal/ajax/content.php#wpcf7-f41-t1-o1
Many thanks in advance
p/s: I was going to try the lite version as well just in case but I can’t seem to download it without authorising access to something to Fb/Twitter.
Ty for confirming this and your setup so i can duplicate. If you get a chance to confirm the lite version as well id be appreciative.
Thanks for the reply, Daniel
I forgot to add that I am using multisite as well but will test with a single-site installation and let you know. The good news is that when I fill in all the blanks and press Send, although I am ‘redirected’ to the blank “http://mysite.com/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f41-t1-o1″ url, the message has actually been sent.
Generally that error of being redirected means there is an issue with how JS is loaded in the theme. IE if the theme loads jquery via script tags in themes header then it will most likely also be loaded when you call wp_header as most plugins call it via enqueue_script() function which eliminates duplicates.
The reason this matters is that if easy modal loads after your hardcoded jquery file and then another jquery file gets loaded before cf7 scripts then easy modal and cf7 arnt able to communicate as they were both started in different instances of jquery.
Double check that if you can. Also a link to a working / broken version for me to look at would be great. I will have to setup a MultiSite installation later today.
Just to confirm that Easy Modal (WP.org version) works fine on single site!
On multisite, the blank redirection (mentioned) page with debug turned on shows this message:
Undefined index: modalId in /URL TO/wp-content/plugins/easy-modal/ajax/content.php on line 8And if I were to view the source, only this line would show (with the usual triangular brackets):
(h1 class='eM-title')(/h1)and on the Easy Modal settings page itself:
Notice: Undefined variable: tabs in /URLTO/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 201
Notice: Undefined variable: panels in /URLTO/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 202
@Daniel: Thanks for your explanation
I have tried another multisite ‘new’ installation (will setup some login details for you to take a look and send via your contact form) with the Twenty Ten theme and the first time I press submit without any content, I get
Warning: Invalid argument supplied for foreach() in /URL TO/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 56and thereafter it is just the blank page as mentioned above.@Flick, this has all been patched to my knowledge in v1.0.6 released on friday. If you have any further issues please let me know.
Also i tested it with WPMU 3.4.1 and added some hooks to prevent future issues with MU sites. The issue was that there were no default options for each new site as these are normally created on plugin activation. I hooked into the WPMU new site function to add them to each new site when network activation is activated.
Also on WPMU with the pro version you simply need to enter the license key into the main site ( site #1 created when WP was installed ) and it will update properly via Network Admin Page.
Thanks, Daniel
You’re a star!
p/s: The Plugin repository still has 1.0.4 so I presume the update will push through within the next few weeks.
It will be a few days as i havent added the changes to the wp.org version. Either Easy Modal Lite or Pro from this page are updated already.
Hi
I am using eModal Pro, and it has worked well. However, recently the modals won’t pop up from a floating side menu (wp float). Any suggestions for me to look at?
Regards
If you have a link for me to look at that would be helpful.
Sorry, not thinking. Have a look at the front page of eezifind.co.nz. There is a floating menu on the right hand side
Many thanks
Hi I’m using wordpress (version 3.3.2) , Exec php (version 4.9) , and easy -modal version 1.0.4. Im trying to get some inline php to execute went. It appears the php is never executed since i see the raw php. heres the line in question;
<input type="hidden" value = "ID);?>” name =”userID”/>
in the browser this is what i see
<input type="hidden" value = 'ID);?>’ name =”userID”/>
php is working else where … Is there a trick to getting inline php to execute ?
thanks Nic
I have not tried using exec php and will have to look into whats going on there.
And only one more question…
What is the CSS class code for closing Easy Modal window?
Thank You again!
Somebody?
How do you mean? Not sure i understand.
I would like to have a link inside the modal window, which closes it.
Hi,
I want to add a button on a navigation menu, which calls my custom EasyMogal window.
Is it possible?
Thank You!
Hi,
Its a great Easy Modal Lite plugin, I ever see it. I was searching a contact form 7 pop up plugin but I could not get any plugin like this. I am having trouble getting Easy Modal and Contact Form 7 to work properly.
When I click the image contact form pop up comes up with all details in that form but when I click on SEND Button, it goes to a blank page at this address:
/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f57-t1-o1
I already have wp_footer(); in my footer.php.
Can anyone help me?
Thanks
Most likely this means that your theme is not loading its javascript files via wordpress enqueue_script() . Check your header and footer for scripts and move them to use the previously mentioned function.
Hi,
Thanks for the quick response. I do not know how to use enqueue_script() function.
try checking out this article about the wordpress enqueue_script() function
Hello,
Thanks for the reply. I have checked this out already. I have tried this. This whole line doesn’t even compile and it’s repeated throughout the article:
wp_register_script(‘myscript’, bloginfo(‘template_url’).’/js/myScript.js’__FILE__), array(‘jquery’), ’1.0′, true );
I’m sorry to say, but this article is riddled with errors.
Below is the code… Line no 8 is with error and line doesn’t even compile.
Hello,
Thanks for the reply. I have checked this out already. I have tried this. This whole line doesn’t even compile and it’s repeated throughout the article:
wp_register_script(‘myscript’, bloginfo(‘template_url’).’/js/myScript.js’__FILE__), array(‘jquery’), ’1.0′, true );
I’m sorry to say, but this article is riddled with errors.
Below is the code… Line no 8 is with error and line doesn’t even compile.
try this
wp_enqueue_script( 'myscript', bloginfo(‘template_url’).’/js/myScript.js’, array(‘jquery’), '1.0', true);Hello
Did n’t work. I am sure its the javascript problem. Lots of javascripts are there and these javascripts are conflict to each other.
The below are the javascripts which are called on home page
Hello
I have solved the problem. The problem was related to Javascript. Same Javascript was calling 2 times with different versions. Remove old version of javascript and problem has been solved.
Thanks for the great plugin.
Hi, Could you let me know exactly how you solved this? I get the same error.
Is it possible to load a modal on page load?
I’m trying to change the placement of the modal as it pops up. I’m not using as big a video as you are. When I have a video come up through a modal the modal load circle is in the exact middle of the visible page but the video (hosted on Viddler) starts at this point in the page and extends down from there. It can be awkward for the visitor to view the page if they are scrolled to the bottom and the video drops past the page’s height. Is there a way to move the orientation of the modal around the page? I think my best scenario right now would be to have the modal load at the top of the page and then fill in with the video.
If you have a link i can check out ill see whats going on.
A lot of our videos are hidden behind a membership wall but the intro video on the page is still using Easy Modal. If you find that the video on our front page doesn’t show you the behavior I’m trying to communicate I will temporarily disable protection on a member’s only video for a day.
Looks like the issue is with Firefox. The video is centered on the page in both Chrome and IE but in Firefox the modal window starts at the load circle and falls down the page from there.
Take a look at our intro video on http://www.onlineadvisorcentral.com in a couple browsers and let me know if you can see what I’m talking about.
Thanks!
Ok what is going on is that your video is using lazy loading which is fine except the modal centers when the content finishes loading, this is done by using the height and width of the content. The lazy loading causes your video to not load and not give a height and width until after loading has complete, by this point modal has already tried to center itself..
Try one of 2 things, if you know the size of the video player then add an id or class and define the width in css also. I already tested it by using firebug to add a style to your stylesheet with width and height matching that of the
tag that loads the video.I have your plugin installed and I’m trying to get definitions to pop up when I click the keywords.
I defined the class, but it doesn’t seem to be recognizing the modals by the name specified for each. It only pops up a blank popup.
I know I’m leaving something out, but I can’t figure out what.
Thank you,
AJ
OMG… Nevermind… I totally figured it out. I was right. I was missing something. I scrolled through your tech support comments and got exactly what I needed!
Thank you!!!
Glad you found what you needed.
Hi
Witch version of your easy modal plugin is compatible with wordpress 2.9.2 ?
Thx
Im not sure if any will work. I will have to do some research and see what would need to be changed.
Like it and using it to date! with easy modal and light boxes and such what’s the correct method to get another modal to open when you have one modal already opened. This doesn’t seem to work.
ie Select button and modal will pop up with 5 choices. And then you will pick from those 5 choices and it will bring you to the final content within a modal. Thank you for your assistance.
You could easily add the modal classes to links inside another modal. They effect should still be the same.
How can I get it to accept the pasting of php code into the content box? Is there a way to make this work?
Try using one of the many php inline plugins for wordpress that allow you to use php inside the_content;
Hello,
This is a great plugin, but I have a small problem. When I click on send, nothing happends. The CF7 form doesn’t work. Can you help me ?
Thanks
Will need more info than that. If you read through the comments you will most likely find the answer. There are several common causes and they have been addressed many times. If you still cant figure it out post a link to a page where i can check it out and ill get you pointed in the right direction. Usually has to do with themes not loading jquery and other javascript using the proper WordPress methods.
Hi,
Already checked all the answers, and also googled for some other answers, still haven’t find one. The website is at http://artadansului.ro , there click on Inscrieri. I checked and the jquery and also the .js from the CF7 are loaded corectly.
Any help will be appreciated. Thanks again.
You have multiple instances of jquery loading up.. one at the beginning which then loads all plugins etc including jquery form and easy modal. Then another copy loads from google api before the contact form 7 scripts load as well as a half a dozen others. CF7 is essentialy in a different building. Cant communicate with jquery form which it needs. Your theme is most likely loading jquery in the head manually rather than using wordpress enqueue_script() function.
Check your templates for header and look for tags.. These shouldnt be here.. They should be in functions.php using the above functions.
Hope this helps.
Hi,
I can’t close the modal by clicking outside of modal. Sometimes when I scroll the page (while modal is open) modal window stick to top and I can’t see the close button.
Any solutions?
WSH
Which version of the plugin are you using? Id be glad to address the issues.
I was using ver. 1.0.4 which is available in wp plugin directory.
I will check into it and try to release an update with fixes.
Hi There, im using the lite version of this plugin but it does not seem to pull dynamic fields? I.e customfields and post author meta whic works on my standard Contact Form 7.
Does the Pro version allow for post author meta and Customfields in the form?
Thanks
This is in development. We have 2 methods we are currently testing to make this work.
Hi Daniel,
Did you make it work with CF7 dynamic fields yet?
Any solutions available?
Thanks
How is the development of this going? Thanks for the great plugin!
Hi Daniel,
Does this work with Gravity forms? I had it working but now it doesn’t… Can you help?
Cheers Rob
Sorry rob, sadly it doenst currently work with GF. I have been working in conjunction with @rocketgenius to make these two powerful plugins work together flawlessly in the future.
Does this work with Gravity Forms yet?
Unfortunately no. I had it in the works with cooperation from Gravity forms creator @RocketGenius, but i have not recieved any replies to any communcations with them for some time now and have determined that they may have lost interest in helping to marry the plugins.
Hello, I’m trialling this plugin with CF7 and it all seems to be working ok except for the ajax submission message.
The modal window opens fine and submits the form to my email correctly, but the thank you message is never displayed… just an infinite loading image (and the screen doesn’t fade away as in your example above).
Any ideas why? I’ve made a few stylesheet changes but nothing major.
Never mind seems to be working now!
My Modal window isn’t working and I have tried troubleshooting by reading all the posts above… might it not be compatible with my WP theme?
http://themeforest.net/item/the-cotton-powerful-minimalistic-wordpress-theme/240813
If you have a link to an example page with Easy Modal setup with your theme id be glad to take a look and see whats going on.
I just set up the modal to pull up the default contact form 7… I’d like to use it for images/text as well, but I wanted to test it first. Here is a link to a blank page where I applied the eModal as a style to the text
http://www.richlittlebird.com/pricing/
Hey,
I have noticed that the modal max-width & max-height doesn’t work too well with ie8 and contact form 7. I have also tested this on your site demo and its the same. I have tried overflow:scroll and overflow:auto with no luck.
Any suggestions?
Nothing? Don’t care?
This issue has been documented before. The best fix is to add a container to the content of your modal. Either by adding a class or inline style give the container a width. This will solve the issues.
hi
i try use easy-modal in my site but i have problem becouse i install secure-wordpress plugin and this 2 plugin not compatible
please fix this problem
I will look into this.
The plugin seems to be right the thing I’m searching for: a kind of lightbox effect applied on a map embeded from another plugin as shortcode.
Unfortunately, the google map in the modal window does’nt load correctly, but only in a small corner of the modal window.
Is there a conflict anywhere?
Example:
Please click on the text below the embeded map, there I’ve set the required classes.
Regards,
Hella
Sorry for the delayed response. If you tell me how you added the map either via a specific plugin or a embeded script from another source. I would love to get this working for that.
Hi, i installed the Easy Modal Plugin from wordpress.org but i can’t see settings options (colors ets) in admin side (( Modal window works but with unreadable texts and forms. Please, help!
The version on wordpress is very basic and needs to be themed with css in your stylesheets. Try Easy Modal Lite available at the top of the page.
Hi there,
does your plugin work with Gravity Forms now? Have not tried it recently…
I’m trying out your excellent Easy Modal Lite plugin, which is nearly working, except…
I’m having trouble getting Easy Modal and CF7 to work properly. When I click submit, it goes to a blank page at this address:
Based on other comments: I’ve checked for multiple Jquerys, there’s only one. I’ve tried disabling all other plugins (in fact there was only one). Didn’t help. Tried removing all Jquery plugins and scripts. Still didn’t fix it.
Any ideas?
Forgot to mention that:
1. I’ve tried the CF7 embed code for this particular form on a normal post to check it works ok and it does.
2. It gets fired by the ‘REGISTER YOUR INTEREST HERE’ link at the top right, under the phone number at this url:
Solved it! Ok, this may be good info for others…. My template didn’t have
wp_footer();in the footer.php file so was not loading CF7′s Jquery scripts.I have this same issue, but i already have wp_footer(); in my footer.php.
Can anyone help me?
The form processes but just goes to a blank page at
/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f1357-t1-o1
This is almost always cause by javascript load issues but not always the same one. Issues that cause this are
If you can give me a link i can probably find out just by looking at it.
Hi,
I am using easy modal to load contact 7 form. But, it seems to be giving issues in javascript disabled browsers. Where can I write the code to redirect to some custom page if javascript is not enabled?
hi! I’m using easy-modal with CF7. Once click “send” I can only see a blank page with this url: http://ixom.es/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f2231-t1-o1
and I receive the email without advanced data, instead I have “[_post_title]“.
The contact form is working perfect in the contact page, but no trought easy-modal. I have disabled all the plugins, but nothing happened.
Can you check what I’m doing wrong?
Thanks!
http://ixom.es/productos/esterilizacion/lisa/
the modal appears at “Más información”
Im having the same problem.
There are many ideas for fixes in the comments. Try this one. http://wizardinternetsolutions.com/plugins/easy-modal/#comment-12900
OK.. What i dont understand is why it can grab user details correctly but it cannot get the ID, post name or correct url. The url instead is /wp-content/plugins/easy-modal-pro/inc/ajax/content.php. I dont have multiple jquery versions loading.
More than likely the problem isnt really with Easy Modal. Does your theme have wp_footer(). Most of the time its either a jquery issue or scripts arnt getting loaded. Usualy the CF7 scripts that get loaded via wp_footer(). If you have a link with a demo of the issue i can help you find the right direction.
This is a great plugin–easy to implement and to use for a someone like me (print designer) who is starting to do some development.
Is there a way to get the modal box to close when someone clicks anywhere on the screen outside of the modal container? I’d like for the user to be able to hit ESC or click anywhere, not just on the close button.
I tried making the button 100% of the screen size, and then using the z-index to put the button behind the container, but I couldn’t get the stacking to work. The button stayed on the top no matter what.
Any thoughts?
I will add this to future features list. Should it be an option available in the theme or per modal or on by default?
I would like this to function by default. If the user clicks off the screen just go back to where they began and make the modal go away.
Is there not an option to enable this? What version do you have installed currently?
Hmm, the modal now seems to fire up after the latest update, but when I try to submit I just get a white screen?? I am using it on a test site here – (the modal is fired on the large ‘Send a Message’ button)
I get this message in the error console – Uncaught TypeError: Object [object Object] has no method ‘ajaxForm’
Any ideas danieliser?
Many thanks
After looking at your example there are a few issues that could cause problems..
Your site currently loads the following scripts in this order.
jquery 1.7.1
easy-modal
jquery 1.6.2
jquery-ui
jquery-form
contact form 7
I think that by loading 2 versions of jquery in this order causes the break. The error you are getting means easy-modal cant find commands available in jquery-form. I believe this is because jquery is loaded again after easy-modal but before jquery-form. This creates multiple instances of jquery that can be used seperately..
ie easy modal is running in a seperate instance than jquery-form.
I have tested easy modal with cf7 on the twenty 10 and twenty – eleven themes and it works great in 3.3 now.
Let me know how i can help.
Thanks for the swift response. I have sent you a PM.
I had the same problem in the past! Problem is different jquery versions. WP have jquery 1.7.1 but most of all plugins need 1.6.2 (old code). Try put into your functions.php in your theme this code (this function loading only jquery 1.6.2.):
if( !is_admin()){
wp_deregister_script(‘jquery’);
wp_register_script(‘jquery’, (“http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js”), false, ’1.6.2′);
wp_enqueue_script(‘jquery’);
}
I’m sure that will help you!
The issue was that one of the page templates for his theme included a call in the body to jquery from googleapis. But thank you for trying to help.
NP!
Yes thanks Max, and to Daniel.
It was nothing to do with the actual Easy Modal plugin. It was as Daniel mentions the call to an earlier version of jQuery in one of my templates, as well as loading the 1.7.1 version that ships with WP 3.3.
Hey! Plugin stop working after update WP 3.3.!!!
I think because wp 3.3. have jquery ui 1.8.16 but not 1.8.14
danieliser, I need your help!
Yup can confirm here, not working with WP 3.3!!! Needs fixing guys!!
Thank you all for pointing this out. I am working today to try and get it fixed. Sorry about the inconvenience.
Great stuff. Glad to see you taking action so quick. Much appreciated.
Think I may have found the issue causing the problem. A deprececated function. I found a possible replacement and will be implementing it and testing over the next few hours.
Great News. Fixed the problems so far as i can tell. All deprecated functions removed. Update for all versions have been released.
Nice dani, what the problem was?
Was using a function called convertEntities. They did away with it. Its used to pass data from php to js.
Thx! Good support from you!
Hi
I have the same problem on a number of sites since I upgraded to WordPress 3.3
Any help would be gratefully appreciated!
Your download method isn’t working. Should make sure it works before you have people going on a wild goose chase, liking/following/promoting your company for no reason.
Thank you for bringing this to our attention. Problem has been resolved.
Hi, this is greatly improving our users’ experience. But I would like to pre-populate a field and cannot see how. Does the lite version support any kind of dynamic field or is there a hook I can call just before it loads?
thanks
I am currently working on this feature. I also have a need for it in one of my current projects. I will let you know when i have more information on it.
Hello,
I have made a new theme using the personal version but will not save the new theme once selected, keeps loading theme id 1 (black).
Any fix?
Cheers
Hi,
I got the following issue. Whenever I activat easy modal lite my site stays blank. I check the source and found this error message
/* <
Thanks again
Hi, I’m using the “lite” version on WordPress but i don’t have any customization menu. So I just bought the next level up for $15. The site took my money but I don’t have anything for it: no download link or anything to update my plugin. Right now I really need to customize the modal popup and I’d very much like the WYSIWYG editor. Please let me know where I need to go to get it.
Thanks.
Sorry about that. I just sent you an email containing the plugin and license key. I am currently updating my api which usually handles these things. Also note that there is a themes menu to create and customize the themes. Any functionality that you find needs improvement please let me know. Again i do appologize.
I installed the free version of the easy modal plugin but I want to upgrade to the $15 version. Do I just pay here and then re-install the plugin? I was hoping there was an upgrade button I could use. Please advise, Thanks!
We are currently working on a direct upgrade path for users to upgrade from Lite to Pro, Currently there isnt one. You can purchase the pro and we will send you the plugin and license key.
I’ve used Easy Modal on a couple of sites and found that it works as advertised. Is there any way it can be made to load a confirmation page upon submitting the form? Not only would this improve the user experience, it would also allow me to track conversions using Google Analytics. Thanks for a very useful plugin.
OK, I may have partially answered my own question. Turns out it is possible to track submissions from Contact Form 7 in GA, without loading a separate page. I haven’t tried it yet but the process.
On another matter: which plugin do you use for comment editing/deletion?
WP Ajax Edit Comments is the plugin we used for the ajax comment system.
Hi Daniel,
Does your plugin work with Gravity Forms now?
Due to some impending deadlines i havent had time to work that out. I will try to get to it as soon as i finish my current project load.
Hello
this plugin is great. Unfortunately i have a problem of compatibility between emodal lite and WC7 module.
this plugin create hidden filed dinamically populated
for example i have to write in the default value “post_name” and in the mail i get the name of the post from which the mail was sent.
instead, using emodal, i can’t get the name of the post but simply: post_name
i can i solved it?
thanks
Paolo
solved
i’ve tried another plugin for hidden fields
Contact Form 7 Dynamic Text Extension
it works great with emodal lite!!!
so if someone else needs to know from which post/page the mail was sent this two plugin are fit for this
i have created in a widget text a contact link using emodal and in the mail i’m able to know from which post was sent
Paolo
Glad you found a solution. This one would be complicated to solve otherwise. Will keep it on my list of things to do.
I’m trying too use Contact Form 7 Dynamic Text Extension with Emodal. I use the CF7_URL and the CF7_get_post_var key=’title’ in the form but it won’t send the title at all and the URL looks like: instead of the post URL
What can i do to make it work?
I am looking into this. Problem is the solution needs to be dynamic and that is proving tough.
I would also like to know how to use” _post_title” for the subject of a contact 7 form so it uses the page title as the subject. I have set this in contact 7 where it works one but the subject line when using Modal Lite just says “_post_title”
Any updates on this, please?
Thanks
Im not à programing person but cant it be done with POST or GET? Something like that?
@Paolo: It would be great to find out which method you used for this; the only way that has worked for me so far with the two methods is to use the context href method, but that isn’t so practical when the form needs to be loaded within the same page so I am still looking for solutions.
Methods tried so far include Patrick’s attempt (CF7_URL and CF7_get_post_var ) as well as a custom field; CF7_URL shows something like” /wp-content/plugins/easy-modal/ajax/content.php” as the url instead.
@Daniel: You mentioned that you might be looking into this and I was wondering if you might have succeeded – perhaps in the Pro version?
Thank you both in advance.
Best i have come up with is creating several general ones ie.. page/post_title, id etc. But this would require the form to have fields with specific classes or ids thus complicating it. Or a custom admin settings on each modal to pass optional data somehow but id probably need some time for this one.
The modal breaks when contact form 7 sends the form. How to fix it? I don’t want to redirect after!
By default the form should fade out on submit not redirect. More than likely if it is doing so then your site isn’t loading the JavaScript files properly. If you have a link I can check out I’m sure I can find it.
well true all the other scripts are loaded in footer except emodal. Is there easy way to fix it or should I change those to the header too?
If you give me a link to look at i can probably diagnose the problem quickly. There are only a few causes.
I’m having this exact same issue. You can see mine below, click on the Contact Us link within the text.
http://www.aon-esolutionsideology.com/rmis_toolbox/next-steps/
After looking at the link you do have several things you need to address. One is that your theme is loading jquery more than once. Most likely manually added in the templates and also being called as part of wp_head(). The second is that easy-modal.js is loading before cf7s scripts. I might need to adjust the easy modal script to load later so that it loads after cf7. i have never had an issue exactly like that but will prolly do the job. Which version do you use specifically?
Well my site is still on closed test server. The problem is quite clear though. Boilerplate theme (among many others) loads the scripts in the footer but easy modal goes to header which breaks it up since jquery is loaded in footer
Thanks Daniel, you were right, I hadn’t caught that. I’m using the HTML5 Boilerplate theme as a parent, and once I had it stop loading jQuery, the form seems to work. So that seems to have been the problem. Thanks!
Your comment is awaiting moderation.
Hi danieliser,
I liked your plugin. It’s simple and easy to use. I just have some additional and I hope it will help. Right now when you click a link and the modal popup, the overlay div#eModal-Overlay is only covering the current window and not the whole page. I saw that the height of #eModal-Overlay on default theme was set to “100%” but it’s not covering the whole page. What I did was I added a simple code at:
var openModal = function(e){
/* My simple code */
var fullHeight = $(‘body’).height();
fullHeight = fullHeight+’px !important’;
/*
* DEFAULT
$(‘<div id=”eModal-Overlay”></div>’).css({opacity:.3}).hide().appendTo(‘body’).click(function(){
*/
/* UPDATED LINE */
$(‘<div id=”eModal-Overlay” style=”height:’+fullHeight+’”></div>’).css({opacity:.3}).hide().appendTo(‘body’).click(function(){
. . .
I hope you will have this as an option to the plugin admin page or on theming.
Thanks,
Tami
sorry, here’s the function code below…
Is it possible to have a modal pull in dynamic post content?
I am using the plugin to pull in post types but am finding that I not able to specify the specific post I need, and am bringing in all posts
I’ve created a shortcode to attach to my posts which is the following
function record_shortcode()
{
global $post;
//The Query
query_posts(‘post_type=record&posts_per_page=10′);
//The Loop
if ( have_posts() ) : while ( have_posts() ) : the_post();
echo ”;
echo ”;
echo ”;
echo the_post_thumbnail( ‘record-thumbnail’ );
echo ”;
echo ”;
echo ”;
echo ”;
echo get_post_meta($post->ID, “album-artist”, true);
echo ”;
echo ”;
echo get_post_meta($post->ID, “album-title”, true);
echo ”;
echo ”;
echo ”; echo the_title(); echo ”;
echo ”;
echo ”;
echo the_content();
echo ”;
echo ”;
echo ”;
echo ”;
echo get_post_meta($post->ID, “soundcloud-link”, true);
echo ”;
endwhile; else:
endif;
//Reset Query
wp_reset_query();
}
add_shortcode(‘record’, ‘record_shortcode’);
Thanks in advance!
Hi, I have just come accross your excellent eModal plugin and I really likr it for its flexibility. I am thinking of buying a licence key, but Icould not solve the folowing issue . My form has a hidden input field that is dynamically populated with the the recipient´s email. The form works perfect without the eModal. When I activate the eModal plugin it shows the form and validate the fields perfectly but never sends it throwing the following error (Failed to send your message. Please try later or contact the administrator by another method.) What do you think would be the problem?
Ah, how can I get a licence key? I didn´t see any linking option in your website. Thanks a lot
What plugin are you using for your forms? Are the forms not being sent to a single email? Reason i ask being that Contact Form 7 allows you to send messages to both a set reciever and the senders email address. If you have a live example for me to see id be glad to troubleshoot it. You can email it if you dont want it posted on here. my email is “danieliser at wizardinternetsolutions.com”.
As for the pro edition it includes many extra features like unlimited themes, auto open modal on site load/exit, external links in modals and more.
Pricing is $15 for 1 site, $35 for 3 sites and $65 for a developer license. Includes updates and premium support.
You can email me to get the pro version as well.
Right now, if I have an image linked to an Easy Modal panel, the cursor does not change when it passes over the image. Is it possible to code the plugin so this happens?
I can do this by adding an empty link to the image, but if I could avoid this step, I’d be grateful.
Otherwise, it’s looking and behaving as it should! Thanks, Daniel!
What you can do is add the following style to your themes stylesheet. I will consider adding it to the plugin but not sure its what everyone wants.
`.eModal { cursor:pointer; }`
Cool! Thanks, Daniel!
Hi,
Looks like a great plugin! Installed and only have the top part of the screen in the settings (add new modal and the three field form) but not all the settings below or the visual editor. Downloaded 1.0.3 from WP repository and running latest version of WP. Any suggestions? Someone mentioned a solution but didn’t find it in the thread. Thanks much!
The version on WP currently doesnt have those features. Without wiping out everybodies settings we couldnt make that upgrade. “Easy Modal Lite” for WordPress is available at the top of this page. There will also be a pro version in the near future.
Where can I find instructions on how to use this plugin?
What can i help you with?
Hi,
does your plugin work with Gravity Forms too?
Take care,
Sascha
It most likely would but for the Ajax submit feature I have to get my hands on a copy of GF to add it’s submit functions to the plugin.
Hey Daniel,
what’s your email? You have mine in this form. Just get in touch….
I cannot get your plugin to play on a clean install of WP 3.3 Beta 2. I am not sure why. Does it work on WP 3.3 Beta 2?
I added a link with href #, the class to the link, but nothing is opening up. Page just jumps to the top….
Sascha
And:
what is the difference between easy modal and easy modal lite? All a bit confusing.
S
Hi Daniel,
Great Plugin!
Can I have the modal window close automatically 2-3 seconds after the form has been submitted?
Thanks alot,
Dan
If you havent already grab a copy of “Easy Modal Lite” at the top of the page. This feature is enabled by default. Should honestly also be part of the Easy Modal plugin already.
I can’t get the “reply” button to work.
Check out the mail icon in the sidebar – click it, and the contact form pops up, but the “send” button does nothing.
The same contact form works fine when not used as a modal. You can check it out on the “contact” tab.
Any suggestions?
Thanks!
I can definately check this out for you. What is the url of the site? The link in your name doesnt work.
Ok i found it by accident but the issue was in the plugin. I just released an update that should fix that. Please update and let me know.
Cool! I’ll reactivate the plugin and check it out!!
Hmm. Where’s the download link? I’m going for the Easy Modal Lite. Used the “share to get” button above, but got a “file not found” after going through the Twitter option…
http://wizardinternetsolutions.com/api/download.php?file=easy-modal-lite-v1.0.2.zip
My appologies. I released an update and it didnt get placed in the correct folder. The link above will now work.
So it does! Thanks – I’ll give it a shot!
Howdy danieliser! Love this plugin! Easy to implement and use.
However my forms are on russian lang. So in modal window it’s abracadabra. Any ideas how to fix that? THX in advance. Great piece of software.
Thank you for your support. I’m not quite sure I understood the question. Not exactly sure what you mean.
It was server encoding problem (virtual host). Fixed with htaccess utf-8 by putting this:
CharsetDisable On
AddDefaultCharset UTF-8
php_value default_charset utf-8
However not working yet with contact form7, but I am happy with Fast Secure Contact Form so NOA PROBLEMA THX. Wish you to keep moving forward in developing. Good luck!
Hi there! I downloaded Easy Modal Lite, but now it asks me for the license … I don’t see anywhere where to get this. Please give me the link. Thank you so much.
I’ve received this question many times already. I tried to address I in the most recent update. The lite version is free and will remain so. The box should be green. It is mainly there for those that purchase the pro version and want to upgrade. The plugin will function as normal.
Hey Danielister, great plug in! I am having a little bit of an issue upon submission. When I test the submit for a cantact form 7 in the modal window, it completes to a blank page and the url is: “/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f117-t1-o1″ You can test it here by clicking “ask us”
I see that you are launching a pro version–when will that be available?
PS–the form still submits okay, but the thank you page is blank–very similar to the issue Alexanderu has.
After looking at it i can see several things that could cause that. Generally this only happens when there is a conflict in CF7. Either there is a conflict between 2 plugins or you might have issues since your theme/plugins are loading several versiions of jquery. 1.4.2 and 1.6.2. I would first try disabling everything but easy modal and CF7.. see if it works.. also check to see if the form works properly outside a modal. Then slowly add plugins back till you find the fail.
The Pro Version has many extra features and we are currently finalizing the feature list. Will allow unlimited themes, as well as options to convert all external links into modals, WP Image Gallery to Modal Galleries as well as options to open a modal on page load and exit. Much more. Follow us on twitter or sign up for our newsletter to get notified of its release. Likely 1-2 weeks.
Love this plugin! Easy to implement and use.
Having a little trouble though. Modal doesn’t pop up in the center of the screen on the first try. On second try it centers fine. Using FireFox 5.0 at the moment. Same trouble in IE9. Here is the site:
(Site is still under development so don’t look too close.)
Thanks,
CSB
Have you tried the newest version yet? You can get it at the top of this page. If addresses many of those issues.
Really love your plugin, however it seems to have stopped working for me and now I just get the ‘failed to send’ message. Have tried de/re-activating both it and contact form 7 that I’m using it with and am still getting the same message… any idea what I could look at to get this working again?
Many thanks,
Sounds like an issue in cf7, if you have a link i can view i can try to troubleshoot a bit.
http://munro-pa.co.uk/
If you have the time that would be very kind of you. I’m looking at CF7 now.
Problem solved! The issue was… I’m a plank.
Sorry to have wasted your time :c)
Easy modal returns a blank page …/wp-content/plugins/easy-modal/ajax/content.php#wpcf7-f931-t1-o1 when the form is submitted. The form appears, tha data is filled in but when send button is pressed the blank page appears. I’m using WP 3.2.1 with MU activated. Any idea, please?
Thank you a lot.
More than likely this means that something isnt getting loaded, js/css etc. If you have a link i can check out i can better help you.
Is there css code to position the eModal pop up, at present it’s overlapping my menu and need to move either down or to the left.
This is the screen shot of my problem http://cl.ly/Abba
Hi, I am having problems getting Contact form 7 to work via Easy modal.. The modal window starts opening but it doesn’t expand and it seems to be loading indefinitely. I am sure I’m making a basic mistake, I just can’t figure out what it is. If you click on Contact us in the website footer, you can see what I mean. Many thanks in advance.
You are most likely missing the second class on your link. Every modal link needs 2 classes. For modal #1 the classes will look like “eModal eModal-1″. You currently just have eModal
Great it worked, thanks.
Hi, I use a contact form 7 with a custom field in email, and I try to use a easy modal for the form see in other windows, but lost the email of custom field. Can you help me, how I have to write in link to don’t lose the email in custom field?
I put this in to: [_customfield___features_1_col1_5]
I put this in the post:
I can use the custom field with this definition: ‘. $value .’
danieliser, could you help me, plz!
I have problem with the plugin. The problem is that container with cf7 doesn’t float to top and to bottom (stays in one place) when I’m scrolling the page.
What should I change?
This will be fixed in the newest update. It is only stalled from release so that i ensure there are no upgrade problems like before.
I have added a link to an easy modal window but it does not work. I look in the Firefox error console and see this upon page load:
Error: convertEntities is not defined
Source File: …/wp-content/plugins/easy-modal/js/easy-modal.js?ver=3.0.1
Line: 37
This is due to your theme not loading the i10n.js file from the wp-includes/js/ folder. This is used to pass the settings from wordpress to the javascript. You need to add the js file before all others in your theme.
There is no i10n.js file in the /wp-includes/js folder.
However, there is a file named l10n.php in the /wp-includes folder. Is that the one?
shotcodes for cforms plugin did’t work.:(((
I havent tried cforms. I will try to work it into a future version.
I like your program. I have run into some problems:
1. how do I change the link colors
2. the overlay does not cover the screen
I left the link on the site so you could see it. Here is the page and it is the Link link:
http://www.kshotz.com/?p=1615
Thank you,
Karen
Im not sure what link colors you mean? The overlay on yours doesnt seem to have a color. I just double checked to make sure that it was in there to begin with but you can modify it to something like this
#eModal-Overlay {background-color: #000000;
height: 100%;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
}
Hi,
Thank you for responding. If you go to my home page: http://www.kshotz.com and on the left sidebar I have an announcement for Yoga and a link that says The Benefits of yoga. I removed the overlay. It was only going 1/4 down the screen, not 100%. I will go back onto the css and try this.
Thank you,
Karen
Great plugin!
It almost does exactly what I need it to do…but…
I have a number of items (posts actually) that I need to display in their own modal when clicked. I’ve set the posts to be displayed via shortcode but the problem is, I need to make a new modal for each link!
Is there anyway I could create just one emodal, style that and return the shortcode as a variable?
I just don’t want to have to make a modal for each one…any other suggestions?
Thanks again for your efforts here, again solid plugin!
This is addressed in the pro version. There will be many extra features for custom content types, Posts, Images, Gallerys, Comment Forms etc. The functionality is built into the javascript. You could easily modify it to fit your own needs but there is no documentation for this.
Ok, thanks. I don’t suppose the pro version will be ready anytime soon? I need it sooner rather than later. I looked at the javascript but am not sure what to do there to get it to work the way I need it.
On another note; on Safari and Firefox for mac, the overlay doesn’t cover the whole of the browser. On FF, it simply stops where the modal appears and on Safari, it cuts off at the current browser (ie. it doesn’t cover the scroll)
Hi danieliser,
Rally Nice Plug-in…
Works good in all browsers but, only one issue I have with iOS. When I check in iPhone or iPad it goes so far in top and left side (Almost half of the window is cut-off.) Please help..!!!
Thanks in Advance.
I will put this down as something to look into. Not sure if this is optimal for iphone screen size but will see.
Hi.
How can I achieve closing modal window on ESC button?
Try somthing like this in your scripts file..
$('#eModal-Overlay').keyup(function(e) {if (e.keyCode == 27) {
$('#eModal-Container, #eModal-Overlay').fadeOut(function(){
$(this).remove()
});
} // esc
});
Should I add it to easy-modal.js? Tried to add it at the end, but nothing changed – esc doesn’t work.
Sorry, don’t know javascript.
try changeing the first line from
$(‘#eModal-Overlay’).keyup(function(e) {
to
$(document).keyup(function(e) {
Thanks, it helped!
I’m trying to specify a height and width for my windows but I cannot figure it out. Using CSS for the modal classes is not working at all. What do I have to do for that? Thanks!
The plugin determines the size of the window automatically based on the content being displayed. If you want it to be 400×400 then you need assign the width and height to the content you add in the settings page.. So for instance
if you have.
[contact-form 2 "Request A Quote"]for your content try wrapping it in a div like this
<div id="myModal">[contact-form 2 "Request A Quote"]</div>then in your stylesheet
#myModal {width:400px;
height:400px;
}
If you dont assign a width/height it will use the rendered size( the size that the content would be without a defined size). For example. a video from youtube like the examples above doesnt require a size to be given as the content has its own size. Try the different video examples above to see this demonstrated. None of the examples have a defined size.
hmm i’v tryed but this also not work…visual part with backround not change…
You know, with a bit of effort and testing this could be really useful. But at the moment, I’m trying to display an image that’s bigger than the displayed screen. Often happens in this age of wide screen lappies. What happens?
1. It’s centred vertically, so the top right ‘X’ is not visible, and you can’t scroll to the top of the image.
2. the scrollable screen below the displayed part is *not* opaqued.
How about replicating the original functionality of lightbox, and scale the image to the screen size ( or at least not chopping the top off ), and fixing the opacity bug?
Ill need to see an example if you have one live. I can try to figure something out.
I’m sure you can manage to replicate such a simple setup in your dev environment!
Hi Daniel,
After updating to version 1.0.3 there are a bunch of “Warning” errors appearing on the site and in the back-end (only on the Easy Modal admin page). These are:
On the website – “Warning: Invalid argument supplied for foreach() in /…/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 84″
(appears 11 times above the header of the page)
On the admin page – “Warning: array_merge() [function.array-merge]: Argument #1 is not an array in /…/wp-content/plugins/easy-modal/includes/easy-modal.class.php on line 75″
I’ve not yet had the time to implement any modals yet so can’t say if the update effects usability or not, but clearly something’s not right… :-/
Best,
LJ
Very sorry about that. That occurs mainly because the structure of the saved data has changed greatly. I think you will find that if you deactivate and reactivate the plugin you will no longer get that message. It occurs only when upgrading for the first time from an older version. I do appologize.
Ah yeah, you’re right that cleared it up. I’ll need to remember to try that in future – have it heard/read it before somewhere but gotten so used to just hitting “Update Automatically” that I forgot about it! X-D
Keep up the good work dude, this plugin can be a real space saver when used properly!
Best,
LJ
Thank you.. The pro version will offer many other great features so keep an eye out for that to release.
Hi,
I think this plugin is exactly what I’m looking for, but I have been unable to get it to work. For one, the options that are displayed on the Settings page in your video are no longer there… I don’t know if you removed them, or if there’s a problem with my installation (I have installed the most recent version from the WP plugins directory.) Also, I don’t think I’m implementing the css code correctly. I’m trying to attach the modal window to a link, so my code is as follows:
<a href="#">Learn More</a>But when I reload my site to test it, it is simply a blank page – nothing loads. There might be a plugin conflict… I am using the following plugins on this site: Gravity Forms (with MailChimp & User Registration Add ons), Maintenance Mode, Portfolio Slideshow, TheThe Tabs & Accordions, WP Customer Reviews, WP Google Fonts.
I would really love to get this plugin working, so any help would be greatly appreciated.
Yes the options were removed. They will be available in Easy Modal Pro with many others. If you want to add a link that opens eModal-1 then your link should look like this.
<a href="#" class="eModal eModal-1">Link</a>the css classes are how the plugin detects what opens a modal, and which modal to open.
If you are interested in more features the pro version will include per modal theming options( each can be styled differently), load other websites in the modal, Open a modal on page load/exit, And several other features which may include modal comment form, login and logout forms as well. Keep an eye out this week as the first 10 copies will go at a reduced price.
Yes, I’ve got the link format correct. I’m having a problem with the plugin itself, though. Like I said in my previous comment, when I reload the page to test the modal window, my site doesn’t load, it just loads a blank page. Only when I remove the link does the site work correctly again. Any ideas what could be causing this? I’ve already tested disabling all of my other plugins, and it still has the problem.
If it is possible, can you create a temporary login for me to work out the problem? One thing i have found before is that some peoples themes dont use wp_head(”);. If you can do a temporary login please dont post it here. You can email me directly at danieliser at wizardinternetsolutions.com.
Perhaps this isn’t what I am looking for. In Joomla you could basically create a link in a post and have it open in a modal. I switched to WordPress because Joomla was getting too much to handle. Basically in Joomla, I’d just go into the html editor of a post and type <a href=”link.com” rel=”nofollow”> and the link would open in a modal window the size of whatever it was linking to.
I thought I could do that with this plug in, but maybe I can’t. Does this offer what I am looking for? Basically, I want to be able to open internal/external links in modal windows in WordPress just by creating the anchor in the post/page editor.
Thanks.
This plugin doesnt do that. This plugin allows you to add content( you can use wordpress shortcodes ) into it. That is something that we are planning to include in the pro version when it is released. I will be posting a feature list later this week most likely. Of course you are free to modify this plugin any way you see fit.
If your interested in the pro version the first 10 copies will go at a reduced price.
I was using Easy Modal and I updated it to version 1.0, and now it doesn’t work like it did. I’d like to work on it, but unfortunately I don’t have the time on my hands for the moment. So I wonder if I could download older version, for the time being. Would you please tell me how can I do that? Thank you very much.
Sorry to hear that, Not sure if you have tried anything at all to fix it but you will most likely find that you need to add a second class to your emodal links. Before it was only `eModal`, now it is `eModal eModal1`. The second matches your modal options so will be what changes a link from Modal 1 to Modal 2.
But as to your question all previous versions are available at Easy Modal Download Page on wordpress.org.
Thank you for your kind informations. Actually, I had a php error w/ latest version, right after the updating via WP dashboard, so I didn’t change the settings at all…. Or was it just expected procedure that having the php error at that point, perhaps? Thanks, anyway
I have noticed it as well. but try deactivating it and reactivating it to see if it still appears.
Short, sweet, to the point, FREE-exactly as infraomtion should be!
Just installed v1 update and modal stopped working, I’m using Contact 7 and a custom menu is there updated instructions available as I can’t figure out what to do.
There are updated instructions not only in the readme but on the plugins installation tab at Easy Modal Installation Instructions on wordpress.org
The new 1.0.3 update works as expected thank you.
Not a problem. If you want to check out the pro version at a reduced price make sure you subscribe to our newsletter or follow us on twitter.
i love the new version of modal window.. great job.. thanks a lot.. meanwhile, would you mind do some tutorial on how to customize the modal window using css as im quite new with css and don’t really understand how to customize the modal window.. thanks in advance
Do you have access to editing your theme either in the theme-editor or ftp? If not it will require a plugin. What would you like to know?
yes.. i do have access to the theme editor.. let say if i want to change the background color and the box size.. how do i do that?.. and i notice in ie, the plugin background mess a bit
You need to add your css styles to styles.css in your theme editor.
ok here is an examples you can work from.
Use this css selector to change the background:
`#eModal-Overlay {
background-color:#000!important;
}`
As for the box size the size is determined automatcially in this version. so if you are putting text in as the contents try adding a div or paragraph tag around it and giving that a width, either inline styles or in your stylesheet.
Use this one to style the container
`#eModal-Container > p {
width:400px!important;
}`
I am releasing a pro version that will have many features to help with just this, and you will be able to style each modal differently as well as many other extra features like modal comment form, image modals and much more.
Since this is the first mention of that i will also mention that the first 10 copies sold will get a reduced price. So be on the lookout and make sure your subscribed to our newsletter or follow us on twitter to know when its available.
hi there, when will the update being release? Can’t wait for the update
Look for it later this weekend.
Is there a simple way of fitting a single image into th source? I’m pretty sick of trying random x/y vales and either getting black padding or scroll bars.
In the current version no.. v1.0 should be releasing by the end of next week and addresses this issue as well as allowing creation of multiple modals.Sign up for our mailing list if you havent already to be notified upon its release.
I am having a problem with the implimentation of Easy Modal. I have both Contact Form 7 & Easy Model setup as instructed by your video tutorial but when clicking the “Send” button a blank page with the contact form is loaded. This page can be seen here I don’t know what I am doing wrong or what I am missing.
Thanks,
Brandon
Im not sure of the reason why but the jquery.form plugin is not being loaded.. maybe a cacheing plugin.. should be automatically added with the cf7 plugin.. if you can email me a temporary login i can find the issue.. on the same lines i am about to release v1.0 that will make major changes to the plugin itself and allow multiple modals etc.. you can email me at danieliser at wizardinternetsolutions.com
In the futures it is mentioned:
“Ability to create multiple Modal windows”
Could you please let me know when we could expect this future – if it will be in the next few days or rather months (I have to finish webiste by the end of August, I like your plugin very much, but need to use this more than once. If this future will be available in a week or two, I will be happy to wait for this, but if not I have to go away from this)
It will be in the next few weeks and is currently in development as i will also be incorporating it in several august projects.
Great plug-in. Thanks.
Using with CF7 – Contrary to the functionality shown in your video, I’m have an issue with a new page being created, replacing the modal and parent, whenever a message is generated like email sent successfully etc.
Any idea what might be causing this behavior?
Thanks in advance.
J
Do you have a link to the problem page? I can probably find it quickly.
This link will be active until 5 pm PDT:
There is an email button at the bottom of the page. Thanks.
Not sure if this is the problem but it could definately be one of the possible causes. You are loading 2 sources of jquery.. you load v 1.4.4 and v 1.5.1 i believe.. more than likely one is hard coded into your theme or functions.php unless its a plugin that doesnt que it to wordpress properly. This creates a duplicate $. namespace in the java and causes errors similar to what you are getting. Fix that and let me know.
That was the culprit. Thanks. J
Dear,
When i clic on buton send -> open a blank page width de form contact inside.
Sorry my bad english…
Do you have an example i can look at?
Sorry, but the site running on localhost…
Now, I am using other plugin…
Tanks,
Vinicius
do you mind sharing the plugin you use now?.. i would like to find an easy modal window plugin that can create multiple modal windows
This site is using Easy Modal. There is only one modal on here at the moment.. Request a quote.. This can be accessed from any link with the class eModal. There are still a few days of coding and bug testing remaining before the new version will be ready for release.
Love this plugin – have just spent hours trying to get contact form 7 to work with various Lightbox plugins to no avail. This works seamlessly! Love the simplicity of your solution. However, I have 14 different contacts on one page and would love to be able to use multiple contact forms and modal boxes. Any chance that this will be included?
This feature as well as several others are in development at this time.. Not sure of an ETA. Aiming for the next few weeks.
I installed Easy Modal, but I found the problem with colors – all modal window is in black, includning fields to fill in and font for ansers (they are in black too so you can’t see anything).Only titles are visible – they are in white.
Could you please help me where I can find the problem. I really like your plugin, but I can’t use this because of this issue
@Iwona. Do you have a link i can see? More than likely there are some styles in your theme that are overriding the modals styles. If you have it up so i can check it out i will find the problem and if its something to do with the plugin fix it. Thanks
Thanks a million, link to webiste is:
You can see request a quote link on main page and on sidebar.
I’m working on Green Apples theme
ok.. as i thought it is this line in your themes stylesheet
* {background-color: transparent;
margin: 0;
padding: 0;
}
* applies to all elements unless the element has styles already..
you can either change that (not recomended) or add a style to your style sheet of something like this
input, textarea, select {background-color:#fff;
}
To see this done visually try firefox with firebug addon.. you can right click anything and inspect it, not only can you see the css that is applied to it but you can also manipulate it in real time.. You would find things like that in seconds…
It works!!! Thank you very much
gorgeous thanks for help me
Hello
this is a great plugin, i have a cuestion, how i can make a link to this modal in a permanent link en my main menu?, i mean i have my contact page n when someone click it the pop ups show itself, Thanks ;D
If you are using the Menu editor in WP 3 and up there is an option under screen options to edit the classes for each menu item. Screen Options is near the help button(top right) and once you check the box for classes edit your menu item and add `eModal` to the class box and hit save. Hope this helps
Dear friend, is there any way to get working this cool plugin but for loading up external links instead CF7? I want to show other windows inside my main site, I don’t know if you fully understand my idea… I’m not an english speaker, sorry about that :/
Regards!
This might be something i will include in the next version..Your basically asking to load another pages content correct?
that’s correct!! Danieliser… I’ll be waiting for the new version!
and thanks a lot for your hard work!
Hi
Looking forward to using this plug-in as it looks like just the job for me.
I have a theme ‘PagelinesPro’ that gives me a call to action ‘highlight’ function where all I have to do is configure a destination url for a button. What should I input there to trigger the modal from a url? Or should I try to edit the theme itself?
Thanks for your help
–
Fintan
I looked at the themes documentation and cant find an example of the call to action button. You will need to add a class to the button of “eModal”. I might add features in the future to allow for custom classes..
Great plugin, love that it works with CF7. One thing I see as being critical to a v1.0 release, as mentioned in earlier comments, is the ability to have multiple forms on a site. The other aspect important to me solely as a result of a site that I’m currently working on, is the ability to have the modal box occur on load for specific pages (for legal disclaimers) and have buttons with custom labels to ‘accept’ or ‘cancel’ the modal box. Modal Dialog for WordPress supposedly has a portion of these features, but I’ve yet to get it to work at all.
@Tom – Thanks for the feedback. The feature to load the modal when the site loads is on the list for future features as well as multiple modals.
Is there a way to set up multiple contact forms using your plugin?
@Josh – At this time no. But this feature is currently in development.
PLEASE! Give me a way to use with contact form 7. how do you put the shortcode into the class for emodal???????
help
The shortcode for the form gets added to the Easy Modal Settings page in the admin area. You can also change the title of the modal as well there as many options to customize it as well.
I am gonna post a short demo video later today that will show how to add the modal to a link and also how to setup a basic form.
great thank you!
I have the easy modal plugin v 0.9.0.8 installed but it does not allow to use the color picker to change to color. It is always on the black color and does not react to any clicks.
There could be several things wrong here. But first i need to know your specifics. What browser so i can try to replicate the problem, What version if WordPress. Are you hosting it yourself or on wordpress.com?
Thanks danieliser,
The site is self hosted on VPS, WordPress version 3.1.3, happening on Firefox, Chrome, IE, Opera and Safari.
The only plugins installed are Easy Modal, Contact Form 7 and WordPress Importer.
Tried also switching to 2010 theme, but the same problem.
Also when in the Easy Modal admin screen, WordPress drop down menus stop working. (looks like possible javascript conflict?)
@Richard. Thank you for pointing this out. I have just released version 0.9.0.11 which fixes this issue. Let me know if you have any further problems.
Thank you. This fixed the issue and works great!
How do you use this with Contact Form 7?
Great plugin but if this could create multiple modal windows within one site it would be an awesome plugin.
That is a goal for future release. That functionality will be working before v1.0. I am experimenting with different ways to make this work properly with an unlimited number of modals without making it to cluttered or increasing load times to drastically. Look for this feature as a milestone 0.9.1 most likely.
Great plugin! I’ll definitely be looking forward to multiple modal windows. Thank you!
Thank you very much. Id like to ask you to rate it if you dont mind.
Ive started the process of adding multiple modal functionality. There are a lot of issues i have to work through but it will be coming as i need it myself.
You got it. I just realized that I’m having an issue and I’m wondering if might have any advice. I’m putting a CF7 form inside a modal window that is larger than the modal window so scroll bars are involved.
Everything works perfectly as long as the browser window stays larger than the modal window. If I drag the browser window to a smaller size and it “touches” the modal window, the scroll bar disappears and a lot of the form content outside of the modal window is no longer hidden. I tried adding “overflow:scroll” class to #eM-container but it got even crazier.
You can see an example of this at postpost.co in development.
Any ideas? I’ll keep looking.
Best,
David
I should add, under the navigation/submit section. Thanks!
@ David.
I see that you have the eModal class on the submit link but clicking it is not functioning properly. nothing pops up. Looking in firebug console it appears that clicking it causes another ajax load of your page to occur bypassing the modal window. After digging deeper with firebug it deosnt appear that the easy-modal.js is getting loaded.. If you are using w3 total cache or similar and using the minify you might have forgotten to add it? Any chance you can create a temp account for me to do some testing?
Thanks for checking! You caught me during another test, I figured that some combination of cf7/easy modal is conflicting with the infinite scroll plugin. the modal window is back up so you can see the original issue.
Ok.. in you css add the following. Fixed it in firefox 4 with firebug
.simplemodal-wrap {overflow-y: scroll;}if that doesnt do it try
.simplemodal-wrap {overflow:auto!important;}Although the first option seems to fix the resizing issue you mentioned.. I too screen size down to the width of the form and the height of 2-3 fields.. Modal resized to fit perfect and scrolled through the form perfect.
I will address this in tonights update if you dont want to hack it yourself.
Fantastic! The overflow:auto!important; works great -Thank you! Now i just have to figure out why IE will scroll everything except the form inputs – or maybe it’s a lost cause! Never ceases to amaze. Thanks again. David
What version of ie? also i would try overflow-y with the important first. otherwise you could potentially get an ugly unusable scrollbar at the bottom. Stick it out with me here. Ill be glad to find and patch the problems. Make the plugin better for everyone..
What bugs are you getting while its enabled that you keep disabling it? you mentioned something with the pageload ajax?
also you have an issue with another jquery script somewhere..
Does this look familiar?
$(item).css("top")shows up as undefined in firebug console.being jQuery is in noConflict you need to change that to
jQuery(item.css("top")Thanks! I’ll look into that, it seems like I’m only getting that error when I have what seems to be a few conflicting plugins installed. Sorry, I’ve been deactivating Easy Modal because it conflicts with the Infinite Scroll plugin which loads previous posts when you scroll to the bottom of the page (http://www.infinite-scroll.com/). I’m guessing it’s jquery. Is it possible to correct for conflicting plugins?
If i can duplicate the problem i should be able to find a solution. I need to be able to debug it properly. I didnt notice any issues with the ajax loading when i was on your page before. What setup do you have and what exactly is breaking.
Thanks! Well, when I activate easy modal it stops the functionality of infinite scroll. If you notice when you scroll down to the bottom of the page you’ll see the ajax loader but then nothing happens. When easy modal isn’t loaded, the next screen of posts show up after the ajax loader.
Ok after installing the plugin and trying to replicate your problem i have succeeded and the issue seems simple. Its neither a problem with Easy Modal nor Infinite scroll but rather an extra setting that is causing the problems. Look at the settings page for infinite scroll and fine the box for “Javascript to be called after the next posts are fetched:”
It seems you have the following in that box.
$("#content").grid(settings);Not sure why or what you want it to do but this is the line of code that breaks your page. Remove it from that box and hit save. If you need this for some other functionality it is most likely that the selector needs to be changed from#contentto#projectssince that is what you used in the second option of your infinite scroll settings. Hope this helps.Yeah I noticed the same error on chrome inspector. That’s the function in my theme that calls the next page of posts – which explains why they’re not showing up. It normally doesn’t come up as an error, only when CF7 or Modal are activated. I tried the #projects selector but no luck. It’s not an issue with Easy Modal as I’m getting the same error with other plugins. Anyway, thanks very much for all of your help.
Not sure what you mean. That function is in the extra functions box and will not affect the loading of page 2.. Unless that is how you are resizing the posts but i imagine that should be done with pure css. Does your page not work with that function removed? If that function relies on other jquery plugins you might need to call/activate that java as it might not be loading during the ajax calls.
That’s the function that’s integral my theme that lays out the post thumbnails on the page, without it, the extra posts will not be visible. After some research, and I’m surely no expert here , the best I can figure is that there’s some jquery conflict going on like you mentioned earlier. this might have something to do with my theme not using noconflict mode. I’m working on a solution so I can get back to eModal!
I was gonna suggest as with any plugin/jquery used in wordpress you should always run no-conflict. If you can do a quick backup of your sql and wp-content folder i can try to solve it on my localhost. Depends how you feel about that though.
Hey there, I got the conflict figured out, the developers from infinite scroll updated their plugin and it works now, conflict free!
can’t even get it to work. I’ve installed the plugin, its been activated but when I add the eModal class to my link it still opens in a new window instead of the Modal window.
<input class="eModal" type="submit" value="” onclick=”return gotoexternallink(”, ”)”>
@Greg – Im not sure and I’ll look into this. It might be that your using a form submit button and also have already asigned an onclick function that is most likely running and redirecting your page before the modal can be loaded.
Try removing the onclick=”" or
If you want the button but it’s only purpose is to launch the modal window try this instead.
<button class="eModal">Click Here</button>Hello, I found this plugin very interesting so I´m trying to use it but not very successfully…
Just for amateurs like me, I would humbly suggest a little more info about its usage…
Thank you! (Sorry about my english)
@SGG – Thank you for your input. I have actually been considering doing not only a quick write up but a video as well. Look for these in the very near future.
eModal
can someone in plain English tell me how to add a class to the….. whatever
example is well come
I wanted a button like thing that someone can “press” and he will get the inquiry form..eModal
As I said please some example
thanks
Eckhard
@eckhard This can be done many ways. I don’t want to give a CSS lesson but the basic idea is that if you have a button
<button>Click Me</button>All you need to do is change it to look like this.
<button class="eModal">Click Me</button>You can add class=”eModal” to any
<a>I’ve added the css class eModal to an anchor link with the plug-in installed and activated – I get nothing, this doesn’t work.
@Mike – Sorry about that.. Bug has been fixed and v0.9.0.8 is now available on wp . org or via the WP updates.
The idea is good, but lacks enough detail to refine visualization and browser compatibility.
Btw keep the good work!
@Gestion – Thank you for your feedback. I am slowly adding many features building up to v1.0. If you have specific features that you would like to see included please let me know and i will add them to the future features list if possible.
Maybe some more styling options like be able to choose background color of the modal window (not the overlay color).
how to use this?
@jlapitan – Once enabled you can change the content of the modal window by going to Easy Modal under the settings menu. Once you have that done you can add a css class to any link (on the menu or in the content) or add the class to any other html object that you would like to activate the modal window.
More sugestions:
scroll bar support for content larger than window size
@Ivang – Can you give me an example. Not quite sure how you mean?
I do know that the main scroll bar doesnt affect the modal window.
Possible solution #1: A = Screen Size, B = Modal Content Size , If B > A then add overflow:scroll classes.
2 Trackbacks
[...] easyModal Side – Info, Demo og diskussion [...]
[...] this article: Easy Modal Plugin for WordPress – Wizard Internet Solutions hopfeed_affiliate='fwsjay'; hopfeed_affiliate_tid=''; hopfeed_cellpadding=5; [...]