System Settings - Module menu appearance

From All n One's bxp software Wixi

Jump to: navigation, search

1 Overview

With the release of bxp Release 10 SER 2 the menu system for a module is an option which can be configured.


This option is configured for all users in Main Menu > System Access Management > System Management > System Settings > Module Menu Appearance For all the settings available System_Settings


Modulemenuappearance 001.png


There are four configurable fields

  • Appearance
  • CSS
  • Images Path
  • Buttons per row


Appearance : There are three choices

  • Classic
  • Accordion
  • Menu Buttons


CSS : This style sheet will only be included on the Module Menu pages. The default styling is done in style_master_layout.css but can be overridden in your own custom style sheets.


Images Path : Allows you to override the default path to where the images are https://ww3.allnone.ie/images/image_icons/ This allows you to completely replace the buttons should you wish to. A full copy of the buttons can be provided on request allowing to easily customise them.


Buttons per row : When using the Menu Buttons option only, the system will dynamically work out the best amount of buttons to display per row. If you would prefer to override this with a set size that is maintained in all modules, this option can be used.


2 Appearance

2.1 Classic

module menu choices 001.png


2.2 Accordion

module menu choices 002.png


The style of the menu can be overwritten with

/************************************************
************************************************/
.cssMenu_Header {

}
.cssMenu_Header_TD {
    color : #ffffff;
    text-align : left;
	font-size:16px;
}
.cssMenu_Header_TD a{
    color : #ffffff;
    text-decoration : underline;
	font-size:16px;
}
.cssMenu_Header_TD a:hover{
    color : #ff0000;
}
.cssMenu_Header_TD a:visited{
    color : #ffffff;
}
.cssSectionMenu_Text {

}
.cssModule_Menu_Div{
}
.csseCourse_Menu_Title {
    color : #ffffff;
    text-align : left;
	font-size:16px;
}
.cssContentBody{
	width:99%;
    border: 1px solid #042103;
	border-spacing:2px;
	border-color:#042103;
	color:#042103;
	
	background:#ffffff;
	background-color:#ffffff;
	
	padding: 5px;
	padding-left: 7px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-khtml-border-radius: 15px; 
	-o-border-radius: 15px;
	overflow: hidden; 
	-pie-track-active: false;
	-pie-track-hover: false;
}


2.3 Menu Buttons

module menu choices 003.png


/************************************************
* Menu Button style
************************************************/
.cssMenu_BigButtons_Section_All { 
	background: url("/images/myhome/test4.png") 50% 50% repeat-x;

}
.cssMenu_BigButtons_Section_DIV{
	/* background-color: #00Ff00; */
	background: rgba(255, 255, 255, 0.9);
	color:#042103;
	padding: 5px;
	padding-left: 7px;
	border-radius: 15px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-khtml-border-radius: 15px; 
	-o-border-radius: 15px;
	overflow: hidden; 
	-pie-track-active: false;
	-pie-track-hover: false;
}
.cssMenu_BigButtons_Section_Items { 
	/* background-color: #0000ff; */
}
.cssMenu_BigButtons_Section_Table { 
	/* background-color: #ffff00; */
}
.cssMenu_BigButtons_Section_TR { 
	/* background-color: #ff00ff; */
}
.cssMenu_BigButtons_Section_TD { 
	/* background-color: #00ffff; */
	cursor: pointer;
	cursor: hand;
}
.cssMenu_BigButtons_Section_TD:hover { 
	font-weight: bold;
}
.cssMenu_BigButtons_Section_TR_Spacer { 
	/* background-color: #ababab; */
}
.cssMenu_BigButtons_Section_TD_Spacer { 
	/* background-color: #232323; */
}


3 Menu Buttons - Custom Set

There are a host of images required to supply all the buttons but it is possible for you to have your own custom set.


The default system set looks like

men buttons all 001.png


Please contact support for instructions on how you can build your own customised set. support@bxpsoftware.com