Trim tweets from plugin

Question

I am using this Wordpress plugin

https://smashballoon.com/custom-twitter-feeds/demo

I would like to trim the Tweets to 120 characters.

I have no JS skills and very little php - I tried this which I found but I don't know if it's relevant at all.

$twitter_feed = (strlen($twitter_feed) > 120) ? substr($twitter_feed,0,10).'...' : $twitter_feed;
enter code here

I also attempted to edit my working code for trimming my post titles to suit which did not work.

    function custom_trim_my_tweet( $twitter_feed ) {
        global $uncode_vc_index; 
        if ( is_singular() && !$uncode_vc_index )
            return $twitter_feed;

$twitter_feed = wp_trim_words( $twitter_feed, 9 );
    return $twitter_feed; 
}
add_filter( 'ctf-tweet-text', 'custom_trim_my_tweet' );

What is the result you're getting? Are you getting any errors? — Azer, Mar 13 '19 at 01:34
unfortunately I don't get any result and a number of errors for both: Uncaught SyntaxError: Unexpected identifier Uncaught TypeError: $(...).tooltip is not a function Uncaught ReferenceError: Waypoint is not defined amongst others — Mr Toad, Mar 14 '19 at 14:59
It sounds like you're having problems with code outside of what you included in your question. For example, getting a warning that `$() is not a function` is a common thing in wordpress. Normally when you use the jQuery library you will use `$` to reference the jQuery object, however, the version of jquery included in WordPress do not use this syntax. You have to rewrite your jQuery code to use `jQuery()` instead of `$()`. Are the errors your getting only from JavaScript? Or are you getting any php errors as well? — Azer, Mar 15 '19 at 05:49
Thank you for your reply. To be honest, I would be surprised if any of the code it correct at all. I don't know JS, I just thought I would have a try. I tried pasting into the themes js file instead of my own and while I don't return all the errors, neither of them work. — Mr Toad, Mar 16 '19 at 12:06
No problem. Perhaps you should ask someone you know to take a look at the entire site and see if they can find and fix the bugs. Or if you have the time, take a couple of days and try to understand the JavaScript that's causing the bugs, and try to troubleshoot the errors yourself. Fixing what's worng is a great way to learn! — Azer, Mar 18 '19 at 05:19
Hi there - thanks for your reply, but the site does not have bugs, the errors are only caused by me attempting to write JS and trim the tweet characters. I have tried myself, which is what those attempts were but that code was a total stab at it from me. I wouldn't need to learn what the errors were, I would need to learn javascript, which I want to do but right now I just need to deal with this issue. I provided the URL in hopes someone could work out how to trim any tweets off that website - given it's the same plugin. — Mr Toad, Mar 19 '19 at 09:46
I'm not sure JavaScript is the best way to solve this problem, but I'll write an answer below on how to cut a string in JavaScript. — Azer, Mar 20 '19 at 01:48

Azer · Answer 1 · 2019-03-20T04:10:22.407

To trim the text using JavaScript:

First you have to select the element using a css selector. It's easiest if you can select the elements using an element id, like so:

var tweet = document.getElementById("my_tweet_id");

Then you can grab the text content of the element with element.innerText

var tweetText = tweet.innerText;

Then you can simple cut the length of the text inside the element using string.substring()

tweet.innerText = tweetText.substring(0, 120);

I honestly think you should try to fix this at the plugin/wordpress/php level rather than cutting text in JavaScript. But if that's what you want to do, then the above methos would work.

EDIT: In case the tweet elements do not have unique ID's you will have to select all of them and then loop through each and perform the text-cutting. I'll give you an example of how to do that:

You might have to be a bit creative with your css selectors depending on how the tweets are displayed.

In my example I will assume that you have a div with the ID 'tweets' that then holds five separate div elements, one for each tweet, that all have the same class of 'single-tweet'.

First we get all the 'single-tweet' elements:

var tweets = document.querySelectorAll('#tweets .single-tweet');

tweets now contain a node list of the five 'single-tweet' divs.

Then we loop through them with .forEach() and do the text-cutting on each element.

tweets.forEach( (tweet) => {
    tweet.innerText = tweet.innerText.substring(0, 120);
})

Now all of the 'single-tweet' elements will contain what's left after you cut the text down to 120 characters.

Trim tweets from plugin

1 Answers1