Working with the Plone Base Properties File

     

In this section, you'll learn more about the individual entries found in the base_properties file. All of the entries in the default base_properties file hold string values, so whatever you type in the value field should be a string, not an integer or some other data type. This section describes each of these default entries and shows you how to create an entry of your own.

• title ” This field simply describes the properties file. If you are creating a custom file, you could give it a title, such as My Custom Blue Theme, to differentiate it from the standard properties file. The value of this field is not shown in your Plone site, but a value is required for this field.

• plone_skin ” This field is used to attach the properties file to skin. If you change the value from Plone Default to something like Custom Skin, when you select Custom Skin from the portal_skins properties tab in the ZMI, this properties file will be used.

• logoName ” The value of this field should be the value of the object that will hold your logo. You learned in Chapter 5 that the object called logo.jpg does not have to hold an image called logo.jpg ; the image can be named mylogo.gif , for all it cares. The entry in the properties file simply tells Plone which object to look for. If you want your logoName to be mylogo.gif , you must also create an object called mylogo.gif that holds the image file of your choice.

• fontFamily ” This value determines the list of fonts to be used for the body text in your site. The default value is Lucida Grande, Verdana, Lucida, Helvetica, Arial, sans-serif , which means that the designers really want the font to be Lucida Grande, but if that font is not present, the content should be displayed in Verdana. If Verdana is not present, use Lucida, and so on down the line. If none of the named fonts is listed, the site will be rendered using the default sans-serif font in the end user 's browser. If you wanted to run a serif-based site, your fontFamily entry could look like Times New Roman, Times, Book Antiqua, serif , for example.

• fontBaseSize ” This percentage value represents the base font size , from which all increases or decreases in font size will occur. The default fontBaseSize is 70 percent of the end user's default display font size; if the end user changes the Plone-viewing preferences to use the "bigger" font, the selection really means "add to the fontBaseSize ." Similarly, selecting the "smaller" font results in a subtraction from the fontBaseSize .

• fontColor ” This value is the font color used for all displayed text, whether body or header text. The value can be either a color name , such as Black , which is the default, or a hexadecimal representation of the RGB color.

• fontSmallSize ” This percentage value represents the size of the small elements; its default value is 85 percent. This might seem strange at first glance because the default value of fontBaseSize is 70 percent. However, fontSmallSize is 85 percent of the fontBaseSize , not 85 percent of the end user's default display font size.

• backgroundColor ” This value is the background color used throughout your Plone site, unless it is overwritten by the background color of another element, such as a tab. The value can be either a color name, such as White , which is the default, or a hexadecimal representation of the RGB color.

• linkColor ” This value is used to color all hyperlinks that have not yet been visited or are not in the process of being clicked. The default value is #436976 , which is sort of a dark blue-green color. You can use either color names or hexadecimal RGB notation.

• linkActiveColor ” A hyperlink is this color when it is in the process of being clicked. The default value is Red ; you can use either color names or hexadecimal RGB notation.

• linkVisitedColor ” A hyperlink is this color after it has been visited. The default value is Purple ; you can use either color names or hexadecimal RGB notation.

• borderWidth ” If something has a border within your Plone site, this is its default width (1px). Examples of items with borders include tabs, slots, the horizontal rule, boxes around content, and drop-down menus . You can use a measurement in pixels (as in 1px and 2px), or you can use the generic thin , medium , or thick notations.

• borderStyle ” Borders not only have widths; they have styles as well. The default style is Solid; if you keep the default borderWidth and default borderStyle values, all of your bordered elements will have 1-pixel-wide solid lines as their borders. Changing these two styles, in particular, can have dramatic effects on the appearance of your Plone site because nearly every element has a border of some kind. In Figure 6.3, you can see how changing the borderWidth to Thick and borderStyle to Dotted will make your Plone site look terrible ”but now you should have a better picture of just how many elements have borders!

  Figure 6.3. Terrible use of borderWidth and borderStyle modifications.

  
  

  Note

  The standard border styles are None, Hidden, Dotted, Dashed, Solid, Double, Groove, Ridge, Inset, and Outset.

  
  

• borderStyleAnnotations ” When you add comments to a page in a Plone site, they are set apart in their own comments box. This box has a border, which uses the borderStyleAnnotations style. The default value is Dashed, but you can use any of the standard border styles. The borderWidth value is used to determine the width of the border here as well.

• globalBorderColor ” This color is used as the actual border color for all bordered items. The default value is #8cacbb , which is a pleasant sort of light slate blue color. This element goes hand in hand with borderWidth , borderStyle , and borderStyleAnnotation ; borders need widths, styles, and colors to be visible. This value can be a color name or hexadecimal RGB notation.

• globalBackgroundColor ” If you put four borders together, you have a rectangular or square item ”a tab, for example. The globalBackgroundColor sets the color for this area. The default value is #dee7ec , which is a very light blue color; the value can be a color name or hexadecimal RGB notation. Not all boxed-in items use the globalBackgroundColor . You will learn which default items do in the upcoming section on style sheets, "Working with the Plone Style Sheet."

• globalFontColor ” This value, which happens to be the same value as linkColor ( #436976 ) in the default Plone properties, is used to color the text that sits on anything colored by globalBackgroundColor . Using a tab as an example, it is filled in by globalBackgroundColor , and its text is colored by globalFontColor . Obviously, you want these two colors to be different and to contrast. You can use either color names or hexadecimal RGB notation.

• headingFontFamily ” This value determines the list of fonts to be used for all headings in your site (H1 through H6). This list of fonts likely will be similar to, if not exactly the same as, the list used for fontFamily . Similar fonts for body and heading text help maintain a consistent look and feel throughout your site.

• headingFontBaseSize ” Much like the fontBaseSize property, headingFontBaseSize represents the percentage value of the font size used in all headings (levels H1 through H6). The default value is 100 percent; any change you make should also be in percentage format.

• contentViewBorderColor ” This color is used as the border color of items in the content view ”that is, anything under the Contents, View, Edit, Properties, and Sharing tabs. The default color is #74ae0b , which is a dark green. This value can be a color name or hexadecimal RGB notation.

• contentViewBackgroundColor ” This color is used as the background color for the bordered items in the content view. The default color is #cde2a7 , which is a light green. This value can be a color name or hexadecimal RGB notation.

• contentViewFontColor ” This value is used to color the text that sits on anything colored by the contentViewBackgroundColor property. The default color is #578308 , a dark green. This color should contrast with contentViewBackgroundColor and can be a color name or hexadecimal RGB notation.

  Note

  Figure 6.4 provides sample elements controlled by globalBorderColor , globalBackgroundColor , and globalFontColor , compared to those controlled by contentViewBorderColor , contentViewBackgroundColor , and contentViewFontColor .

  Figure 6.4. Display items controlled by the global* versus contentView* properties.

  
  
  
  

• inputFontColor ” This value is the font color used in form fields; any text that the user types will be in this color. The value can be either a color name, such as Black , which is the default, or a hexadecimal representation of the RGB color.

• textTransform ” This property is used to transform text into a specific case ”for example, lower case (the default), upper case, or capitalized. Regardless of the case used by the user when providing titles of objects such as portlets, the textTransform property renders the text in the selected case.

• evenRowBackgroundColor ” This color is displayed as the background of even-numbered rows in generated listings. The default value is #f7f9fa , which is a very light gray. This value can be a color name or hexadecimal RGB notation.

• oddRowBackgroundColor ” This color is displayed as the background of odd-numbered rows in generated listings. The default value is transparent , so it takes on the background color of the elements it is displayed within. This value can be a color name or hexadecimal RGB notation, and it should contrast with evenRowBackgroundColor if you want users to be able to tell the difference in rows.

• notifyBorderColor ” When performing actions within Plone such as logging in, adding or modifying content, setting preferences, and so forth, a notification box containing a status message usually appears upon completion of your action. This property defines the border color of this message area. The default value is #ffa500 , a dark orange, but it can be a color name or hexadecimal RGB notation. The current day is also highlighted in this color, in the default Plone calendar.

• notifyBackgroundColor ” This property defines the background color of the box containing messages, outlined by notifyBorderColor . The default value is #ffce7b , a light orange, but it can be a color name or hexadecimal RGB notation.

• discreetColor ” This color is used to display helper text, such as that used near form fields. The default color is #76797c , a dark gray, but it can be a color name or hexadecimal RGB notation.

• helpBackgroundColor ” In the standard Plone calendar, when a day has an event attached to it, a pop-up is visible when the user places the mouse over this link. The helpBackgroundColor property is used to color this box. The default value is #ffffe1 , an off-white, but it can be a color name or hexadecimal RGB notation.

• portalMinWidth ” This property is used to define the minimum width of the Plone display. The portalMinWidth property, as well as the columnOneWidth and columnTwoWidth properties that follow, are measured in ems . The default portalMinWidth is 70em.

  Note

  An em is a unit of measurement, the size of which is relative to the size of the font used in the page rather than an actual measurement taken by a ruler. For example, if you use a 10-point base font, the width of an em would be the approximate width of the letter m at that font size. If your base font size is 14-point, the value would be relatively larger. So, when the portalMinWidth value is 70em, that means approximately 70 letter m 's can fit on one line, which could represent anywhere from 70 to 80 or more actual characters (an i is skinnier than an m ).

  
  

• columnOneWidth ” This property is used to define the width of the left column. The default is 16em, but you can make this column width anything you want (still measured in ems). For example, if you want the left column to be noticeably wider than the right column, make this value something like 32em while keeping the value of columnTwoWidth at 16em.

• columnTwoWidth ” See columnOneWidth , earlier, except that this property controls the right column, not the left.

The items previously described are all of the default Plone properties. You can add your own, using the fields at the bottom of the editable form. These are the fields:

• Name ” The name of your new property, such as fancyFontColor .

• Value ” The value of the new property, such as Pink .

• Type ” The type of the new property, selected from a drop-down of available types. String would likely be the type used for a new property.

When these fields are complete, press the Add button to add the property to those available in your Plone site. After they have been added, you can reference this property within your Plone style sheet. You will learn about this in the next section.