EvanHerman / yikes-inc-easy-mailchimp-extender

Easy Forms for MailChimp WordPress Plugin
http://yikesplugins.com
GNU General Public License v2.0
25 stars 28 forks source link

Wordpress plugin - Easy Mailchimp Forms by YIKES - problem #85

Closed rasfonseca closed 10 years ago

rasfonseca commented 10 years ago

I have setup a optin form on sidebar, however it is displaying all internal mailchimp configuration - all fields are being displayed.

below is a copy and paste of the form on sidebar. It is in portuguese language.

RECEBA NOSSAS OFERTAS E PROMOÇÕES (this is the Optin Title)

Tratamentos capilares, Hidratação, Nutrição, Escova Progressiva, Plástica Capilar, Cauterização, Botox, Blindagem 3D, onde encontrar salões com Dia da Beleza e muito mais... E ainda fique por dentro das notícias, novidades e lançamentos de novos produtos.

\n \n '; var doubleOptinMessage = ' \n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\"Logo5

\n Obrigado por Assinar a nossa Newsletter! Um e-mail de Confirmação foi enviado para o seu endereço de e-mail.

\n \n

\n \n '; var optinValue = 'true'; e.preventDefault(); // Make sure the api key exists if(blankFieldCheck("0-9b685bee42")) { $ymce('#ykfmc-submit_0-9b685bee42').attr('disabled', 'disabled'); $ymce('#yks-status-0-9b685bee42').slideUp('fast'); $ymce.ajax({ type: 'POST', url: 'http://blog.kercosmeticos.com.br/wp-admin/admin-ajax.php', data: { action: 'yks_mailchimp_form', form_action: 'frontend_submit_form', form_data: $ymce(this).serialize(), }, dataType: 'text', success: function(MAILCHIMP) { if(MAILCHIMP == '1') { // custom message based on opt-in settings value // single opt-in if ( optinValue == 'false' ) { $ymce('#yks-status-0-9b685bee42').html(' '+singleOptinMessage+'

'); } else { // double opt-in $ymce('#yks-status-0-9b685bee42').html(' '+doubleOptinMessage+'

'); } $ymce('#yks-mailchimpFormContainerInner_0-9b685bee42').slideUp('fast', function(){ $ymce('#yks-status-0-9b685bee42').slideDown('fast'); }); } else { // bundle the MailChimp returned error // with our yiks mc error messages $ymce('#yks_form_error_message').fadeOut('fast', function() { jQuery(this).remove(); }); $ymce('#ykfmc-submit_0-9b685bee42').removeAttr('disabled'); $ymce('#yks-mailchimp-form_0-9b685bee42').prepend('').delay(1000).queue(function(next){ jQuery('#yks_form_error_message').fadeIn(); var offset_top = jQuery('#yks-mailchimpFormContainerInner_0-9b685bee42').offset().top; jQuery("html, body").animate({ scrollTop: offset_top - 50 }, 500 ); next(); }); } } }); } return false; }); $ymce('.yks-field-type-date').datepicker({ changeMonth: true, changeYear: true, yearRange: ((new Date).getFullYear()-100)+':'+((new Date).getFullYear()), dateFormat: 'yy-mm-dd' }); $ymce('#ui-datepicker-div').addClass('yks-mailchimpFormDatepickerContainer'); });

Thanks, Rolando.

EvanHerman commented 10 years ago

Hi rasfonseca,

It looks like the translation is causing the JavaScript code to escape imporperly ( because the single quote (') is causing the next character to be ignored). I will adjust the code for you and push out a new update. I'll let you know when I get around to doing so. I would estimate it to be complete by this time tomorrow, if not sooner.

Sorry about the inconvenience.

Evan

EvanHerman commented 10 years ago

Hi Rasfonseca,

What theme are you using? I just tested out the latest version of the plugin using the pt_PT (Portuguese) WordPress translation and everything seemed to work for me. I was able to submit a user through the form in a widget.

How can I replicate the issue you are facing?

Thanks, Evan

nightbook commented 10 years ago

I'm also seeing this issue but has nothing to do with a translation. My shortcode was working until I updated the id attribute on it to use a new list and now am getting the following content spit out: `\n \n \n \n'; var doubleOptinMessage = '\n

\n \n

\n \n'; var optinValue = 'false'; e.preventDefault(); // Make sure the api key exists if(blankFieldCheck("0-de40cef926")) { $ymce('#ykfmc-submit_0-de40cef926').attr('disabled', 'disabled'); $ymce('#yks-status-0-de40cef926').slideUp('fast'); $ymce.ajax({ type: 'POST', url: 'http://whalecontentstudio.com/wp-admin/admin-ajax.php', data: { action: 'yks_mailchimp_form', form_action: 'frontend_submit_form', form_data: $ymce(this).serialize(), }, dataType: 'text', success: function(MAILCHIMP) { if(MAILCHIMP == '1') { // custom message based on opt-in settings value // single opt-in if ( optinValue == 'false' ) { $ymce('#yks-status-0-de40cef926').html(' '+singleOptinMessage+'

'); } else { // double opt-in $ymce('#yks-status-0-de40cef926').html(' '+doubleOptinMessage+'

'); } $ymce('#yks-mailchimpFormContainerInner_0-de40cef926').slideUp('fast', function(){ $ymce('#yks-status-0-de40cef926').slideDown('fast'); }); } else { // bundle the MailChimp returned error // with our yiks mc error messages $ymce('#yks_form_error_message').fadeOut('fast', function() { jQuery(this).remove(); }); $ymce('#ykfmc-submit_0-de40cef926').removeAttr('disabled'); $ymce('#yks-mailchimp-form_0-de40cef926').prepend('').delay(1000).queue(function(next){ jQuery('#yks_form_error_message').fadeIn(); var offset_top = jQuery('#yks-mailchimpFormContainerInner_0-de40cef926').offset().top; jQuery("html, body").animate({ scrollTop: offset_top - 50 }, 500 ); next(); }); } } }); } return false; }); $ymce('.yks-field-type-date').datepicker({ changeMonth: true, changeYear: true, yearRange: ((new Date).getFullYear()-100)+':'+((new Date).getFullYear()), dateFormat: 'yy-mm-dd' }); $ymce('#ui-datepicker-div').addClass('yks-mailchimpFormDatepickerContainer'); });`

Oddly it loads into the middle of it the post/page after content, in some cases that's the sharing widget in others it's a google admin pageview graph. So it's as though this content spit out is seen as in the post loop. Not sure if that's helpful

My Implementation Information: Plugin Version 4.3 Wordpress Version 3.9.1 Browser Information Apple Safari 7.0.4 on Mac

Thanks

EvanHerman commented 10 years ago

Hi Nightbook,

All you did was swap out the Form ID , and you're now getting this error? I'm looking into the issue now. It looks like the issue is easily resolved by using the TinyMCE button to re-insert the form onto the page. I'm not sure why just swapping out the ID's would cause this issue, even when the form has been imported by the plugin.

I will report back when I find the cause.

Thanks, Evan

nightbook commented 10 years ago

Thanks EvanHerman,

For sure, I went in to import a new list then used it's id to replace that on the shortcode. Oddly enough on the homepage it's in the footer without an issue: http://whalecontentstudio.com

But on subpages when it's in the sidebar and footer widget it's giving me the issue. http://whalecontentstudio.com/our-service-process/

Weirdly on the page it's within the content the content is broken but the version in the footer works fine: http://whalecontentstudio.com/subscribe-whale-content-network/

I don't quite follow your resolution about TinyMCE, most of mine are in the Widgets so there's no wysiwig editor then, and for the content page that does have it I've tried pasting into both Visual and Text tabs with same issue.

Appreciate your prompt reply and investigation, I did have this issue months ago but one of your updates seemed to have resolved so not sure why it's occurring again.

Let me know how I can assist in troubleshooting. Thanks

nightbook commented 10 years ago

Another note, inspecting shows the following errors: screen shot 2014-06-27 at 1 47 44 pm

Text version of the above errors: [Error] SyntaxError: Unexpected token '<' (our-service-process, line 761) [Error] SyntaxError: Expected an identifier but found 'shareaholic' instead (our-service-process, line 853) [Error] SyntaxError: Invalid escape in identifier: '\' (our-service-process, line 853) [Error] SyntaxError: Invalid escape in identifier: '\' (our-service-process, line 854) [Error] SyntaxError: Expected an identifier but found 'shareaholic' instead (our-service-process, line 1076) [Error] SyntaxError: Invalid escape in identifier: '\' (our-service-process, line 1076) [Error] SyntaxError: Invalid escape in identifier: '\' (our-service-process, line 1077) [Error] Failed to load resource: the server responded with a status of 404 (Not Found) (jquery.mousewheel.pack.js, line 0)

EvanHerman commented 10 years ago

hi Nightbook,

from what I can tell, when you swap out the ID and re-save it, the form ID doesn't seem to get stored properly. I haven't noticed the issue with any widgets, but I did notice it when placing the short code on to a page.

I will continue to look into the issue and try to figure out why the ID doesn't get re-saved.

Thank you for catching this bug, It's a very strange issue and somewhat debilitating to the plugin so It's urgent that we get this fixed.

Evan

nightbook commented 10 years ago

Thanks Evan, greatly appreciated. If I can be of help please let me know. Cheers

EvanHerman commented 10 years ago

Hey Nightbook,

How else can I replicate the issue? Now that I'm home on my localhost, I can't seem to get it to spit the error out.

When it comes to the widget, you've simply just changed the form that should be displayed, and you're receiving the error?

nightbook commented 10 years ago

Hey Evan, Sorry for the delay had to head home from work. I'm trying to find a consistent method to reproduce this but haven't found a way. I tried with another instance of WP I had and went through the steps I'd done originally with no luck.

And yes exactly that's how I created the issue with whalecontentstudio.com Added a new form, grabbed it's id and updated the shortcodes.

I'm playing around some more right now to see if I can create the issue on this seperate instance, if no luck will start reverting theme and disabling plugins until I find a conflict if that's the issue.

Cheers

nightbook commented 10 years ago

*Resetting the plugin settings made no difference either btw.

nightbook commented 10 years ago

*And re-adding the other list and switching the id's back has no change either.

nightbook commented 10 years ago

*It's not associated with the theme, reverting to Twenty Twelve has no change.

EvanHerman commented 10 years ago

I was able to replicate it once or twice, and it seems to be that when the code gets pasted in it has a span with a style attribute wrapped around it. I can't seem to figure out why, or how to replicate the issue consistently.

One way I was able to was by importing a new list and copying the code from the new list, and pasting it in. It doesn't happen everytime so I'm having a hard time figuring out why it's doing it. There's no span or style wrapped around the shortcode in the list page.

I'll keep testing.

Evan

nightbook commented 10 years ago

Hey Evan, After disabling all my plugins and reactivating them individually I was able to attribute it to the Google Analytics Dashboard for WP: https://wordpress.org/plugins/google-analytics-dashboard-for-wp/ And specifically the Front-end General Setting for introducing the graph into the post: screen shot 2014-06-27 at 4 44 53 pm show page visits and visitors in frontend (after each article) show page searches (after each article)

It seems to introduce it's content into the script tag of the Yikes shortcode which breaks it causing the rest of it to spill out visible on the page. If you inspect you can see where in the script tag it does this: screen shot 2014-06-27 at 4 48 02 pm

*I've disabled these options for myself to workaround the issue. But am unsure if it's only this plugin that will conflict as I noticed in some cases the Shareaholic widget seems to be in place of the Analytics Graph.

It's weird as though your script has part of it being registered as the end of the post.

*This is consistent as well since I went into my other instance installed the Google Analytics Dashboard for WP and enabled those two settings and it caused the yikes shortcode to break, see example: http://nightbook.ca/wordpress/test-yikes-mailchimp/

Hope this helps troubleshoot for you and find a resolution, I've gotten support from Alin Marcu before and he was very responsive so you may be able to collaborate with him to find a solution.

All the best, Cheers

EvanHerman commented 10 years ago

Hey

That actually helps a ton. If you've pin pointed the plugin I think I may know what is causing the issue.

We use the_content filter to display any messages before the form. I'd bet the google analytics shortcode is rendering something using the_content hook.

I'm going to download and install the plugin and see if I can replicate the issue. If I can I'll figure out a work around and update the plugin.

Either way I'll report back here with my findings.

Thanks!

nightbook commented 10 years ago

Awesome glad to hear Evan, that makes alot of sense as I notice in some cases the shareaholic social icons are the ones that end up causing the issue so it must use the same _content hook there. Appreciate your quick response, all the best. Cheers

EvanHerman commented 10 years ago

Hi Nightbook,

So from my testing with the plugin you have specified, I've been able to narrow it down to the_content filter being applied to both the single and double optin messages. I've changed the_content filter over to content_edit_pre , which seems to be working as expectected.

The reason the_content filter was causing an issue, is that other plugins hook into the_content to display specific things. The jetpack plugin has a sharing module which adds share_daddy to the top of every block of content with the_content filter applied to it.

Using this new filter 'content_edit_pre' seems to parse the HTML as it should, while preventing any other plugins from hooking into it. I will push out an update to the repository shortly that will resolve this issue.

In the meantime, if you'd like to test out the fix and let me know it's all working that would be super helpful.

Inside of 'yikes-inc-easy-mailchimp-extender > templates > shortcode_form' on lines 29 and 30, you will see:

var singleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters('the_content' , $this->optionVal['single-optin-message'])); ?>';
var doubleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters('the_content' , $this->optionVal['double-optin-message'])); ?>';

You can swap out these two lins for this:

var singleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters('content_edit_pre' , $this->optionVal['single-optin-message'])); ?>';
var doubleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters('content_edit_pre' , $this->optionVal['double-optin-message'])); ?>';

Let me know if that resolves the issue for you, and I'll push everything over to the repo to help others facing similar issues.

Thanks for the patience and help in finding this issue Nightbook!

nightbook commented 10 years ago

Thanks so much Evan, my apologies for the delay was away for the weekend. This is now working with the previously interfering options enabled. http://whalecontentstudio.com/subscribe-whale-content-network/ So you're good to push that to the master and close out this ticket. Thanks for your prompt support. Appreciated, Cheers P.S. Sorry I guess I hijacked this thread from @rasfonseca so you may want to have him test to see if it's resolving his issue as well.

EvanHerman commented 10 years ago

Hey Nightbook,

No problem at all. Thanks for getting back to me to let me know this helped resolve the issue for you. I'm noticing on the page a javascript error which is causing some issues with the MailChimp form sending. I'm not sure if you are currently developing and or testing something on the page, but it was just something I had noticed when checking out the link you provided.

I'll wait a little bit and push out the update to the repository. And don't worry about hi-jacking the thread, the issues were related and I believe it was being caused by the same problem, so It works out that everything is kept central to this thread.

Thanks!

nightbook commented 10 years ago

Hi Evan, Thanks for catching that, seems to be related to this issue still. If I disable those settings then I no longer get the issue interfering with the form. Is there another portion of the code using the _content filter that I missed updating? I updated the two lines you previously mentioned. Thanks

EvanHerman commented 10 years ago

Hey Night book,

No that was the only section of the plugin that was using the_content hook. Let me double check that I didn't mistype something in the code above.

nightbook commented 10 years ago

Thanks Evan

EvanHerman commented 10 years ago

I am seeing an error with easy_fancy_box. Do you have an easy fancybox plugin installed and running on the page?

If you check the console you will see the JavaScript error, and I'm not sure that they are actually related to our plugin. One of them being:

Uncaught ReferenceError: easy_fancybox_handler is not defined

One other thing you can try (which I'm not sure will have any effect, but it couldnt hurt) is to change the single quotes over to double quotes above....So it should now read:

var singleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters("content_edit_pre" , $this->optionVal["single-optin-message"])); ?>';
var doubleOptinMessage = '<?php echo preg_replace("/\r?\n/", "\\n", apply_filters("content_edit_pre" , $this->optionVal["double-optin-message"])); ?>';
nightbook commented 10 years ago

Thanks Evan,

Sorry for the delay, thanks for the heads up, took me a little bit to resolve my other issue with infinite scroll & BWP Minify.

Sadly this didn't resolve the problem but it did lead me to realize the use of content_edit_pre has the wpautop interfering which introduces breaks and paragraphs into the shortcode not only interfering with the script tag but also the rendered html of the code.

`$ymce = jQuery.noConflict(); jQuery(document).ready(function($ymce){ function blankFieldCheck(formID) { err = 0; msg = '';

// <-- added by wpautop?

if ($ymce('#0-de40cef926-email').val() == ''){ msg += '... ` Seems the_content has potential conflicts, but content_edit_pre is pre-rendered so wpautop acts on it breaking the shortcode html. Or at least that's what I'm leaning towards. I reverted it back and have disabled the interfering settings, with the change it broke the script to the point it wouldn't submit. Appreciate any further ideas? Thanks

nightbook commented 10 years ago

BTW this is what happens to the form when it's enabled, gives some script errors dealing with the </p> and <p> inserted into the <script>, the errors: On Firefox: SyntaxError: syntax error msg = '';</p> On Chrome: [Error] SyntaxError: Unexpected token '<' (subscribe-whale-content-network, line 641)

Screens to show the html with <script> affected by autop as well as the form each line got broken up because of the new filter.

screen shot 2014-06-30 at 11 16 37 pm screen shot 2014-06-30 at 11 17 19 pm

Hope that's helpful Cheers

EvanHerman commented 10 years ago

Hey Nightbrook,

the_content was using wp_autop as well so I'm not sure why you're seeing that error now and not before. Also the <p> tag is wrapping the entire <script> tag, so I don't think that is what is causing the issue.

I will have a look into it and see if I can figure out what's going on. It seems to be with plugins that add things through the_content filter, an issue arises. I'll see if I can get this squared away today.

Thanks, Evan

nightbook commented 10 years ago

Thanks Evan, I'm not quite sure myself either, when I inspect the paragraph tags seem to wrap every empty line or anything after an <?php echo ?> statement, that is when using the content_edit_pre.

I would presume the shortcode getting rendered in content_edit_pre leaves rendered html to be picked up in the_content wp_autop which finds all carriage returns and places it's tags within, it's strange that it's not intelligent enough to avoid affecting content within the <script> tags.

I'm not sure where to take it here, I've reverted for now. Is there a way I can provide you credentials securely? I'd be able to share our dev instance with you if you wanted to try that.

Appreciate your help, Thanks

EvanHerman commented 10 years ago

You can email me at Evan@yikesinc.com and I'll take a look. Checking out the dev environment will definitely help me figure out what is going on.

nightbook commented 10 years ago

Thanks Even, sent you the credentials.

EvanHerman commented 10 years ago

Hey Garret,

Can you show me exactly what you have typed into each confirmation box? (The single optin and double optin success mesages). I've tried to remove the filter all together but it looks like there are still share buttons in there for some reason.

Have you manually added the share button in through a short code or something? Or are the other plugins till hooking into our filter? I don't seem to have access to the admin any more ( which is understandable, it was a while ago), so I can't double check that my self.

(I'd like to get this resolved asap!)

Thanks, Evan

EvanHerman commented 10 years ago

Hi Garret,

I've been trying to test a simple function to make sure things are working properly and it looks like I can't even get this function to work:

function test() {
    echo 'this is a test. please do not be alarmed.';
}
add_action ( 'wp_head' , 'test' );

It looks like it never gets run. It should be printing the statement in the header, but doesn't. I've also tried with the footer. Is the FTP info I have for a staging site or something?

Thanks, Evan

EvanHerman commented 10 years ago

Oh...I see. The site I was looking at http://whalecontentstudio.com/subscribe-whale-content-network/ was not the same as the login credentials you sent me.

I will be looking into this for the next hour or so.

Evan

EvanHerman commented 10 years ago

Ok,

It looks like the issue is now resolved over on the live site ( the site related to the credentials you sent over, I don't want to share the URL here).

I can see the form in the footer now works, and the form on the contact page is no longer using our form so there should be no conflicts there.

I have implemented a custom content filter (called yks_mc_content) which I am now using to pass in the confirmation messages. This is done to prevent other plugins (Share daddy, share this, etc.) from hooking into the function and adding unwanted buttons or other content.

It looks like the custom content filter has worked on my localhost installation as well as on your site. I am going to work on implementing this into the version in the repository.

Let me know if you need help getting it set up on your staging site as well for testing.

Thanks, Evan

nightbook commented 10 years ago

Thanks @EvanHerman, I'll get back to you this afternoon, just heading out to make a presentation so don't have time to look into this currently, sorry.

EvanHerman commented 10 years ago

No problem at all. Best of luck with the presentation!

EvanHerman commented 10 years ago

After thorough testing, we were able to resolve the issue via Email support. The issue was that another plugin was hooking into the_content filter, which was throwing all sorts of javascript errors.

We were able to resolve this by creating a custom the_content filter specifically for this plugin. That new filter is implemented in the 4.4 and later version of the plugin.

Thanks, Evan

nightbook commented 10 years ago

Thank you so much Evan, greatly appreciate your assistance.