![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
Have you ever though, "Man oh man, I wish I could make my text look a lot better." If so, then this tutorial is for you! How would you like all your text to come up completely different? Actually come up as predesigned graphics instead of the text you entered. This is how.
First you need a graphic library, the one I made is simple and was made in photoshop. I didnt take a whole lot of time making the letters so some arnt centered properly. The library I made up looks like this, but is not limited to:
A = |
B = |
C = |
D = |
E = |
F = |
G = |
H = |
I = |
J = |
K = |
L = |
M = |
N = |
O = |
P = |
Q = |
R = |
S = |
T = |
U = |
V = |
W = |
X = |
Y = |
Z = |
! = |
. = |
Below type any letters you see above and click submit. The CF code will replace the letters with letter graphics.
Lets see exactly whats going on in the window above. Here is the code (I have commented the code to explain what is going on here):<!--- If the form has been filled out then process the following code --->
<cfif #FORM.title# NEQ "">
<!--- Tell ColdFusion that instead of typing #FORM.title#, we can use #title# instead --->
<cfset title = #FORM.title#>
<!--- We are just showing how many charcters were submited in the form, this is for show --->
Length of String: <cfoutput>#len(title)#</cfoutput>
<br><br>
Graphic Version:<br>
<!--- #number# has to atleast be defined once before being called and #word3# as well --->
<cfset number = 0>
<cfset word3 = "">
<!--- We want to run this code as many times as there are letters. #len(title)# is how many characters were submited --->
<cfloop from="1" to="#len(title)#" index="i">
<!--- Make #number# increment by 1 during each loop --->
<cfset number = #val(number + 1)#>
<!--- We are grabbing each letter one by one for processing, increments by one from #number# --->
<cfset word2 = mid(title,number,1)>
<!--- If the letter being processed is not a period, a space, or the enter key then process the following code -->
<cfif #word2# NEQ " " AND #word2# NEQ "." AND #word2# NEQ chr(13) AND #word2# NEQ chr(10)>
<!--- Replace the text letter with the graphic letter .jpg file --->
<cfset word3 = word3 & Replace(word2,word2,'<img src="/images/letter_images/#word2#.jpg" alt="#word2#">',"all")>
</cfif>
<!--- If #word2# is a space then process this code --->
<cfif #word2# EQ " ">
<!--- Replace the space with the graphic space .jpg file --->
<cfset word3 = word3 & Replace(word2,word2,'<img src="/images/letter_images/blank.jpg" alt="space">',"all")>
</cfif>
<!--- If #word2# is a period then process this code --->
<cfif #word2# EQ ".">
<!--- Replace the period with the graphic period .jpg file --->
<cfset word3 = word3 & Replace(word2,word2,'<img src="/images/letter_images/dot.jpg" alt="period">',"all")>
</cfif>
<!--- If #word2# is the enter key then process this code --->
<cfif #word2# EQ chr(13)>
<!--- Replace the enter key with the enter key .jpg file --->
<cfset word3 = word3 & Replace(word2,chr(13),'<br>',"all")>
</cfif>
</cfloop>
<!--- Output the graphics --->
<cfoutput>#word3#</cfoutput>
</cfif>
---------------------------------------------------------------------------------------------------
You can download a full working version of this code which you can modify here. Otherwise, enjoy!
Wesley Geddes, Owner
Complete Creations