Zoomy script not working in Joomla K2 site - javascript

I have a Joomla K2 site, and when user clicks on the image in K2 it should be opened in a popup with k2. But now that doesn't work anymore and the problem is in the Zoomy script. Here is an item from my site can any body help me fix this problem?

Well I think the problem is that you have 5 versions of jQuery running lol. If you open the source using Firebug or Chrome's extension, you will be able to see. If the extensions you have have a jQuery parameter, turn 4 of them off, else use the following code to ensure that it's only embedded once:
<?php
// load jQuery, if not loaded before
if(!JFactory::getApplication()->get('jquery')){
JFactory::getApplication()->set('jquery',true);
$document =& JFactory::getDocument();
$document->addScript(JURI::root() . "path_to_file/jquery-1.8.2.js");
}
?>
Update:
Here are the jQuery files being embedded:
ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js
ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js
/plugins/content/plg_zoomin/plg_zoomin/jquery-1.5.min.js
/modules/mod_sj_k2_accordion/assets/js/jquery-1.5.min.js
/plugins/system/onexitpopup/js/jquery.1.7.1.js
Im not sure where the 2 googleapis ones are coming from, but 1 is coming from a module called mod_sj_k2_accordion and the others are coming from 2 plugins. So find the plugins and either remove the jQuery reference or add the code I posted above instead. If you do use the code I posted above, please make sure you change the path your path.

Related

Uncaught ReferenceError: d3 is not defined in WordPress Visual Composer

I want to edit some images which can only be done in WPBakery Page Builder. So, when I try to edit the page with it, the frontend editor (page builder) doesn't loads. Console shows the following error:
Although, the library script tag is added before the tag which is using this library:
I don't know if any of this makes sense, but, yeah, I have tried these solutions because they were mentioned on different forums:
Adding charset="utf-8" to external script tag.
Moving the script tag inside Raw HTML element.
Using $(document).ready(function(){}) to enclose the whole of second
script. So, that it loads after everything is loaded.
Unfortunately, none of these worked for me.
The page builder works fine on pages where I don't use the d3.js library. And, the visualization works fine WHEN NOT IN PAGE BUILDER - the library loads up and the visualization is displayed. You can check it out here:
https://conductscience.com/age-when-charles-darwin/
Also, please note that I don't have access to any of the theme files. So, I can't make any changes to functions.php or any other file.
Your question is related to the WPBakery, not Visual Composer plugin. You need to have the latest version 5.7 in order to fix this issue. More information, contact support.wpbakery.com if you have a valid license.

jQuery - working / not working - joomla, google libs

I've got an odd situation and can't figure it out why my JavaScripts are not working.
this is the general problem - if I load jquery 2.2.0 from this link:
"https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"
it all works fine
however Joomla is loading it's own version 1.2 which I've overridden with my template to current 3.3.1 version
at this point things are working but I've got 2 jQuerys loaded (one from joomla and other from google lib)
if I remove google 2.2 version, JS is not working (loading with standard script inside html)
if I replace jquery in my template with 2.2.0 version from google it is not working still (loading trough joomla head)
I get this error: TypeError: $.tablesorter is undefined
it makes no sense to me
Not sure if this will help but I had similar issue on my WordPress website and solved using jQuery Migrate: https://github.com/jquery/jquery-migrate
Usage
In your web page, load this plugin after the script tag for jQuery, for example:
<script src="https://code.jquery.com/jquery-3.0.0.js"></script>
<script src="https://code.jquery.com/jquery-migrate-3.0.1.js"></script>
shame, there are a few more ways you could get it working.
So were on same page have you fully removed the Joomla 1.2 jQuery? You mentioned you replaced it with the 3.3.1
also is it a specific page that requires the jQuery 2.2? or are you wanting to move to jQuery 2.2 for the whole site?
if you just need it on one page you could do some php in the header to switch the jQuery used depending on the page URL that way it would only load the required one and not 2 jQuerys on each page. Not the most ideal way but should work.
<?php
//First detect the URL
$url = (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? "https" : "http") . "://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
//Now do the if else to switch jQuery on desired page.
if (strpos($url, 'myPage.php') !== false) {
echo '<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>';
} else {
echo '<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>';
}
?>
if you need or want it on the latest jQuery i would remove all jQuery and jQuery Migrate then put the latest versions of both in and then try and solve the errors remaining
can you share more errors?
e.g errors with just jQuery 1, then errors with just 2 and so on?
I have managed to resolve the issue by replacing all
$(function () {...
With
jQuery(function ($) { ..
I'm loading latest jQuery from my own server
I have exact same setup on another site and have no such problems

JS FlexSlider doesn't work in Joomla 3

I have a JS FlexSlider module in my joomla page.
It works fine on all positions but not at the Position I want it to be.
And the position works fine with all other modules.
Here is the page: http://www.ehemalige-hoelderlingym.de
If you check your browser console, you will see a JS error. You also have 2 jQuery libraries being imported which simply means that the developer of FlexSlider has not stuck to Joomla coding standards.
In the Module Parameters, you will see the option Enable jQuery 1.8.2? which you need to set to No.
This will prevent duplicate jQuery libraries being imported and thus most likely fix the console error.
They should really remove this option for the Joomla 3.x version of JS FlexSlider as it is simply not required.
Update:
I've checked Firebug and you're now getting an error because the module is importing the script before jQuery.
You have 3 options:
Option 1: Download and install the jQuery Easy plugin. This will ensure jQuery is loaded only once and before any other script on your site.
Option 2: Create a Template Override for the module and once done, in the default.php change this:
<script src="modules/mod_js_flexslider/assets/js/jquery.flexslider-min.js" type="text/javascript"></script>
to this:
<?php JHtml::_('script', JUri::root() . 'modules/mod_js_flexslider/assets/js/jquery.flexslider-min.js'); ?>
Option 3: Use a different slider extension
Personally I would go with option 3 as you shouldn't have to rely on a 3rd party plugin to get a slider working, and option 2 is something the developer should do.

Activating wordpress plugins breaks jquery effects

I'm currently working on converting an HTML5 template called Rekreato into a wordpress theme. I've managed to set up a bare-bones theme, but whenever I activate any plugins with jQuery scripts, a few of my jQuery effects are broken. Specifically, in Firefox debugger I get --
TypeError: jQuery.easing[jQuery.easing.def] is not a function #
jquery.easing.1.3.js:46
Here is the page in question. You can see about halfway down there is an image slider that is not functional. I have left one plugin active, called WP eMember.
I've tried a number of things like configuring my theme as a child theme, wrapping jquery.easing.1.3 in a document ready function, and moving the script call around in the code, but to no avail. I'm not even sure that the easing script is at fault. The answer is probably staring me in the face, but I can't seem to figure it out. Many thanks in advance.
EDIT: Excellent suggestion from markratledge. I put the scripts in functions.php with wp_register_script() and wp_enqueue_script(). At first I was very confused that even more things were broken. Reading further, I saw that since Wordpress uses a noConflict wrapper around its built-in jQuery library, the $ shortcut is unavailable. So, I went through all of my scripts that were showing errors in the inspector and swapped '$' with 'jQuery'. Voila! Everything jives. Thanks again!
Check out Function Reference/wp enqueue script « WordPress Codex on how to load JS in WordPress themes and avoid jQuery errors, with examples shown.
You're loading a bunch of jQuery by direct link, but then wp_head comes in and loads more jQuery for the plugins, and collisions occur. I.e., the two different main jQuery libraries; check in the Firefox console to get a list of all the JS that is loading.
From that doc:
wp_enqueue_script links a script file to the generated page at the right time according
to the script dependencies, if the script has not been already
included and if all the dependencies have been registered. You could
either link a script with a handle previously registered using the
wp_register_script() function, or provide this function with all the
parameters necessary to link a script.
This is the recommended method of linking JavaScript to a WordPress
generated page.

3rd Party Script Breaking my JS

I have a 3rd party script that displays some data on my site. When the script loads it breaks all of the JS on any page the script is in. I remove the script and my page works without issue.
Are there ways to prevent 3rd party scripts from interacting with my page in a way the breaks the page?
Notes:
I have no access to the 3rd party script to edit.
I am using jQuery for the scripts that are breaking. I have in place jQuery.noConflict yet it still breaks the page.
I have attempted to load the script in an iframe to see if that made a difference. It did not.
The script does write data to the page, mainly CSS and HTML
Note: The below code may contain references/links to drug content, mainly marijuana.
I am building a site for a medical marijuana dispensary. I am importing the menu of the dispensary from a site called WeedMaps. Their embed code looks like this:
<script type="text/javascript">var wmenu_id = 1111;</script> //The number correlates to the menu I need to pull, I have changed it in this question
<script type="text/javascript" src="http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js"></script>
When I use the above code the JS of my site breaks. How to I prevent my code from breaking when using 3rd party scripts over which I have no control.
UPDATE
Here is a JS Fiddle. The menu opens but doesn't close properly. Remove the script that is generating the menu from weedmaps and the menu works correctly. (The weedmaps menu script is in the bottom of the HTML panel.)
Hmm, not having much luck. I'll add what I have, since it may trigger further ideas from you. However, in short, I think their script isn't written particularly well, and that they really do need to fix it on their end.
As it stands, Firefox shows this error when animating the menus:
TypeError: jQuery.easing[jQuery.easing.def] is not a function
This blog suggests that this occurs when the Easing plugin is loaded before jQuery. Fine, I thought - we just need to load the WeedMenu script after our jQuery has loaded. So I tried the following (with help from here):
$j.getScript('http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js');
That gave me this error:
A call to document.write() from an asynchronously-loaded external script was ignored.
Turns out that occurs as a result of the WM script using document.write, which is desperately out of date. So that lead me on to find crapLoader, which is meant to handle this sort of thing:
crapLoader.loadScript("http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu-widget.js", "menu-script");
Unfortunately that brings me back to the original Easing error.
Here's my fork - let me know if you find anything!
The script is not well written, I was able to solve my issue by removing a line of code from the script. The link I provided list to a longer script. The script had this line of code:
try {
b("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), "function" != typeof wmenu_strains_callback && b("http://legalmarijuanadispensary.com/components/com_weedmenu/weedmenu.js", !0)
}
if I remove b("http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"), then the script works and my page works. What was happening was the script was inserting jQuery into the bottom of my head and breaking the rest of my javascript.

Categories