dilshan@jgsw.global

Hey Carl, Disabling layerslider did the trick! Thank you for the help!

Hello Jonathan, Thank you for responding. My custom code is being run on gsscript.js which, as shown in the screenshot attached, is after loading the TweenMax and DrawSVG. Also as shown in the screenshot I am console logging to test whether the script is running. This is being output in the console as well. I am back to square one. Hope you or anyone can help me out. Thanking you once again for responding

Hello Jonathan, I tried other methods to get this to work but unfortunately nothing helped. Simple tweens work with wordpress but advanced animations such as morphing and DrawSVG simply won't work. I hope you have a found a solution for this problem after posting the site in which im testing out greensock.

Hi Jonathan, Once I updated the enqueue scripts with jquery the scripts are being loaded now. But still the svg is not animating. Following is the link to the website: http://yalabz.com/dev/ba_test/ Hope that helps!

Hello Jonathan, Thank you for responding. I updated my enqueues with yours. There seems to be an extra bracket which i removed before adding it because it was causing a syntax error. After doing this the page source does not even show the files Tweenmax and DrawSVGPlugin in it. wp_register_script( 'TweenMax', get_template_directory_uri() . '/greensock/TweenMax.min.js', array('gsap'), null, true ); wp_register_script( 'DrawSVG', get_template_directory_uri() . '/greensock/plugins/DrawSVGPlugin.min.js', array('gsap'), null, true ); wp_register_script( 'gsscript', get_template_directory_uri() . '/greensock/gsscript.js', array('gsap'), null, true ); wp_enqueue_script( 'TweenMax' ); wp_enqueue_script( 'DrawSVG' ); wp_enqueue_script( 'gsscript' );

Hi there, I just started using Greensock and I wanted to directly add them into my wordpress site. But I'm facing with a rather confusing issue. I have a simple DrawSVG code that needs to be rendered in a page which works perfectly with a plain HTML file and javascript HTML: <svg id="Rays" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1920" height="1080" viewBox="0 0 1920 1080"> <metadata><?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?> <x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="Adobe XMP Core 5.6-c138 79.159824, 2016/09/14-01:09:01 "> <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> <rdf:Description rdf:about=""/> </rdf:RDF> </x:xmpmeta> <?xpacket end="w"?></metadata> <defs> <style> .cls-1 { fill: none; stroke: #fff; stroke-width: 3.79px; fill-rule: evenodd; filter: url(#filter); } </style> <filter id="filter" x="493" y="-6" width="964" height="683" filterUnits="userSpaceOnUse"> <feGaussianBlur result="blur" stdDeviation="3" in="SourceAlpha"/> <feComposite result="composite"/> <feComposite result="composite-2"/> <feComposite result="composite-3"/> <feFlood result="flood" flood-color="#ffb64d" flood-opacity="0.35"/> <feComposite result="composite-4" operator="in" in2="composite-3"/> <feBlend result="blend" mode="screen" in2="SourceGraphic"/> <feBlend result="blend-2" in="SourceGraphic"/> <feFlood result="flood-2" flood-color="#ffba60"/> <feComposite result="composite-5" operator="in" in2="SourceGraphic"/> <feBlend result="blend-3" in2="blend-2"/> </filter> </defs> <g style="fill: none; filter: url(#filter)"> <path id="path1" class="cls-1" d="M506,4l691,656,246-221" style="stroke: #fff; filter: none; fill: inherit"/> </g> </svg> Javascript: jQuery(document).ready(function(){ var t1 = new TimelineMax({repeat:-1}); t1 .from("#path1",2 ,{drawSVG:0}); }); I included the necessary greensock files using "wp_register_script" and "wp_enqueue_script". I utilized visual composers Raw HTML and JS elements to define the above code. But the animation isnt happening and there is no error on the console either. Following are my enqueue scripts: wp_register_script( 'TweenMax', get_template_directory_uri() . '/greensock/TweenMax.min.js' ); wp_register_script( 'TimeLineMax', get_template_directory_uri() . '/greensock/TimelineMax.min.js' ); wp_register_script( 'DrawSVG', get_template_directory_uri() . '/greensock/plugins/DrawSVGPlugin.min.js' ); wp_enqueue_script( 'TweenMax' ); wp_enqueue_script( 'TimeLineMax' ); wp_enqueue_script( 'DrawSVG' ); Simple Tweens such as changing filter to inherit is working fine with the SVG but animations like MorphSVG and DrawSVG seems to do nothing. Am I doing anything wrong or am I missing something. Any help would be great! Thank you in advance!