Do-It-Yourself. Show off your design skills and develop a theme from scratch. The theme design kit includes everything you need to get started.
1.
Download
The first step to making your own theme is to download the theme development kit (tdk) from here.
2.
Edit Info.plist
The Info.plist file describes the files used by the theme, the name of the CSS file, and any credit that you, the designer, would like including your name and link to your site. The keys in the plist and their meaning are described below.
  • api
    • The highest API key that the theme is compatible with. If blank, the theme is assumed to only conform to v1.0. Higher APIs are backwards compatible unless otherwise noted.
  • highlight
    • The HTML hex color to used to highlight when a new file is inserted. The hex color should be of the form #FFFFFF. Default: #DDDDFF which is a light blue shade.
  • preview
    • The name of the file to use as the preview image. This should be a cropped screenshot of your theme in action. Default: preview.png
  • stylesheet
    • The name of the stylesheet for the theme. This should be edited to suite your theme's needs. Default: default.css
  • homepage
    • The URL to your site (if applicable). You MUST include http:// in the beginning of the URL. Default: (None)
  • version
    • The version of the theme. This helps users keep track of updates made to the theme. Default: 1.0
  • author
    • Your name. So you get credit for your work, your name is displayed in Rapidweaver. Default: ThemeAuthor
  • name
    • The name of the theme. This is the name of the theme that will be displayed. Default: ThemeName
  • Bundle identifier
    • This is the bundle identifier for the theme. It is recommended that you use the same name as the theme but all lowercase with no spaces or special characters (i.e., !@#%&*). Default: themename
  • assets
    • This is a dictionary that describes all of the assets that the theme requires. These assets will be published used for previewing, exporting, and publishing the Rapidweaver projects. The name of this dictionary MUST NOT change.
    • Item 1
      • The default value for this key MUST NOT change. The file that this key refers to (bar.png) refers to the outline drawing of the progress bar. You should either use the included bar.png or draw an appropriately sized PNG file to accompany your progress upload PNG (progress.png). Again, you MUST NOT change this key.
    • Item 2
      • This item (failed.png) is the name of the icon used when a failed upload occures. If you would like to include your own icon for this you must list it here to be included in the Rapidweaver site and you must update the stylesheet to reference this icon rather than the default failed.png file.
    • Item 3
      • This item (file.png) is the name of the icon used when a file is added to the upload queue. If you would like to include your own icon for this you must list it here to be included in the Rapidweaver site and you must update the stylesheet to reference this icon rather than the default file.png file.
    • Item 4
      • The default value for this key MUST NOT change. The file that this key refers to (progress.png) refers to the drawing of the progress bar. You should either use the included progress.png or change the color in this file. Again, you MUST NOT change this key.
    • Item 5
      • This item (success.png) is the name of the icon used when a failed upload succeds. If you would like to include your own icon for this you must list it here to be included in the Rapidweaver site and you must update the stylesheet to reference this icon rather than the default success.png file.
    • Item 6
      • This item (uploading.png) is the name of the icon used when a file is being uploaded. If you would like to include your own icon for this you must list it here to be included in the Rapidweaver site and you must update the stylesheet to reference this icon rather than the default uploading.png file.
3.
Edit Graphics and CSS
This is where you show off your creativity skills! Change anything in the included CSS file or alter any of the included PNG files to make the theme your own.
4.
Test
Please be sure to test out your theme before releasing it. To test your theme place the entire theme (i.e., theme_name.wbtheme) in ~/Library/Application Support/Rapidweaver/weaverBox/Themes/ and restart Rapidweaver. Your theme should appear in weaverBox's theme tab. You updated the preview.png file to show a preview of your new theme right? If everything is working, now would be a good time to take a nice cropped screenshot of your theme in action.
5.
Share
Share your theme with the world! If you would like your weaverBox themes listed on the main theme page please contact me.