dw tips.doc

8/14/2019 DW Tips.doc

1/35

DW TIPs 1-10

http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/Ke!oardShortcuts.asp"

1. Support #ome

Support

$. %ommo& 'rror (essa)es

*. +se,ul +p)rade Tps

. + Path %o&,uso& a&d Wh Ima)es or ack)rou&ds are &ot show&) up correctl

2. Sett&) Ke!oard Shortcuts to !e more productve

3. Se&d&) 'rror (essa)es to the %ustomer Support

- Pr&t Scree& Trck

4. 5I&d a&d eplace Tps

6. (ouse ollover Ima)e Pro!lems - Ima)es are &ot show&)

7. aout versus Sta&dard 8ew & Dreamweaver

- whch o& to use

10. Ste De,&to&s: ocal9 emote9 a&d Drector evels

11. 'dt&) 8ertcal Tree (e&us

1$. %a&t see a& templates & the ;ssets WI&dow

- ecreate Ste st

1*. ( ,les do&t seem to have updated - +pdate Ste

1. What resoluto& should I des)& m we! pa)es ,orte"t9 html9 a&chor ta)s9 ma)es? that co&ta&s CavaScrpt rollover code9

s dra))ed &to a l!rar tem9 l! ,le9 Dreamweaver th&ks ts stll a re)ular we! pa)es a&d

wll automatcall add CavaScrpt code as well as the o&oad !od ta) CavaScrpt.

I, ths happe&s9 care,ull select all the CavaScrpt that was created9 scrptE ...../scrptE ta)sa&d the !odE ta) a&d delete such code.

$. ! only see one image in my +!$#)#, !T*' but ! am sure ! put more than one image'sort of li/e 0 or so

I, ou made a l!rar tem ,rom scratch9 va choos&) the New !rar Item !utto&9

Dreamweaver (F automatcall put code lke the ,ollow&):

meta http-eGuvH%o&te&t-Tpe co&te&tHte"t/htmlJ charsetHso-6627-1E

I, ou are us&) CavaScrpt rollovers9 Dreamweaver (F automatcall puts scrpt ta)sE

!odE ta)s a&d Bavascrpt ,u&cto&s to ha&dle the rollover.

S=+TI=N: Cust delete ths added &,ormato& a&d save the ,le...everth&) should the&

work as &ormal.

*. #ollovers aren1t wor/ing on my computer

Depe&d&) upo& the how th&)s are setup o& our computer there s a l&e & the swap.Bs ,le

,or calculat&) the ,le path o, a& we! patter& us&) rollovers.

Near the !ottom9 past l&e 66.

2)S* 345 5 5 5 5 5 5 5 m6)d7usted6slash6length 8 slash)rray9length -array6(older6!nternal.indows9length - 4:

This is sometimes a ; or 49

I, ou do&t )et the rollovers to work ,or the spec,c case o, whe& test&) t o& our

computer wth &o we! server setup or &o test&) server co&,)ured & Dreamweaver9 tha& ths

s where thats set.

5rom &ow o&9 I am pro!a!l )o&) to recomme&d to evero&e to alwas have a test&)

server setup a&d that mea&s the have to have a perso&al we! server o& ther sstem as the9

who should !e a we! savv9 should & the ,rst place.

%;S' $9 ,le method9 s more o, a ,eature o, co&ve&e&ce a&d we! stes us&) Bavascrpt

should&t !e tested that wa a&wa.


4/35

A=+ '%'I8' T#IS '= ('SS;L'

P#"$+*

Aou most lkel are attempt&) to re&ame a& tem to a& tem that has the S;(' N;('.

S"+&T!"N

+se a d,,ere&t &ame. =r re&ame the e"st&) tem. a&d the& re&ame the other tem.

;LLLLLLLLLL###########MMMMMMMMMMM

W#;T IN T#' W=D s )o&) o&?MH0?O d.((pQBRH&ew Ima)eJ d.((pQBR.srcHaQRJ ,u&cto&

((,&d=!B>&9 d? O //v.01 var p99"J ,>Md? dHdocume&tJ,>>pH&.&de"=,>p1?R.docume&tJ

&H&.su!str&)>09p?J ,>M>"HdQ&R?d.all? "Hd.allQ&RJ ,or >H0JM"d.,orms.le&)thJ?

"Hd.,ormsQRQ&RJ ,or>H0JM"d.laersd.laers.le&)thJ?

"H((,&d=!B>&9d.laersQR.docume&t?J ,>M" d.)et'leme&tId? "Hd.)et'leme&tId>&?J

retur& "J //--E

P#"$+*

Dreamweaver (F sometmes dur&) updates to ,les9 &amel l!rar tems wth CavaScrpt rollover9

wll automatcall add the CavaScrpt code to make the rollover ,u&cto&. ecause the code s

usuall & a ta!le cell that has &owrap o&9 ou wll have a& usuall wde we! pa)e. Thus9 ou wll&ot !e a!le to see a&th&) s&ce the &av!ar s so ,ar to the r)ht a&d ou wll have to scroll

hor@o&tall to the r)ht Bust to see t.


5/35

."#?9 has to !e P'5'%TA coded....I& other

words9 all o, the parameters (+ST ' %='%T9 t ca&&ot call adBace&t ma)es a&d the ma)e

&ames must !e correct.

Aou pro!a!l have some o, the code & the T=PN;8 l!rar tem swtched arou&d

Thu9 *1 =ct $01* 04:3:$ L(T

-88888888888888888888888888888888888

*. +se,ul +p)rade Tps

*Please maximize your browser as we want to use

big pictures so you get a big and clear picture of what to do --->

SUMMARY - IN PLAIN ENGLISH on WHAT TO DO

You can think of Editable Regions as protected areas that are not touched by Dreamweaver during awebsite update. The problem is that old websites don't have these Editable Regions tags in the firstplace. These Editable Regions tags can also be thought of as

" tags of protection".

in other words it's like talking to Dreamweaver and saying
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/Upgrade.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/Upgrade.aspx


6/35

S"+&T!"N

"/' so let1s 7ust mar/ =or surround the main content in each of these web page of the oldwebsite with these new editable regions tag ?fancy-html-comment-tags-that-dreamweaver-recognizes@ =See below for what an *ditable #egion Tag loo/s li/e

$ut there is one last thing to do9 )nd that1s let Dreamweaver also /now which template to usewhen updating webpages andAor child template files9 So you also have to put another specifictag up top' letting Dreamweaver /now which template to use9 This tag is a single tag andanother @fancy-html-comment-that-Dreamweaver-can -also-understand@9 =See below for whatthe template


7/35


8/35


9/35

B&*ST!"NC

Do you search forC

*)P+* ) -N"T ""D

=

Do ou search ,or:

*)P+* $ -""D


10/35


11/35

upgrade notes and blog

1. '"perme&t wth 5&d a&d eplace a&d )et )ood at t.

$. (ake sure ou k&ow how to use the #=T K'AS ,or %+T9 %=PA9 a&d P;ST' whch are

%=NT=-F9 %=NT=-%9 a&d %=NT=-89 respectvel.

*. e care,ul o, Bust cop&) the demo va&lla patter&s Template a&d !rar 5les &to our

&ew we! ste drector.

. What ca& happe& s the S+P' a&d T=PN;8 templates all )et cha&)ed whe& ou )ot a

)lo!al ,&d a&d replace.

2. Its alwas !est to !r&) up =NA T#=S' 5I'S >e.). $0 ,les? that are )o&) to !e cha&)ed

& the =pe& Docume&ts w&dow....

3. Do N"Tdo a& '&tre %urre&t ocal Ste 5&d a&d eplace whe& add&) the ma& outermostta)s

4. Wth& the 5&d a&d eplace Wd&ow9 set the Search dropdow& !o" to Source %ode.

6. Whe& us&) the 5&d a&d eplace9 ;W;AS do a 5IND ; !e,ore a 'P;%' ;.

The reaso& !e&) s ou wa&t to look at the results w&dow a&d see what was ,ou&d9 =N'

A =N'9 ! dou!le clck&) o& each result ,ou&d.

7. P;%TI%'9 P;%TI%'9 P;%TI%'..... (ake several !ackup copes o, our we! ste a&d

tr do&) these 5&d a&d eplace procedure o& them

10. TAPI%; S%'N;I=: 100 pa)e we! ste dvded up eve&l &to 2 cate)ores.

1. 5rst use the ,le w&dow & Dreamweaver a&d ope& up the $0 ,les that !elo&) to a

SINL' cate)or.

$. Seco&d9 ,&d where the or)&al co&te&t starts ,or the $0 pa)es that are all ope&. Do

ths ! us&) the 5&d a&d eplace comma&d. '('('9 do a 5IND ;

(!#STa&d also dou!le clck o& each search result to make sure ou are )ett&) thecorrect locato&.

*. Thrd9 select the &ew code that s to !e added va the ta!le !elowJ whch , ou are

do&) the ,rst o&e 19 t wll !e M-- e)&'dta!le od Te"t --E

>Wrte ths dow& , ca&t remem!er t = ope& up Notepad a&d leave a s&ppet &

them so ou ca& use the %o&trol-% to )et t whe& ou &eed t wthout hav&) to tpe t

over a)a&.

. Dreamweaver automatcall9 >at least sometmes t does? put the curre&tl selected

te"t & the 5&d Te"t!o". Thus ou ca& use select the &ew te"t !e,ore ha&d a&d ht

%o&trol-% a&d save t to our clp!oard.

2. ;&d the& )o to the old te"t select that9 a&d ht %o&trol-5 ,or 5&d a&d eplace.


12/35

3. The& )oto the eplace Te"t!o" a&d ht %o&trol-8 a&d paste the &ew code & there a&d

ht eplace.

4. (ake Se&se< =&ce ou )et the ha&) o, ths set o, ke!oard strokes a&d method9 ou

wll !e do&) t a)a& a&d a)a& as ts ,a&tastc tme saver.

elow are TAPI%; ST;T a&d 'ND T;LS that ou m)ht wa&t to use as markers.

$)S!2)++, ,"& .)NT T" )DD T%* $+&*2"D* N*T T" ," #*D2"D* )S,"& 2)N S** $*+".9


13/35

UUUUUUUUUUUUUUUUU

B&!2< (!E* =0 ST*P )N&)+ P)* $, P)* &P#)D*

5urthermore9 , there are pa)es that do&t update9 ou ca& stll easl up)rade them.

(irst' ou ca& ope& up the or)&al =D we! pa)e & Dreamweaver.

Second' make a N'W pa)e o,, o, a template.

Third' )o !ack to the =D pa)e9 use the ta) selector at the !ottom o, the w&dow to select thedesred ta!le , poss!le. =9 Bust use the mouse a&d select the e&tre te"t that ou wsh a&d ht %=PA or %=NT=-%

(ourth' Loto the New pa)e9 a&d &sde the od Te"t 'dta!le ;rea >that s9, ou stuck the &am&)co&ve&to& o, the dmeo we! patter&s a&d ht9 %=NT=-8 or Paste

(ifth S;8' the N'W pa)e wth the same &ame as ou see & the =D pa)e.

T%)T1S !TF

G9 + Path 2onfusion

$*+". )#* a (*. reasons why your image or anchor tags don1t show up or wor/

3;C 2hoosing the + and images via the (ile $rowse .indow in DreamweaverAou should almost alwas choose D"2&*NT opto&.
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/URL_Path_Options.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/URL_Path_Options.aspx


14/35

34C $)2


15/35

2"##*2T .),C;ll ma)e !ack)rou&ds +s & the S+P' template should !e de,&ed & a separate %SS

stlesheet 5I'S lke:

M123T45TMen2T674"'ss

or

M123Tree2T674"'ss

These separate stlesheets are the& INK'D to the S+P' template va the INK ta)s. 5or

e"ample:

The reaso& to do t ths wa s !ecause o, whe& ou +pdate Pa)es...9 Dreamweaver does&t update

the stle ta)s ma)e +s & a& o, the templates. Thus that + s alwas )o&) to o,,.

Dreamweaver D='S update sta&d alo&e ma)es9 !od ta) drect !ack)rou&d ma)es l&ks9 a&chor

l&ks a&d all other stu,,. It Bust does N=T update a %SS &l&e stle ma)es +.

Ths s also e"tra code that &eeds to !e dow&loaded ,or each pa)e as ts the !ack)rou&d. put that

code & a stle sheet t s o&l dow&loaded o&ce a&d s&ce our pa)es are )o&) to use %SS

stlesheets a&wa9 ts wse to at least de,&e the !ack)rou&d ma)e & the %SS stlesheet ,le

a&wa.

3HC !mages are N"T showing in some pages' but do wor/ in other pages9I, ou clck o& a ,le a&d cop a&d paste t &to a&other ,older9 Dreamweaver wll )e&erall N=T

update a&th&) & that pa)e lke ma)es or a&chor ta)s. ;ddto&all9 most lke wll &ot !e wro&)

a&d &correct.

I, ou wa&t to cop a pa)e a&d put &to a ,older9 & other words cha&)e the locato&9 ou must9

%I%K a&d D;L

the ,le to the &ew ,older.

D= N=T %=PA a&d P;ST' the ,le &to a&other ,older.

See the d,,ere&ceke!oard shortcut?

$. I, ou attempt to look ,or o&e o, the template comma&ds9 lke "pen )ttached Template 'ou m)ht N=T !e a!le to ,&d t. The o&l comma&d ou ca& ,&d9 at ,rst )la&ce9 would !e

Template Properties9 whch s N=T the o&es ou reall wa&t.

*. T%* T#!2&de" card s@e?

I, ou tur& ths post t &ote vertcall a&d use a par o, scssors to cut o,, a& &ch strp so that

ou have a $ 4/6"1 s@e9 ou ca& use a pe&cl or pe& to dvde &to ,our >? secto&s a&d la!el

the 5 K'AS up top to however ou have them set.

I9 Sending *rror essages

how to send a screen shot of your errormessage that you saw to anyone via e-mail

0. PINT T#IS P;L' =+T , ou ca& so ou ca& easl re,er to t.

;9Let the 'rror o& mo&tor. D= N=T #IT =K as ou wa&t the other perso& tosee the error messa)e
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/KeyboardShortcuts.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/PrintScreenTrick.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/KeyboardShortcuts.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/PrintScreenTrick.aspx


17/35

49 P'SS the ,ollow&) kes o& our ke!oard.

QS#I5TR-QPINT S%NR

*. htt&) that ke!oard com!&ato&9 a cop o, our 'NTI' mo&tor s &ow o& ou clp!oard.

Aou ca&t see t r)ht &ow9 !ut ts there9 =KStart -E Pro)rams -E ;ccessores -E Pa&t? (croso,t PowerPo&t

(acromeda 5reworks

(acromeda 5reeha&d

09Save the Docume&t or 5le to a ,amlar locato&.

I9Se&d the e-mal wth the attached ,le or docume&t ou Bust saved.

=PTI=N;: Aou ca& also Vp t up as well to make t smaller whe& ou se&d

4.5ree Pr&t Scree& +tlt ,or W&dows 76/(e/$000/FP or NT

http://www.)adw&.com/pr&tscree&

)2!NT"S% "S Scree&shot #ow To ,or (ac =S F va the Lra! Tool 9Scree&shot #acks ,or (ac =S F

J9 (ind )nd #eplace Tips

Find and Replace Techniqe!elo" i# an e$a%ple o& ADDING a line o& code'

NEW (ODE YOUR WANT TO ADD)


18/35

REPLA(E WITH)


19/35

SEE HOW THIS TE(HNI5UE WOR*S6

Do 3o #ee ho" +he PlaceMa2.e2 (odei# in !OTH 0o$e#6 and "h3 i+/# 0ein1done li.e #o6

K9 #oll"ver Problems

Mo#e RollO7e2I%a1e P2o0le%#

Plea#e "a+ch +hi# %o7ie &o2 an

e$plana+ion o& "ha+ +o do
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/RollOver_Problems.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/RollOver_Problems.aspx


20/35

5lash (ove I&to: CavaScrpt ollovers

Note 8erso& 4 a&d a!ove replaces ths cod&)

wth a smple clck o, the !utto&.

"a##tional in$ormation $or %ac &S ' users at the bottom o$ this page!

Note, all new users shoul# still watch the %&(I) above!*

STEP 89)

STOP THAT POPUP WINDOW REMINDER&pen up the swap.=s$ile in Dreamweaver or +omeSite or NotePa#!

irst thing ou shoul# #o is comment out the lines that cause that popupwin#ow!
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/RollOver_Problems.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/RollOver_Problems.aspx


21/35


22/35

Notice how the commente# out lines change color, $rom blac- to gra!

The actual line that causes popup messages in .avaScript is the $ollowing line!

BE!"E:alert whatever you want here?9

#$E"/

'' alertwhatever you want here

?9


23/35

)ven though it0s a co#e line, TW& S1AS+)S ''in .avaScript will comment outthat line causing our browser to IGN&2) that line! It0s a little convenient tric-to tr #i$$erent pieces o$ co#e without having to cop an# paste things as allou have to #o is #elete or a## the two slashes 33!

STEP 8:)PRE-LOAD

I$ the rollover images o$ our website #o not change or show missing imageswhenou roll our mouse over them, it0s most li-el that the swap.js$ile has notbeenproperl up#ate# with our website0s path settings an# our #irector locationon

our har# #rive!

or e4ample, the $ile, swap!5s, locate# in the #irector/

C:\WebSites\NestedT_MERCURY_combo_js\

shoul# be change# as shown below


24/35

STEP 8:a)MA*E SURE YOU USE A TopNavSU!-FOLDER TO PUT YOUR

IMAGES IN6ecause o$ the wa the swap.=s$ol#er wor-s, ou S+&U1D put our images

insi#e the TopNav sub $ol#er

5ust li-e ou see in the #emos!The swap.=s$ile uses the .avaScript split$unction to count the number o$slashes a$ter the main U21 path variable! Thus i$ ou have one less $ol#er inour path, the count is incorrectan# it will as- the browser to loo- $or our images in a #irector too high or toolow!

T+US! our images shoul# be in a path that loo-s li-e

http://www.YUR!M"#NN"ME.com/ima$e/TopNav/

STEP 8;)UPDATE FILE PATHand URL PATH


25/35

STEP 8< - Op+ional)

(ASE-SENSITI=ITYSometime the web hosting service that ou are using has case7sensitive $ilenames! Thus, ever image an# also ever web page, template an# librar itemmust be )'A8T1Y correct!

or e4ample, the image $ile name

e_%ome.$i&

is N&T the same as /

e_home.$i&

I$ ou loo- closel between the two $ile name above, the onl #i$$erence is thatthe letter %&%is capitali9e# in one but not the other! This ma-e a big#i$$erence,especiall in web hosts that enable case7sensitivit $or their $ile names!


26/35


27/35

Also, #epen#ing upon where ou save# our $iles an# what our sstemcon$iguration is,

ou will have to put the the wor#, :lo$alhost: into our path $or internal Web

+ost!

or e4ample/


28/35

var Top7av3mages)@older)3nternalost !http:''1.".".1'lo$alhost'User7ame'MyAeb*ites'7estedT)36T0)=s'images'Top7av'!9

%acintosh &S' Personal Web Sharing Page

c! I, an# &N1Y I, ou #o N&T have Personal Web Sharing TU2N)D &N, oushoul# also comment out the ;n# an#


29/35

urthermore, i$ ou e4perience this problem, ou shoul# #o an Up#ate Sitean#re7uploa# all ou $iles bac- on to our web server!

!ER#$% &tep .$(T#$%)*Add a tag pointing to the swap.=sfile in your SUPER

template.

Finally, Modify --> Templates --> Update Pages...

N!E" Please see the #enu $ot Sauce %a&aScript Rollo&er demo templates 'hichalready ha&e this script tag.

!he tag is inside the tag 'hich is at the top of the template file.
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/UpdateSite.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/UpdateSite.aspx


30/35

7. .ayout vs tandard /iew

,ever0 ,ever0 use .ayout view in reamweaver1

#lways use tandard view to position yourtables0 contents and everything else for thatmatter1

0. Never never use laout view in Dreamweaver! Alwas use stan#ar# viewto position our tables, contents an# everthing else $or that matter! I$ou use 1aout (Iew, ou will soon grow to regret this as Dreamweaverautomaticall create# tons an# tons o$ co#e which ma-e it almost

impossible to manage!

;9 ear& how to posto& everth&) us&) ta!les. Dreamweaver has )reat tools ,or adBust&) ta!lesa&d how co&te&ts are posto&ed &sde o, them.

Some %T+ Tables Tutorialshttp://www.ourhtmlsource.com/ta!les/

http://www.w*schools.com/html/htmlta!les.asp
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/Layout_vs_Standard_View.aspxhttp://www.yourhtmlsource.com/tables/http://www.w3schools.com/html/html_tables.asphttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/Layout_vs_Standard_View.aspxhttp://www.yourhtmlsource.com/tables/http://www.w3schools.com/html/html_tables.asp


31/35


32/35

+,. ite Definitions

ite efinitions:

.ocal 2nfo0 "emote 2nfo0 irectory .evels

0. a/e sure you have your +ocal #oot (older pointed to the correct folder or else all ofyour lin/s could be off and you will not be able to see any images.

1. Sometimes your web hosting company or !SP reLuire you to place all of your files in a
http://www.decloak.com/products/dreamweaver/NestedTemplates/Support/SiteDefinitions.aspxhttp://www.decloak.com/products/dreamweaver/NestedTemplates/Support/SiteDefinitions.aspx


33/35

public access folder9 ,ou can setup the #emote !nfo1s %ost Directory to this folder9 Thisis a reLuirement for any type of website for all your lin/s to be correct9

49 ,our Directory +evels should always loo/ li/e this on your local level' regardless of yourweb hosting or !SP settings or remote folders9

(urthermore' if you are in the (TP window' the levels you see in the local view here should be!D*NT!2)+ to the remote view9 That is' what you see on the left hand remote side of your

(TP window should match the levels you see here on your local view9 )ND the Templatesfolder should )+.),S be a ;st level folder on both ends9


34/35

Nevertheless' you should be careful in putting any template files =9dwt or library items =9lbion the (TP server as they are in /nown folders and anyone can easily download yourtemplates for their own use9


35/35

dw tips.doc

Documents