| | Office Live Getting Graphical Part II
"I'm Creating!" Click the balancing arTotems to the left for more tips and tricks.
For more information about Graphics in Office Live visit Getting Graphical Part I. |
| |
Example 1- The Contact Module |
The basic idea is to add a table, give it a background image and place a Contact form inside it.
|
Yes, you can use this image. |
You are welcome to use the image underlying this contact module. All I ask is that you let me know that you did by sending me a message via this contact form. Just right click the stamp and and choose copy background. Then paste it into an image editing program. You are also welcome to change it. Next upload it to your Images area in the Member Center and follow the instructions below. PS. If the example above is not lined up correctly I can safely say it isn't my design it's the dreaded Office Live alignment problems. |
Method |
1. Create an image or select a photo and upload the image to your "Images" area in the Member Center.
2. Place the cursor on the page where you want the Contact module to be placed and select "Table" in the menu.
3. Select "Generic" style with 1 column and 1 row and click th "OK" button.
4. Right Click the table boundary box and select Properties. The properties dialog box will appear. |
| |
5. In the Dialog box check the "Use background image" checkbox.
6. Click the "Select" button and choose an image.
7. Set the border color to #ffffff (white) or whatever your page background color is.
8. Set the background color to white or whatever your background color is.
9. Click the "Apply" button.
10. Now click inside your table to place the cursor there.
11. Click "Module" and then "Contact us".
12. Adjust the size and placement of your Contact form to fit neatly in your table.
13. Click Save!
14. Enjoy! |
Example 2- Thumbnail Images |
Creating a thumbnail image is easy. It allows you display a small icon of the image and users can click on it to display the full image. Try the one below and then return.
Profile in Nature (click the thumbnail image)
Method 1. Create an image or select a photo and upload the image to your "Images" area in the Member Center.
2. Place the cursor on the page where you want the thumbnail to be placed and select "Moudules" and then "HTML" in the menu. 3. Copy the following code to the HTML dialog box.
<A HREF="/Images/yourimage.jpg"><IMG HEIGHT=100 WIDTH=100 border=0 SRC="Images/yourimage.jpg"></A>
4. Replace yourimage.jpg with your own image name and file type in both areas of the text. 5. If you want a border around the image set border=1 6. Click "OK" 7. Adjust the boundary boxes for size and then "Save". 8. Enjoy!
|