$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
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
- font size, in pixels
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.
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.
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
background color
background opacity
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.
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.
nudge y
Nudge y moves the heading down. A negative number moves the heading up.
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.
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.
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]