Can anything from toolset make jquery not work?
Hi, Toolset implements jQuery's no-conflict mode, so in general you should access the jQuery object in the namespace jQuery instead of $:
jQuery('#someid')...
...instead of...
$('#someid')...
That's why the error in the browser console says "Uncaught TypeError: $ is not a function at (index):2302".
When your jQuery code is wrapped in a document.ready handler, you can use the $ namespace if you use $ in the callback function's arguments:
// ...
// $ is undefined here
jQuery(document).ready(function($) { // place $ in the callback function parameters...
$(".comment").shorten(); // ...now you can use $ inside the function
});
// $ is undefined here
// ...
Header script to add the javascript controlled by Generate Press Elements. Can be edited here hidden link
Block where I try to make it work is the long description single field in the Toolset Archive hidden link - I've added the class "comment" to it.
The function is called in the archive page below the pagination HTML block.
An alternative implementation that I also couldn't make work below.
Using hidden link
I've uploaded the script here: hidden link
Can use the above Elements hook to insert any needed code in the header.
Another option would be a WordPress plugin if I could wrap somehow the content of a single field after x characters into a shortcode. The jquery solutions above look more elegant without having to touch the database after each change.
Checking this further, I saw that there were some errors in your JS console that is causing the script to break. Unfortunately these errors below are part of the reason why the code isn't working.
jquery.min.js?ver=3.5.1:2 Uncaught TypeError: n(...).not(...).filter(...).mediaelementplayer is not a function
at HTMLDocument.initialize (wp-mediaelement.min.js?ver=5.7.2:1)
at e (jquery.min.js?ver=3.5.1:2)
at t (jquery.min.js?ver=3.5.1:2)
Before I can debug any further we will need to ensure that these errors are cleared. I would recommend temporarily disabling all your non-toolset plugins and checking the website's console again to see if the errors are still present.
Also I recommend using the function call for the .shorten() function in its simplest form before adding the additional parameters.
Finally I did however did a small test with code below and it worked.
<div class="comment more">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Vestibulum laoreet, nunc eget laoreet sagittis,
quam ligula sodales orci, congue imperdiet eros tortor ac lectus.
Duis eget nisl orci. Aliquam mattis purus non mauris
blandit id luctus felis convallis.
Integer varius egestas vestibulum.
Nullam a dolor arcu, ac tempor elit. Donec.
</div>
However it only worked after I manually triggered the function after the errors using the JS console. What this means is that the script for the function is being loaded correctly so we just need to identify the cause of the JS errors.
This should now be working however I do noticed that all the items are not getting hidden.
Currently i'm not sure why this is soo but it could be due to the amount of paragraph tags that are there. Unfortunately there is not much I can do here in terms of debugging given that this is the case.