INDEX My AccountAccessing My Account How Do I Change or Add My Information? How Do I Change My Profile Picture? How Do I Change My Password? My FriendsAccessing Find Friend How Do I Change My Friend Privacy Settings? How Do I Find a Friend & Accept a Friend? My PagesHow Do I Create a Page? Page Types Creating ApplicationsCreating & Positioning ApplicationsWhat are Applications? Applications Overview How Do I Set Up an Application? ConfigurationAccessing Configuration How Do I Set Up Permissions? How Do I Share My Application? Look & FeelAccessing Look and Feel How Do I Change the Name of My Application? How Do I Change the Look of My Application?
|
Accessing Look and Feel How to Get ThereOn the right top of an app (one that belongs to you or you have permission to edit), there is a tiny wrench symbol. Click on that and then select Look and Feel (see image below). What Can I Do Here?Using Look and Feel, you can change the look of your text, your background, change margins and padding and put in your own CSS code.
How Do I Change the Name of My Application? Method OneThe easiest way to change the name of your app, after it has been placed, is to simply click on the name of it (it should be the default description of what type of app it is, so Message Board would be named Message Board, etc) and type in what you would like to call it (see image below). Method TwoThe other way is to access Look and Feel (see above instructions). You will automatically land on the Portlet Configuration screen, where you can type the app's new name into the Portlet Title text-box, check Use Custom Title and click Save (see image below).
How Do I Change the Look of My Application? TextBy clicking on the tab Text Styles, a new look can be given to the text of your application. You can select a different typeface, a new color for you text and play with various spacing choices (see image below). To change color, you need to either type in a hexadecimal color code or click the eyedropper symbol and, on the pop-up window, click on a color. As you choose your choices, you should be able to see the changes previewed on the application beneath (see image below). To save your changes, click Save. To reset the text to default, click Reset. TIPThis ExampleThe application used in this tutorial is a message board. The look of your application may, naturally, look different as you edit its appearance.
TIPFont ChoiceDid you know that the easiest font style to read online are non-serif fonts like Calibri, Arial or Verdana?
Background ColorBy clicking on the tab Background Styles, you can change the background color of your application. You can do this by either typing in a hexadecimal color or clicking on the eyedropper symbol and, on the pop-up window, clicking on a color. To save your color change, click Save. To reset the background color to the default, click Reset. TIPColorYou can help your readers by making sure there is enough contrast between your background color and your text color. So dark color backgrounds look best with light colored text and vice versa.
TIPHexidecimal Colors?Hexidecimal color codes are six letters or numbers that tell browser what color to show on the screen. Hexidecimal colors will look like this #822300 or like this #FCFBE3. If you decide to type your own color in, make sure you have a pound sign (#) before the code. Some Websites with Hexidecimal color codes:
Margin & PaddingBy clicking on the tab Margin and Padding, you can change the space between your app and other items on your page or your app and the page's edge and the space between the content of your app and the app's border. Margin will control the space outside your application's edge and Padding will control the space inside your application's edge (see image below). The default is to set all sides of margin or padding equally but you can fine tune it by unblocking Same for All. You can also change the measurement from pixels to ems or percentages. To save your changes, click Save. To reset the margins and padding to the default, click Reset. Advanced StylingClicking on the tab Advanced Styling will allow you to enter you to enter your own CSS Coding (see image below). Unless you have some knowledge of CSS, you should probably leave this option alone. WAP StylingUndergoing Research. |
