Make templates for Wired Client

About Templates

Webkit-Based

Wired Client uses the WebKit framework provided by Apple to render several views of the interface like Chats, Boards and Messages. This allows a very hight level of user interface customization, and in order to make it easy to enhance, Wired Client provides a templates system.

Templates are Bundles

Wired Client templates are based on the Apple bundles Architecture. Each template is a bundle file with a .WiredTemplate file extention which mainly contains HTML, CSS and graphical resources.

Where are Templates

Wired Client stores templates at two different locations. The first one is related to private templates that Wired Client embedded out-of-the-box. You can found them into the "Wired Client.app" bundle at the following path:

Wired Client.app/Contents/Resources/Templates/

Natively, Wired Client currently provides three templates:

Wired Client also offers support for public templates, that are installed at the following location:

~/Library/Application Support/Wired Client/Templates/

You have to manage (install/uninstall) public templates from the "Preferences" window of Wired Client to make them running properly. Select "Themes" into the toolbar, then select a theme of your choice into the sidebar on the left. In the right view, click on the "Templates" popup menu then chose "Manage Templates…".

Dev Wired Client Manage Templates

Getting Started

The best way to make a new Wired Template is probably to duplicate an already existing one and to modify it afterwards. The following will explains the several points to observe in order to make a new Wired Client template based on a duplicate.

Architecture of a Template

Here I take the example of a "Basic" template. Assume that every of these files are required:

Basic.WiredTemplate/
                Contents/
                    Info.plist
                    Resources/
                        en.lproj/
                            InfoPlist.strings
                        htdocs/
                            BoardPost.html
                            BoardReply.html
                            Boards.html
                            Chat.html
                            ChatEvent.html
                            ChatMessage.html
                            css/
                                boards.css
                                chat.css
                                default_boards.css
                                default_chat.css
                                default_messages.css
                                messages.css
                            img/
                            Message.html
                            Messages.html
                            MessageStatus.html

How it works ?

Templates defines the style of the view. Each theme uses a template to render the view using theme's custom parameters (fonts, colors, etc.) into a Cocoa WebView object.

HTML Resources

HTML files are the most sensitive because they define the structure of the view. And

Chat HTML Files

Messages HTML Files

Boards HTML Files

CSS Resources

Other Resources

You can

Templates Limitations

Unfortunately, Javascript is not currently allowed in templates for security concerns. Fortunately, WebKit brilliantly supports HTML5 and CSS3 specifications which already offer a very large set of advanced tools.

Nothing is done regarding teamplates backward/forward compatibility accross future versions of Wired Client. Be reassured, it is planned to found a way to manage this properly, and the current "API" is not supposed to change dramatically in the near future.