Vine Type Content Management with Standards in Mind

01 Apr 2006

$vipr_headings

variable
  • $vipr_headings_templatename
type
  • display
description

This variable describes the Vine Type Inline PNG Replacement (ViPR) image values to be used when displaying headings for the templatename template. Each template on your Vine Type site may have its own ViPR variable in the vinetype.config file. For example, to define the style of headings for the products.html template, the variable would be called: vipr_headings_products.

The variable is followed by a series of comma-delimited values. Only one is required, the name of the true type font file. The others are optional. The values are position-specific, so if you want to "skip" a value, leave an empty spot in the list.

A typical example that defines a font file, the size, and the color, would look like this

example
$vipr_headings_default:curlz.ttf,regular,34,pink

Much more control over the display of the headings is achieved through the other parameters. Keep in mind if you wish to have a transparent background, you must specify a $vipr_format value of png.

list of values

Here's the exhaustive list (in order) of the values you may place on this line

  1. font file name

    The font file must be an open type or true type font and have a .ttf file extension. The font file that you supply must be placed in the fonts folder within the vinetype folder of your web server

  2. font size, in pixels
  3. font style. Choose one of the following:

    • regular
    • italic
    • bold
    • (leave blank)

    Some font files are italic by nature and require the italic setting. Some font files aren't any of the above and display only when this value is left blank.

  4. font color

    This value accepts a variety of inputs. You may use six-digit RGB hex values such as #f1f4f3, or the CSS shorthand three-digit values such as #900. Also acceptable are many named colors such as 'navy'. See below for list of valid values.

  5. font opacity

    This value is a number between 0 an 100. 0 is completely see-through. 50 is semi-transparent, and 100 is completely opaque. This value is ignored for JPEG images

  6. background color

  7. background opacity

  8. max width

    This numeric value specifies in pixels the maximum width allowed when laying out the heading. If more room is needed, Vine Type will wrap text to the next line.

  9. nudge x

    This value and the ones following are for fine adjustment of your font as it appears in the image. Different fonts may display too far up or get cut off on an edge. These values help you to (a) move the heading text and (b) cut off extra padding that might appear in the image

    Nudge x moves the heading to the right by the specified number of pixels. A negative number moves the heading to the left.

  10. nudge y

    Nudge y moves the heading down. A negative number moves the heading up.

  11. cut right edge

    This numeric value specifies the number of pixels to clip from the right edge of the image. The image can be pushed out by specifying a negative number.

  12. cut bottom edge

    This numeric value specifies the number of pixels to clip from the bottom edge of the image. The image can be pushed out by specifying a negative number.

  13. angle

    This is a numeric value, in degrees, that the heading is to be tilted. 90 degrees will display the heading top to bottom, but negative values are also valid. Most likely you will need to use nudge and clip values when rotating your heading text.

Color Names

Vine Type accepts the following 141 named colors, shown here with their associated hexadecimal RGB values.

  • AliceBlue [#F0F8FF]
  • AntiqueWhite [#FAEBD7]
  • Aqua [#00FFFF]
  • Aquamarine [#7FFFD4]
  • Azure [#F0FFFF]
  • Beige [#F5F5DC]
  • Bisque [#FFE4C4]
  • Black [#000000]
  • BlanchedAlmond [#FFEBCD]
  • Blue [#0000FF]
  • BlueViolet [#8A2BE2]
  • Brown [#A52A2A]
  • BurlyWood [#DEB887]
  • CadetBlue [#5F9EA0]
  • Chartreuse [#7FFF00]
  • Chocolate [#D2691E]
  • Coral [#FF7F50]
  • CornflowerBlue [#6495ED]
  • Cornsilk [#FFF8DC]
  • Crimson [#DC143C]
  • Cyan [#00FFFF]
  • DarkBlue [#00008B]
  • DarkCyan [#008B8B]
  • DarkGoldenrod [#B8860B]
  • DarkGray [#A9A9A9]
  • DarkGreen [#006400]
  • DarkKhaki [#BDB76B]
  • DarkMagenta [#8B008B]
  • DarkOliveGreen [#556B2F]
  • DarkOrange [#FF8C00]
  • DarkOrchid [#9932CC]
  • DarkRed [#8B0000]
  • DarkSalmon [#E9967A]
  • DarkSeaGreen [#8FBC8B]
  • DarkSlateBlue [#483D8B]
  • DarkSlateGray [#2F4F4F]
  • DarkTurquoise [#00CED1]
  • DarkViolet [#9400D3]
  • DeepPink [#FF1493]
  • DeepSkyBlue [#00BFFF]
  • DimGray [#696969]
  • DodgerBlue [#1E90FF]
  • Firebrick [#B22222]
  • FloralWhite [#FFFAF0]
  • ForestGreen [#228B22]
  • Fuchsia [#FF00FF]
  • Gainsboro [#DCDCDC]
  • GhostWhite [#F8F8FF]
  • Gold [#FFD700]
  • Goldenrod [#DAA520]
  • Gray [#808080]
  • Green [#008000]
  • GreenYellow [#ADFF2F]
  • Honeydew [#F0FFF0]
  • HotPink [#FF69B4]
  • IndianRed [#CD5C5C]
  • Indigo [#4B0082]
  • Ivory [#FFFFF0]
  • Khaki [#F0E68C]
  • Lavender [#E6E6FA]
  • LavenderBlush [#FFF0F5]
  • LawnGreen [#7CFC00]
  • LemonChiffon [#FFFACD]
  • LightBlue [#ADD8E6]
  • LightCoral [#F08080]
  • LightCyan [#E0FFFF]
  • LightGoldenrodYellow [#FAFAD2]
  • LightGray [#D3D3D3]
  • LightGreen [#90EE90]
  • LightPink [#FFB6C1]
  • LightSalmon [#FFA07A]
  • LightSeaGreen [#20B2AA]
  • LightSkyBlue [#87CEFA]
  • LightSlateGray [#778899]
  • LightSteelBlue [#B0C4DE]
  • LightYellow [#FFFFE0]
  • Lime [#00FF00]
  • LimeGreen [#32CD32]
  • Linen [#FAF0E6]
  • Magenta [#FF00FF]
  • Maroon [#800000]
  • MediumAquamarine [#66CDAA]
  • MediumBlue [#0000CD]
  • MediumOrchid [#BA55D3]
  • MediumPurple [#9370DB]
  • MediumSeaGreen [#3CB371]
  • MediumSlateBlue [#7B68EE]
  • MediumSpringGreen [#00FA9A]
  • MediumTurquoise [#48D1CC]
  • MediumVioletRed [#C71585]
  • MidnightBlue [#191970]
  • MintCream [#F5FFFA]
  • MistyRose [#FFE4E1]
  • Moccasin [#FFE4B5]
  • NavajoWhite [#FFDEAD]
  • Navy [#000080]
  • OldLace [#FDF5E6]
  • Olive [#808000]
  • OliveDrab [#6B8E23]
  • Orange [#FFA500]
  • OrangeRed [#FF4500]
  • Orchid [#DA70D6]
  • PaleGoldenrod [#EEE8AA]
  • PaleGreen [#98FB98]
  • PaleTurquoise [#AFEEEE]
  • PaleVioletRed [#DB7093]
  • PapayaWhip [#FFEFD5]
  • PeachPuff [#FFDAB9]
  • Peru [#CD853F]
  • Pink [#FFC0CB]
  • Plum [#DDA0DD]
  • PowderBlue [#B0E0E6]
  • Purple [#800080]
  • Red [#FF0000]
  • RosyBrown [#BC8F8F]
  • RoyalBlue [#4169E1]
  • SaddleBrown [#8B4513]
  • Salmon [#FA8072]
  • SandyBrown [#F4A460]
  • SeaGreen [#2E8B57]
  • SeaShell [#FFF5EE]
  • Sienna [#A0522D]
  • Silver [#C0C0C0]
  • SkyBlue [#87CEEB]
  • SlateBlue [#6A5ACD]
  • SlateGray [#708090]
  • Snow [#FFFAFA]
  • SpringGreen [#00FF7F]
  • SteelBlue [#4682B4]
  • Tan [#D2B48C]
  • Teal [#008080]
  • Thistle [#D8BFD8]
  • Tomato [#FF6347]
  • Transparent [#FFFFFF]
  • Turquoise [#40E0D0]
  • Violet [#EE82EE]
  • Wheat [#F5DEB3]
  • White [#FFFFFF]
  • WhiteSmoke [#F5F5F5]
  • Yellow [#FFFF00]
  • YellowGreen [#9ACD32]

download

Visit the Download Area to test drive the standard in standards compliance.

upgrade

Add professional features to your Vine Type site by purchasing a Vine Type Pro license.

feedback

Discuss Vine Type or pose questions at the official Vine Type Forum hosted by ASP Advice.

about us

Learn more about this site and the features it is demonstrating.

© 2001-2017 vine branches — website powered by vine type