• Resolved fahaadsheikh

    (@fahaadsheikh)


    Hello,

    I need to integrate facebook’s pixel conversion tracking with LMS Courses.

    What I need is to add some js on successful course registration. So it probably will go into the register button on the checkout page but once only all validation is completed.

    Please tell me where to find this.

    Thankyou very much

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter fahaadsheikh

    (@fahaadsheikh)

    Hello,

    I dont want to target completed orders. I just want to target people who actually registered for a course so a pending course registration will also be counted as a conversion.

    A solution I figured out was to bind the CompleteRegistration standard event to the submit button for course registration. I added my code into the following file:

    lifterlms/assets/js/llms-form-checkout.min.js

    Added here:

                l = setInterval(function() {
                    var t = !1,
                        s = !1;
                    if (o >= i) t = !0, s = !0;
                    else if (a === r)
                        if (a === d) t = !0, n.$checkout_form.off("submit", n.submit), fbq('track', 'CompleteRegistration'),n.$checkout_form.trigger("submit");
                        else if (c.length) {
                        t = !0, s = !0;
                        for (var m = e('<ul class="llms-notice llms-error" id="llms-checkout-errors" />'), u = 0; u < c.length; u++) m.append("<li>" + c[u] + "</li>");
                        e(".llms-checkout-wrapper").prepend(m), e("html, body").animate({
                            scrollTop: m.offset().top - 50
                        }, 200)
                    }
                    t && clearInterval(l), s && n.processing("stop"), o++
                }, 100)

    Here fbq(‘track’, ‘CompleteRegistration’), is the code i would like to add once the form is validated and successfully submitted

    Currently this is done on the parent plugin. I was wondering if there was a way that I can do this within my child theme? or create a custom plugin if that’s what required?

    • This reply was modified 9 years, 1 month ago by fahaadsheikh.
    • This reply was modified 9 years, 1 month ago by fahaadsheikh.

    @fahaadsheikh,

    This shows how to utilize the llms.checkout.add_before_submit_event() function.

    This allows you to add custom validation to the LifterLMS checkout form. You can add you custom JS event.

    Note that we *do not create users* until the form is actually submitted. All of that processing is done with PHP. We’re not a raw JS app (yet) so you’re going to have to understand that this isn’t a perfect solution.

    LifterLMS JS & browser validation ensures required fields are filled out and that happens before any custom events are fired.

    This is the best I can do:

    https://gist.github.com/thomasplevy/218f0895966f34d48b56efbcedf7da65

    Also, note that my JS doesn’t technically do anything but I think you can add your functions to figure this out quite well.

    Also note that if you’re using Stripe, we can’t confirm that Stripe tokens exist here as that data won’t be exposed (Stripe actually uses this same functionality to do the Stripe.js magic and we’ve intentionally not exposed Stripe data to other event handlers. Not sure there’s really a security risk but still.

    Anwyays, if this was my project it would fall into the good enough category because worst case scenario is that you get a false positive (a tracking that hadn’t actually registered yet).

    Hope that helps,

    Thread Starter fahaadsheikh

    (@fahaadsheikh)

    Hello,

    Thankyou very much for your consideration I genuinely appreciate it. Upon copy pasting your exact code I get the “Error will be displayed here” even on successful submissions. Can you please have a look and point me in the right direction on what I could be doing wrong.

    
    <?php
    add_action( 'wp_enqueue_scripts', 'my_llms_tracking_script', 777777 );
    
    function my_llms_tracking_script() {
    
    	ob_start();
    
    	?>
    
    	;( function( $, undefined ) {
    
    		/**
    
    		 * Callback function run before submitting the checkout form for PHP processing
    
    		 * Allows custom addition of stuff prior to checkout
    
    		 * @param    {[type]}    data      optional data passed in when adding the handler
    
    		 * @param    {Function}  callback  callback function
    
    		                                   return true in the callback when successful (form will proceed to the next handler or submit)
    
    		                                   return a string which will be displayed as an error message when failure (halts submission)
    
    		 * @return   void
    
    		 */
    
    		window.my_custom_checkout_handler = function( data, callback ) {
    
    			// data is available when added via add_before_submit_event()
    
    			console.log( data );
    
    			// do stuff here
    
    			fbq('track', 'CompleteRegistration', {
                        		content_name: jQuery( ".tribe-events-single-event-title" ).text(),
                        		content_category: 'Course'
                });
    
    			// on failure return the callback w/ an error message
    
    			return callback( 'This error message will be displayed' );
    
    			// on success return the callback w/ true
    
    			return callback( true );
    
    		};
    
    		// optional object of data passed to the handler
    
    		var my_custom_data = {};
    
    		// add the event
    
    		window.llms.checkout.add_before_submit_event( { data: my_custom_data, handler: window.my_custom_checkout_handler } );
    
    	} )( jQuery );
    
    	<?php
    
    	$script = ob_get_clean();
    
    	wp_add_inline_script( 'llms-form-checkout', $script );
    
    }

    @fahaadsheikh,

    As I said, this won’t actually work, it’s an example and if you paste that exactly and don’t alter it will always return the error message on line 24 of my example.

    You can remove that line if you don’t need to show errors but if you do you’ll want to add an if/else there and return either the success or failure.

    Hope that helps,

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Integrate Facebook Pixel Conversions’ is closed to new replies.