Difference between revisions of "Code Documentation"

Line 43: Line 43:
 
<pre> &#60;!-- Call the styling template  ---&#62;
 
<pre> &#60;!-- Call the styling template  ---&#62;
 
  {{2015CSS}}
 
  {{2015CSS}}
−
  &#60;!-- declare that you use HTML  ---&#62;
+
  &#60;!-- declare that you are using HTML  ---&#62;
 
&#60;html&#62;                                       
 
&#60;html&#62;                                       
  

Revision as of 21:50, 30 January 2015

CSS and HTML used in iGEM 2015

This page documents and explains the CSS and HTML used in the 2015 site.

Creating a Page

To create a full width page, use: 

 <!-- Call the styling template  --->
 {{2015CSS}}
 <!-- declare that you are using HTML  --->
<html>                                       


 <!-- Here is where you change the title of page -->
	<div id="pageTitle">
		<h2> Page Title</div>

		<div id="grayLine_Clear"></div>

 <!-- This declares that the page will be Full width (980px) -->
		<div id="fullWidth">

		 <!-- This is the alert message. You can edit the  text and remove once the page is ready-->
		<div id="alertMessage"> <p> Please note that all information on this page is in a draft version.
                <br>Please check back often for details. </p></div>

	<!-- start of content ----------------------------------------> 

         **********           Your html should be placed here.          **********

	<!-- end of content ---------------------------------------->
		</div>
		<div class="clear"></div>
		</html> {{2015Footer}}<html>
	</div>
</html>

To create a Page that will use a side menu use: 

 {{2015CSS}}
<html>
	<!-- change the page title -->
	<div id="pageTitle">
		<h2> Starting a team</div>
		<div id="grayLine_Clear"></div>

		<div id="leftColumn">

			<!-- this is where the submenu is placed -->	

		</div>

		<div id="rightColumn">
		<!-- alert message, the text can be edited -->
		<div id="alertMessage"> <p> Please note that all information on this page is in a draft version.
                <br>Please check back often for details. </p></div>
	<!-- start of content ----------------------------------------> 

         **********           Your html should be placed here.          **********

	<!-- end of content ---------------------------------------->
		</div>
		<div class="clear"></div>
		</html> {{2015Footer}}<html>
	</div>
</html>

powered by MediaWiki