Limit Characters

[Tramposch 1]

I want to limit characters for a string so it fits in the designated area. I need it to be no longer than probably 20 or so characters, then it puts a "..." after it. Just a little direction is all I really need. I have searched around for the past 30 minutes trying to find a solution but have thus far failed. The string I am trying to limit is

<li><a href="twitter.com/PassTheBoll/ twitter_messages('PassTheBoll', 1, false, false, 'all', true, true, false); ?></li>

That is getting my first twitter update and displaying it on my website. Obviously an update could be a lot longer than desired and ruin the look of the website, so I need to lop off some text.Like I said, guidance is really all I need, though an AIO solution would make my life easier .My URL is in the sig.

[jlhaslip 4]

Went to your site and really could not figure out where this element is on your page.Could you be more specific with your request, please.I have a script/function to shorten URLs which would likely work, but I need to know what sotr of data the request is working with. It is a text reply from the "twitter_messages" function you describe above? And what does the actual produced data look like?

[truefusion 3]

I haven't checked your site, but you seem to be trying to do similar to text-overflow. If so, just use the CSS and have the browser do all the work. That way, upon hover, you can have the text "complete" itself.

[Tramposch 1]

Went to your site and really could not figure out where this element is on your page.Could you be more specific with your request, please.

I have a script/function to shorten URLs which would likely work, but I need to know what sotr of data the request is working with. It is a text reply from the "twitter_messages" function you describe above? And what does the actual produced data look like?

The product is in my navigation menu right now. I might move it but I sill need it limited. On my website it's right below the banner starting with PTB.

I haven't checked your site, but you seem to be trying to do similar to text-overflow. If so, just use the CSS and have the browser do all the work. That way, upon hover, you can have the text "complete" itself.

I'll check out the text overflow after I get home. I think I might have tried it but maybe I did it wrong.

Thanks for the suggestions.

[Tramposch 1]

I tried the text-overflow method and it doesn't work. I tested it on multiple browsers and tried adding different widths and everything. Maybe I am just using it wrong. The string I am using to incorporate it is:

<div style="text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis;">

[jlhaslip 4]

The CSS3 specs do not include the text-overflow yet.
Also, you need to be using a CSS3 compliant Browser.

What are you using now?

In the meantime, check out this php function I wrote to shorten URL's on a site. I'm sure it can be modfied to reduce the length and add the ellipses into your output.

<?php function check_url($href, $name){ // line #636 of AEF 1.06 /main/functions/bbc_functions.php			// jlh adjust name length 		if ( strlen($name) >= 27) {				$name =  substr($name, 7, 22);  // strip off the http://			if ( strlen($name) >= 27) {	 // grab the next 15 characters				$front = substr($name, 0, 15);				}  			$back = substr($name, strlen($string)-5, 5); // grab the last 5 characters			$mid = "..."; // stuff the middle with an ellipse character			$name = $front . $mid . $back;  // glue the parts back			}		// jlh adjust name length				$href = preg_replace("/java script:/i", "javascript-aef: ", $href);			return '<a href="'.$href.'" target="_blank">'.$name.'</a>';} ?>

[Tramposch 1]

If they do not include text-overflow yet, how would I use it?I am using FireFox 3, but I tested it on Chrome and IE too.Ill try out that script though.EDIT: I read over the script and I really don't know where to begin. I am not really that great with PHP.

Edited December 18, 2008 by Tramposch (see edit history)

[jlhaslip 4]

How many characters do you want to allow before the ellipses are added? How wide do you want the output?

[Tramposch 1]

I would say around 30 characters would be a good size. I haven't counted it out but I assume I can change it if I need to. As for the width, I am uncertain of that. The whole menu bar is 490px, but not all of it is part of the output.

[truefusion 3]

I tried the text-overflow method and it doesn't work. I tested it on multiple browsers and tried adding different widths and everything. Maybe I am just using it wrong. The string I am using to incorporate it is:

 

<div style="text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis;">

You need to provide overflow: hidden and specify a width that is shorter than the length of the text as well. I tested it in Opera 9.62 and it works there. Tried it in Firefox 3.0.4 but doesn't work there; maybe in Firefox 3.1 it might work. Tried it in Konqueror 4.1.3 and it works there.

<div style="width: 100px; text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; overflow: hidden;">

[Tramposch 1]

I'll stick with the server side method until it is more widely supported.

[jlhaslip 4]

I don't have a Wordpress installed to check or confirm any results from the twitter_message function, so I will have to pass on this one.Pretty sure the above function can be modified, but I simply can not test the results. Sorry.

[Tramposch 1]

Thanks for the help. I'll ditch the idea until I can figure out how to modify that haha. Or if somebody provides a good alternative