<span="dropcap">first character only</span>
3 posts by 3 authors in: Forums > CMS Builder
Last Post: March 23, 2011 (RSS)
By rez - March 23, 2011 - edited: March 23, 2011
I see the max words script but have no idea where to start with this:
I simply want to wrap the first character in a text box entry to make a fancy dropcap.
Some help auto isolating the first character from 1 text box in an editor please? :)
I simply want to wrap the first character in a text box entry to make a fancy dropcap.
<p><span="dropcap">H</span>ello world. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam dignissim convallis est.</p>
Some help auto isolating the first character from 1 text box in an editor please? :)
Re: [rez] <span="dropcap">first character only</span>
By Jason - March 23, 2011
Hi,
You could try this function:
It will take in a string, and then put the span tags around the first character and return it. You can use it like this:
you just replace myTextBox with the name of the field you want to use.
Hope this helps
You could try this function:
function wrapFirstCharacter($string){
$textArray = str_split($string);
$textArray[0] = "<span class='dropcap'>". $textArray[0]. "</span>";
$newText = join($textArray);
return $newText;
}
It will take in a string, and then put the span tags around the first character and return it. You can use it like this:
<?php echo wrapFirstCharacter($record['myTextBox']);?>
you just replace myTextBox with the name of the field you want to use.
Hope this helps
---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com
Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/
Jason Sauchuk - Project Manager
interactivetools.com
Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/
Re: [rez] <span="dropcap">first character only</span>
By zip222 - March 23, 2011
If it is not absolutely critical that everyone see the styled drop cap, you can also use CSS to do this...
more info here:
http://www.cvwdesign.com/txp/article/397/how-to-create-drop-caps-with-css-and-css3
.dropcap:first-letter {
float: left;
font-size: 4em;
line-height: .8em;
margin-right: 3px;
padding: 2px;
}
more info here:
http://www.cvwdesign.com/txp/article/397/how-to-create-drop-caps-with-css-and-css3