You are on page 1of 27

New tips and tricks added to bottom of list

Note to users of this template:

Link to:

This template uses a new color palette. If you are starting a new design from this template there is a page in this temp which shows in detail how the colors are organized and what to choose for what areas in your design.

Warning: If you import this color palette into any designs that were built using the last template it will change I suggest that you start using this template when you start a new design.

This new template offers new boxes and buttons that are closer in look and feel to actual HTML. Tabs that also are close used and new artwork in the images pages. These improvements were brought to you by Maggie Law who has taken this template to a new level. Thanks Maggie

Row height = 13 Column width = 1 Clear background grid lines = tools > Option > View > Gridlines

Right click on Table Cell > Format Cell Alignment > Vertical > Bottom puts text at bottom of row > Middle = puts text in middle of row, good position for headers merges cells so that text is locked together, if text is link all text will be clickable, can > Merge Cells = To delete cells that are merged you will need to uncheck the merged option Border > Used to make borders around cells. Can choose multiple colors and widths Patterns > Colors cells (see below for new color palette tips) Number > Can determine what attributes a cell will have. To make a numbered cell a text cell choose text

Trick: if a group of numbers or a date only show up as a # symbol put a ( ' ) single quote at the beginning of the st characters and they will appear as text and the ' will be invisible. Sometimes when you paste the " ' " will appear, just retype it and it will disappear Save as HTML: A whole worksheet can be saved as an HTML file. It will save all the necessary files needed to build a site using all of the tabbed pages.

The links that have been set up will work but unfortunately the drop down boxes won't.

You don't have to save the page as HTML you can also just open up a file from Explorer and get the Graphics as links: Highlight a graphic and right click on it> Go to Hyperlink> assign a link This will also carry through when a page is converted to HTML

To get a dropdown menu: - Bring up the widgets toolbar via View > Toolbars > Forms. - Click the icon that has the tooltip "Combo Box". - Drag across the cells where you want the dropdown menu. If it doesn't land exactly where you want it, move it - Type the menu values in a column of cells somewhere on your page, and leave a blank cell above the list. - Right-click on the widget, and bring up Format Control. - Go to the Control tab. Click the button next to Input Range. Drag-select your rows with the menu values. Clos - Click the button next to Cell Link. Select the cell above the menu values. Close the little window. - Enter the number of menu values, and check the Shading checkbox. OK. - Use the dropdown to pick the value that you want to have initially displayed. - After you get it working, if you want to select it (e.g., for moving or resizing), click with the right mouse button a (Terry Roberts)

Radio buttons If you put multiple radiobuttons on a page, they all want to act as one big radiobutton group, i.e., turning any o According to the documentation, if you put radiobuttons into a group-box (item #2 in the forms menu), they sh long as you're very careful to get all of the radiobutton widget's area inside the groupbox. The catch is that I d both because excel's box isn't PIA, and because I'm using layout to define my groups and I don't want extra lin groupbox invisible -- it doesn't seem to have controls for what its outlines look like, other than that 3-D control multiple radiobutton groups on a page to operate properly is still a mystery to me. If you or anyone has a solu (Terry Roberts)

Changing Row Height You can select non-continuous rows by holding down the Control key. Then you can then change their row he

Tabs with curved edges These new tabs look more realistic but are a little harder to work with. Each tab has a small piece of art on e curve. To move them it is best to capture the tab row it is best to highlight the tab row and the row above it. curser a row above where you want to put it and click paste. Remember to only highlight one cell when past

To delete tabs (as with the straight tabs) you will need to uncheck "merged" cell in "alignment" option befo

To change the width of one of the tabs move the whole row of tabs to the right of your page design far eno Then by clicking at the top where the column labels are you can insert or delete columns. In this way you ca decrease the width of the tab, without having to unmerge the the text and you won't effect the design. Whe size copy and paste it where you want.

New color palette The color palette has been updated and has an explaination on its own page called color key The color key page was put together by Maggie Law

How to add a color palette from another worksheet

If there is a new color palette that you want use in an existing worksheet this is how you do it: Go to Tools > Options> Colors. You will need to have the the template open that you want to get the pa down menu as seen below ind the template that you want to copy the palette from, highlight the name ,s

Be careful, if any of the colors are replacing have been used in the template that you are copying to it w will appear as the new color. That can be a good if you want to change a color globally but bad if you do irreversable though. Merely reinstall the old color palette from an older palette or file and it will be back to

Link to:

Color Key

page

here is a page in this template entitled "Color Key"

t template it will change your colors globally .

L. Tabs that also are closer to the actual tabs

w level. Thanks Maggie

ll text will be clickable, can also center text

e at the beginning of the string of

from Explorer and get the same effect.

where you want it, move it like a graphic. (ALT may help.) ank cell above the list.

with the menu values. Close the little window. little window.

h the right mouse button and ignore the popup menu.

n group, i.e., turning any one on turns all the rest off. the forms menu), they should form a set. That does work as pbox. The catch is that I don't want the groupbox to show -ps and I don't want extra lines. I can't find a way to make the other than that 3-D control in the Format d-box. So getting you or anyone has a solution, I'd be interested in hearing it.

n then change their row height in one move.

as a small piece of art on either side to make the row and the row above it. Then lay your ighlight one cell when pasteing. in "alignment" option before deleting

of your page design far enough so that nothing is below it. olumns. In this way you can increase or n't effect the design. When you have the tabs to the correct

alled color key

Color Key

how you do it: that you want to get the palette from. Then using the pull om, highlight the name ,save and it is done.

that you are copying to it will overwrite those colors and they r globally but bad if you don't have that intention. This is not or file and it will be back to normal.

Color Key:
This prototyping template employs a color palatte that supports the colors of PeopleSoft applications:

1) 2) 3) 1 9 2 10 3 11 4 12 5 13 6 14 7 15 8 16 4) 5) 6) 7) 8)

R 40 R 255 R 128 R 247 R 49 R 107 R 74 R 206

10

13

12

15

14

G 66 G 255 G 127 G 247 G 48 G 105 G 113 G 207

B 119 B 255 B 127 B 247 B 206 B 107 B 173 B 206

9) 10) 11) 12) 13) 14) 15) 16)

R 74 R 120 R 239 R 90 R 211 R 252 R 214 R 181

G 89 G 156 G 239 G 134 G 220 G 252 G 223 G 195

B 140 B 202 B 247 B 181 B 232 B 181 B 239 B 214

11

03495 49921 38444

16

Note: there are more images below the fold

Grouped Buttons

Individual Buttons

text Text Text Text

Text

Save Save

OK OK

Cancel Cancel

Return Returnt

Submit Submit

Apply Apply

Run Run

Line one Line two Line three Line four

Example tab1

Example tab 2

Example tab 1

Example tab2

Example tab3

Example tab4

Example tab4

Header
Example tab 1

Example tab2

Example tab3

Example tab4

Example tab4

Example tab 1

Example tab

Example tab

Example tab

Example tab

Example tab

Example tab 1

Example tab

Example tab

Example tab

Example tab

Example tab

Example tab 1

Example tab

Example tab

Example tab

Example tab

Example tab

Example tab 1

Example tab

Example tab

Example tab

Example tab

Example tab

Example tab 1

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Short

Example tab4

Example tab4

Example tab

Example tab 1

Example tab

Example tab2

Example tab

Example tab

Example tab 1

More tabs below the fold

Short

Short

Example tab1

Example tab 2

Example tab 2

Example tab1

Example tab2

Example tab3

Example tab4

Header
Example tab 2

Example tab1

Example tab2

Example tab3

Example tab4

Example tab 2

Example tab1

Example tab2

Example tab3

Example tab4

Example tab1

Example tab 2

Example tab2

Example tab3

Example tab4

Example tab1

Example tab1

Example tab 2

Example tab3

Example tab4

Example tab1

Example tab1

Example tab2

Example tab 2

Example tab4

Example tab1

Example tab1

Example tab2

Example tab3

Example tab 2

This is Another Header

Text

Text

Text

Text

Headline
Header Text: Header Text: Header Text: Header Smaller header text Smaller header text Smaller header text Bold Header Text: Bold Header Text: Bold Header Text:

Header

Headline
Bold Header Text:Smaller header text Bold Header Text:Smaller header text Bold Header Text:Smaller header text Header Bold Header Text: Bold Header Text: Bold Header Text:

Header

You might also like