Salient Features:

  • Clean layout with improved usability
  • Consistent placement of page actions
  • Clear separation of page-level and application-level actions
  • Skins can be changed on the fly
  • All styling done through CSS
  • Same CSS for IE and Firefox
  • XHTML complaint html
  • Works with JSPWiki version 2.3.x and later
  • Tested against JSPWiki version 2.3.72-alpha


Steps to Configure Skins:

  • JSPWiki is used to denote the location of you wiki
  • Unzip the contents of ButtonMenu2.zip to a temporary location
  • Copy ButtonMenu2 dir to the JSPWiki/templates dir
  • Edit JSPWiki/WEB-INF/jspwiki.properties to set templateDir to ButtonMenu2 e.g. 'jspwiki.templateDir = ButtonMenu2'
  • To change wiki skins modify JSPWiki/templates/ButtonMenu2/commonheader.jsp and choose one the following CSS files.
    • jspwiki_blue.css
    • jspwiki_copper.css
    • jspwiki_cream.css
    • jspwiki_gray.css
  • Start your JSPWiki and add button menus on the left menu by clicking the 'Edit page' button and adding wiki links inside a list. Here is sample code to do that.
* Main page
* About
* News
* Baldeep Hira
* Recent Changes
* WikiEtiquette

This is an updated version of the original ButtonMenu template. The original ButtonMenu template worked with JSPWiki version 2.0.54 and stopped working with some changes that were introduced in JSPWiki 2.1.x. ButtonMenu2 template has been created and tested against version 2.3.72-alpha.

The ButtonMenu2 template skin overrides the style for unordered list (UL) tag inside the left menu so that all the list items appear as buttons. Hence, you can easily create buttons by adding list items to your left menu as shown in the above example.

The ButtonMenu2 template skins are CSS based and use a standard layout for all the skins. The layout for the wiki pages is defined in the JSP files under templates/ButtonMenu2 directory. The JSP files have no styling information; all the styles are governed by the CSS files. All the pages in the wiki include the commonheader.jsp which embeds the link to the correct CSS file. There are 4 pre-packaged CSS files namely: jspwiki_blue.css, jspwiki_copper.css, jspwiki_cream.css and jspwiki_gray.css. The CSS files work fine both for IE and Firefox and there is no need for separate CSS implementations for different browsers. Just make sure that whenever you modify the CSS files you test it for both IE and Firefox.

This template is released under a LGPL License.

--Baldeep Hira
http://www.bhira.net


ButtonMenu2_Blue.png


ButtonMenu2_Copper.png


ButtonMenu2_Cream.png


ButtonMenu2_Gray.png


When implementing this Button Menu2 Template i encountered this error

Error Message /templates/ButtonMenu2/commonheader.jsp(17,1) No tag "IncludeResources" defined in tag library imported with prefix "wiki" Exception javax.servlet.jsp.JspException Place where detected com.ecyrd.jspwiki.tags.IncludeTag.doEndTag(), line 74

I found that the IncludeResourcetag has not been included in the tag lib. Can anybody give me the code to define the tag library?

Thanks

--Jane, 17-Feb-2006


Hi Jane, what version of JSPWiki are you using? I've tested this template only on 2.3.72-alpha, am waiting for the release version of 2.3 branch to test and update this template.

--Baldeep Hira, 18-Feb-2006
http://www.bhira.net


I´ve found that the styke sheets have a couple of little bugs which prevent the pages of showing up properly (tested on tomcat 4.0&5.0, JSPWiki 2.3.72-alpha, FF 1.5.0.1 & MSIE6.0). first you must replace in the css all 'url(images/...)' with 'url(./images/...)' or the images won´t show up (in both 'jspwiki.css' and 'jspwiki_yercolorhere.css').

Secondly, the left page does not match with the css. You provide rules for 'leftmenu ul' and 'leftmenu li', whereas leftpage has no lists with your plugin (only a bunch of anchors inside a div, I have not looked into default template). I´ve used the following rules and they worked fine for me (changes on jspwiki_yercolorhere.css, here I state what I´ve used for blue theme):

#leftpane div.leftmenu a.wikipage,
#leftpane div.leftmenu p a.wikipage     { text-decoration:none;
                              font-weight:bold; margin-top: -8px;
                              color:#fff; background-color:#85a1e6;
                              text-align:center; width:90%; border-style:solid;
                              border-width:1px 1px 1px 0; border-color:#fff #46a #46a #fff;
                              padding:4px 0 4px 0;display: block;}

#leftpane div.leftmenu a.wikipage br,
#leftpane div.leftmenu p a.wikipage br,
#leftpane div.leftmenu a.wikipage br,
#leftpane div.leftmenu p a.wikipage br {display:inline;}

#leftpane div.leftmenu p { margin-top:64px;}

#leftpane div.leftmenu a.editpage     { text-decoration:none;
                              font-weight:bold;background-color:#85a1e6; color:#fff;
                              text-align:center; width:90%; border-style:solid;
                              border-width:1px 1px 1px 0; border-color:#fff #46a #46a #fff; 
                              padding:4px 0 4px 0;display: block;border-bottom: 1px dashed;
                              margin-top:-8px; }

#leftpane div.leftmenu      { width: 100%;padding:4px;}

#leftpane div.leftmenu a.wikipage:hover,
#leftpane div.leftmenu p a.wikipage:hover,
#leftpane div.leftmenu a.editpage:hover,
#leftpane div.leftmenu p a.editpage:hover { color:#3e19cf;} 

kind regards,

-- JP at http://www.lacoctelera.com/foobar, 28/02/2006



Thanks for the input Juan, appreciate that. The images should load fine with both url(images/..) and url(./images/...). The CSS is referring to the images that are in the images sub directory inside ButtonMenuTemplate. The first case works for me in both IE and Firefox (not sure why you are having problems loading images with the first one). Also, you are correct that there is no default list items (LI) in the template. The template does not come with any data. That is something the administrator who sets up JSPWiki needs to do. The instructions at the top of this page show how to do that. When you add "*ABC" to your left menu the wiki engine creates a LI element and places an anchor inside that with a link to ABC. Let me know if you still have problems using it.

In general, realized that 2.3x is unstable right now, so will wait for it to stabilize and make this template production ready.

--Baldeep Hira, 02-Mar-2006
http://www.bhira.net


Hi Juan, are you running JSPWiki on a windows or linux box? I tested it on windows. Was just curious why url(images/...) is failing for you. Thanks.

--Baldeep Hira, 03-Mar-2006

Hi, I am trying to use this template. I extracted the zip files to templates directory. I changed the jspwiki.prop file and when I shutdown the tomcat and started it. Then when I access my wiki, I get a blank page. And I see the following error in the tomcat log file.

org.apache.jasper.JasperException: /templates/ButtonMenu2/ViewTemplate.jsp(24,25) No tag "Content" defined in tag library imported with prefix "wiki"

Any help. I am using tomcat5 and JSPWiki 2.2.33, JDK1.5 I tried 2.2.32, but that had some other problem. Please help me.

Thanks DM 09-Mar-2006


Hi DM, I developed this template on 2.3 and it does not work with 2.2, but looks like enough people want to use it with 2.2 branch and I'll look into backporting it to 2.2 Sorry am a little swamped with different projects right now, so it might take sometime.

--BaldeepHira, 14-Mar-2006
http://www.bhira.net


Hi BaldeepHira, from the picture you show, the template is great, thank you for share with us.

--Joe, 19-Apr.-2006


really good template!

--Burkhard Buelte, 29-Apr-2006


Hi when I turn the authentication on by removing the comment lines enclosing the <Security-constraints> chunks in we-bxml and bounce the wiki, I get following error:

11/05/2006 09:54:20 org.apache.catalina.startup.ContextConfig applicationWebConfig SEVERE: Parse error in application web.xml java.lang.IllegalArgumentException: Invalid <url-pattern> admin/SecurityConfig.jsp in security constraint at org.apache.tomcat.util.digester.Digester.createSAXException(Digester.java:2719) at org.apache.tomcat.util.digester.Digester.createSAXException(Digester.java:2745) at org.apache.tomcat.util.digester.Digester.endElement(Digester.java:1060) at org.apache.xerces.parsers.AbstractSAXParser.endElement(AbstractSAXParser.java:559) at org.apache.xerces.impl.XMLNamespaceBinder.endElement(XMLNamespaceBinder.java:646) at org.apache.xerces.impl.dtd.XMLDTDValidator.handleEndElement(XMLDTDValidator.java:2978) at org.apache.xerces.impl.dtd.XMLDTDValidator.endElement(XMLDTDValidator.java:918) at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.handleEndElement(XMLDocumentFragmentScannerImpl.java:1145) at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.scanEndElement(XMLDocumentFragmentScannerImpl.java:988) at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl$FragmentContentDispatcher.dispatch(XMLDocumentFragmentScannerImpl.java:1446) at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.scanDocument(XMLDocumentFragmentScannerImpl.java:333) at org.apache.xerces.parsers.StandardParserConfiguration.parse(StandardParserConfiguration.java:529) at org.apache.xerces.parsers.StandardParserConfiguration.parse(StandardParserConfiguration.java:585) at org.apache.xerces.parsers.XMLParser.parse(XMLParser.java:147) at org.apache.xerces.parsers.AbstractSAXParser.parse(AbstractSAXParser.java:1148) at org.apache.tomcat.util.digester.Digester.parse(Digester.java:1561) at org.apache.catalina.startup.ContextConfig.applicationWebConfig(ContextConfig.java:339) at org.apache.catalina.startup.ContextConfig.start(ContextConfig.java:1031) at org.apache.catalina.startup.ContextConfig.lifecycleEvent(ContextConfig.java:255) at org.apache.catalina.util.LifecycleSupport.fireLifecycleEvent(LifecycleSupport.java:119) at org.apache.catalina.core.StandardContext.start(StandardContext.java:4076) at org.apache.catalina.manager.ManagerServlet.start(ManagerServlet.java:1175) at org.apache.catalina.manager.HTMLManagerServlet.start(HTMLManagerServlet.java:527) at org.apache.catalina.manager.HTMLManagerServlet.doGet(HTMLManagerServlet.java:104) at javax.servlet.http.HttpServlet.service(HttpServlet.java:747) at javax.servlet.http.HttpServlet.service(HttpServlet.java:860) at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:252) at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:173) at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:213) at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:178) at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:514) at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:126) at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:105) at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:107) at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:148) at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:868) at org.apache.coyote.http11.Http11BaseProtocol$Http11ConnectionHandler.processConnection(Http11BaseProtocol.java:663) at org.apache.tomcat.util.net.PoolTcpEndpoint.processSocket(PoolTcpEndpoint.java:527) at org.apache.tomcat.util.net.LeaderFollowerWorkerThread.runIt(LeaderFollowerWorkerThread.java:80) at org.apache.tomcat.util.threads.ThreadPool$ControlRunnable.run(ThreadPool.java:684) at java.lang.Thread.run(Unknown Source)

--MV Srinivasan, 11-May-2006


You have an outstanding good and well structured site. I enjoyed browsing through it.


I've been using this template for almost 6 months now, and have really enjoyed it. Thanks for putting it out there.

I do have a question:

I just noticed that when the text that is to be placed on the button is somewhere around 20 characters long or longer, the text runs off of the button into the margins surrounding it. It seems as though the width of the button is generally an auto fit type function, but is there a maximum width? Can this be edited in the code? I looked over the code myself to see if I could fix it, but I couldn't find anything about button cell padding.

Any thoughts?

Thanks, Trae Stephens


I'm a little rusty on the CSS used in this skin, its been almost 9 months since I wrote it. But the problem you are seeing could be because of the width assigned to the left hand side menu. The left hand side menu gets something like 25% of the page width and the buttons themselves are padded list-items. Increasing the width of left hand side menu, should help. Let me know it it works for you?

--BaldeepHira, 30-Nov-2006
http://www.bhira.net


I am trying to put a logo at the upperleft side of the template. By default the upperleft side is occupied buy the name of the Wiki which I have given. Any ideas?

--Rougi, 16-May-2007


Hi, I installed the template and love the look of it, but whenever I try to save a change I get redirected to the SessionExpired page. Any help would be appreciated as I am new to JSPWiki.

Thanks Ken June 2009

--Ken, 03-Jun-2009 18:34

Add new attachment

Only authorized users are allowed to upload new attachments.

List of attachments

Kind Attachment Name Size Version Date Modified Author Change note
zip
ButtonMenu2.zip 202.5 kB 2 21-Nov-2006 19:49 200.222.102.109
png
ButtonMenu2_Blue.png 42.9 kB 1 06-Feb-2006 01:05 Baldeep Hira
png
ButtonMenu2_Copper.png 43.0 kB 1 06-Feb-2006 01:06 Baldeep Hira
png
ButtonMenu2_Cream.png 41.3 kB 1 06-Feb-2006 01:06 Baldeep Hira
png
ButtonMenu2_Gray.png 40.8 kB 1 06-Feb-2006 01:06 Baldeep Hira
rar
Desktop.rar 17.9 kB 1 20-Nov-2009 07:30 Pilar Viñuela
« This page (revision-61) was last changed on 20-Nov-2009 10:41 by Janne Jalkanen