The easiest way to create a new theme is to copy the default theme directory to create the basis for your new theme and edit it till you get what you require.<\/p>\n
If using Chrome or FireFox then you switch to your theme by using the following JavaScript code in your browser’s JavaScript console<\/p>\n
setTheme('');<\/code><\/pre>\nTo switch back to the default theme enter<\/p>\n
setTheme('default');<\/code><\/pre>\nTo switch to your new theme permanently alter lump.js in CLUMP’s html directory and change default in the following line to the name of your new theme’s directory.<\/p>\n
var theme=\"default\";<\/code><\/pre>\nYou will also want to change the theme entry in bibGrab in CLUMP’s cgi-bin directory to your new theme by changing ‘default’ in the following line to the directory name of your new theme.<\/p>\n
my $THEME=\"default\";<\/code><\/pre>\nAltering wording<\/h3>\n
All the wording used by CLUMP is contained in the wordMappings.xml file in the theme’s directory. \u00a0The file contains a series of mappings, each mapping has a name and value. \u00a0The value contains the text that is displayed on the screen.<\/p>\n
Altering the order that metadata is displayed for leaf nodes<\/h3>\n
The file metadataDisplayOrder.xml contains the order that metadata is displayed for different leaf nodes. \u00a0The file consists of a series of displayOrder entries which in turn contain the structuralUnitType and order to display the metadata. \u00a0If a metadata entry is not present in the order then it will not be displayed.<\/p>\n
Altering how leaf nodes and citations are rendered<\/h3>\n
The file render.js contains the\u00a0JavaScript\u00a0that renders both leaf nodes and citations. \u00a0The renderLeafNode and renderCitation functions figure out what functions to call to render the structural unit provided.<\/p>\n
Altering colours, borders, etc.<\/h3>\n
The file screen.css contains the style sheet used by CLUMP. \u00a0Google Chrome or Firefox + FireBug will make you life a lot easier for playing with the style sheets.<\/p>\n
Altering Images<\/h3>\n
Each image used by CLUMP is contained in the relevant theme directory. To change the image simple replace the image file in your theme directory with the one you want to use. It is best to make sure that your image file is in the same format (Usually PNG).<\/p>\n
Altering Allowed Inline HTML<\/h3>\n
The HTML that users can insert in their item’s metadata is controlled by the “validHTML.xml”\u00a0white-list\u00a0file in the theme. \u00a0The format is<\/p>\n
\n<validHTML>\n<tag>\n<name>a<\/name>\n<attr>\n<value>href<\/value>\n<validation>^(http|https):\/\/<\/validation>\n<\/attr>\n<attr>\n<value>alt<\/value>\n<validation>[ws]*<\/validation>\n<\/attr>\n<attr>\n<value>title<\/value>\n<validation>[ws]*<\/validation>\n<\/attr>\n<\/tag>\n.\n.\n.\n<\/validHTML><\/code><\/pre>\nEvery tag element requires a name element. \u00a0It can also have any number of attr elements for specifying valid attributes.<\/p>\n
Each attr element requires a value element that contains the name of the valid attribute. \u00a0It can also have a validation element which contains a\u00a0JavaScript\u00a0regular expression that can be used to validate the content of the attribute. \u00a0If there is no validation pattern then the attribute will be added without any content (e.g. noshade on a hr tag).<\/p>\n
It is important to remember that the allowed HTML is always a white-list. \u00a0If the validHTML.xml file doesn’t contain the tag it won’t be shown. \u00a0If it contains the tag but no attributes then only the tag will be shown. \u00a0If it contains the tag with it’s attributes but no validation for those attributes then the attributes will be included without any value. \u00a0This should make it a lot harder for rouge HTML entries in metadata to affect the way an entery is displayed. \u00a0It also makes XSS attacks a lot harder to implement.<\/p>\n","protected":false},"excerpt":{"rendered":"
Creating a new theme The easiest way to create a new theme is to copy the default theme directory to create the basis for your new theme and edit it till you get what you require. If using Chrome or FireFox then you switch to your theme by using the following JavaScript code in your […]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":116,"menu_order":20,"comment_status":"closed","ping_status":"closed","template":"page-col-1.php","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"class_list":["post-118","page","type-page","status-publish","hentry","count-0","even alt","author-lbjlclboro-ac-uk","last"],"_links":{"self":[{"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/pages\/118","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/comments?post=118"}],"version-history":[{"count":0,"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/pages\/118\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/pages\/116"}],"wp:attachment":[{"href":"https:\/\/blog.lboro.ac.uk\/lorls\/wp-json\/wp\/v2\/media?parent=118"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}