pifty
/
tutes-dump
Archived
1
1
Fork 1
This repository has been archived on 2020-07-15. You can view files and clone it, but cannot push or open issues or pull requests.
tutes-dump/site-tutorials/format.html

365 lines
10 KiB
HTML
Executable File

<html>
<head>
<link href="format.css" rel="stylesheet" type="text/css" />
<link href="http://eamonnw.metapath.org/do_not_delete_960.css" rel="stylesheet" type="text/css">
<title>The Making of SDF Tutorials</title>
</head>
<body>
<div class="container_12"><div class="grid_11 prefix_1">
<h1 class="title">Creating and editing tutorials</h1>
<dl>
<dt><a class="link" href="#Introduction">Introduction</a></dt>
<dt><a class="link" href="#Creating a New Tutorial">Creating a New Tutorial</a></dt>
<dt><a class="link" href="#Editing or modifying a tutorial">Editing or modifying a tutorial</a></dt>
<dt><a class="link" href="#Tips">HTML format guidelines</a></dt>
<dd><a class="link" href="#Template">Template</a></dd>
<dd><a class="link" href="#Title">Title</a></dd>
<dd><a class="link" href="#Header">Header</a></dd>
<dd><a class="link" href="#Body">Body</a></dd>
<dd><a class="link" href="#Note">Note</a></dd>
<dd><a class="link" href="#Code">Code</a></dd>
<dd><a class="link" href="#Reference">Reference</a></dd>
<dd><a class="link" href="#Tables">Tables</a></dd>
<dd><a class="link" href="#List">List</a></dd>
<dd><a class="link" href="#Links">Links</a></dd>
<dt><a class="link" href="#Using images">Using images</a></dt>
<dt><a class="link" href="#Using references">Using references</a></dt>
<dt><a class="link" href="#Example">Example</a></dt>
</dl>
<p class="header"><a name="Introduction">Introduction</a></p>
<p class="body">
This tutorial has been introduced to help members to more easily contribute to <br/>
the <a class="link" href="http://sdf.org/?tutorials">SDF Tutorials</a> project. The SDF Tutorials utilize simple RCS Revision Control System. <br/>
The only downside is initially finding the folder location and reading the lengthy <br/>
README.TXT. By using this tutorial, you should be able to get started much quicker! <br/>
Please note, this tutorial is not meant to replace the main README.TXT and reading the main <br/>
README.TXT will provide a better understanding. More in-depth instructions for editing SDF <br/>
Tutorials can be found within the <a class="link" href="/tutorials/README.TXT">README.TXT</a> (which can also be found on the shell at <br/>
/sys/html/tutorials/README.TXT).<br/>
</p>
<h3 class="header"><a name="Creating a New Tutorial">Creating a New Tutorial</a></h3>
<p class="body">
<dl>
<dt>Change your current directory to the tutorials directory.</dt>
<dd><p class="code"><br/>cd /sys/html/tutorials</p></dd>
<dt>Create an empty html file with a name of your choosing.</dt>
<dd><p class="code"><br/>touch new_filename.html</p></dd>
<dt>Change the permissions on the file so everyone can read it.</dt>
<dd><p class="code"><br/>chmod a+r filename.html</p></dd>
<dt>Check the file in and unlock it so everyone can edit it.</dt>
<dd><p class="code"><br/>ci -u new_filename.html</p></dd>
<dd><p class="note"><br/>Check to make sure file permissions are retained by RCS on check-out (co).<br/>
If they are not, and the permissions only show user readable still, <br/>
then chmod a+r RCS/filename.html,v directly so that the file can be read by readers of the webpage.<br/>
Next, edit the main index.html page to include the newly created file.<br/></p></dd>
</dl>
</p>
<h3 class="header"><a name="Editing or modifying a tutorial">Editing or modifying a tutorial</a></h3>
<p class="body">
<dl>
<dt>Change your current directory to the tutorials directory.</dt>
<dd><p class="code"><br/>cd /sys/html/tutorials</p></dd>
<dt>Check out the file and lock it while you make your edits</dt>
<dd><p class="code"><br/>co -l filename.html</p></dd>
<dt>Edit the file using a text editor(i.e. vi, pico, nano)</dt>
<dd><p class="code"><br/>nano filename.html</p></dd>
<dt>Check the file in and unlock it so everyone can edit it.</dt>
<dd><p class="code"><br/>ci -u new_filename.html</p></dd>
</dl>
</p>
<h3 class="header"><a name="Tips">HTML format guidelines</a></h3>
<p class="body">
Whether after issuing the co command or simply editing a file within /sys/html/tutorials, <br/>
modifications can be viewed in real time with a browser over the internet. But remember, <br/>
changes will only be saved if you use co/ci properly! The tutorial server script generates <br/>
the page header and footer, so you only need to supply the content of the tutorial you plan to <br/>
post and the RCS &#36;Id&#36; tag. You can use the following as a template:<br/>
</p>
<a name="Template"></a>
<pre class="code"><br/>
&lt;html>
&lt;head>
&lt;style type="text/css">
.title{
background-color:#ffffff;
font-size:30px;
color:#2a2a2a;
}
.header{
background-color:#ffffff;
font-size:20px;
color:#2a2a2a;
}
.body{
background-color:#ffffff;
font-size:15px;
color:#2a2a2a;
}
.reference{
border: 1px dotted #000;
text-align: left;
padding: 5px;
padding: 15px 30px 15px;
background:#CCC url('http://sdf.org/tutorials/images/ref.png') 5px 5px no-repeat;
color: #000;
margin: 10px 5px;
}
.link { text-decoration:none }
.superscript{
font-size:10px;
vertical-align:top;
}
.subscript{
font-size:10px;
vertical-align:bottom;
}
.note{
border: 1px dotted #000;
text-align: left;
padding: 5px;
padding: 15px 30px 15px;
background: #DC143C url('http://sdf.org/tutorials/images/note.png') 5px 5px no-repeat;
color: #FFF;
margin: 10px 5px;
}
.code{
border: 1px dotted #000;
text-align: left;
padding: 5px;
padding: 15px 30px 15px;
background:#2F4F4F url('http://sdf.org/tutorials/images/code.png') 5px 5px no-repeat;
color: #00FF00;
margin: 10px 5px;
font-family: monospace;
}
table.table {
border-width: 0px;
border-spacing: 0px;
border-style: none;
border-collapse: collapse;
background-color: #1E90FF;
}
table.table th {
border-width: 1px;
padding: 1px;
border-style: inset;
border-color: white;
background-color: #A0522D;
-moz-border-radius: ;
padding: 10;
}
table.table td {
border-width: 1px;
padding: 1px;
border-style: inset;
border-color: white;
background-color: #FFEBCD;
-moz-border-radius: ;
padding: 5;
}
&lt;/style>
&lt;/head>
&lt;body>
YOUR CODE HERE<br/>
&lt;br/><br/>
&lt;cite>&#36;Id&#36;&lt;/cite><br/>
&lt;/body>&lt;/html>
</pre>
<br/>
<p class="body">
<a name="Comment"></a>
This is how to to define a comment<br/>
</p>
<p class="code"><br/>
&lt;!-- This is a comment -->
</p>
<p class="body">
<a name="Title"></a>
This is the code to define a tutorial title<br/>
</p>
<p class="code"><br/>
<br/>
&lt;h1 class="title">Here is a test for the title format.&lt;/h1>
</p>
<p class="body">
<a name="Header"></a>
This is the code to define a tutorial header<br/>
</p>
<p class="code"><br/>
<br/>
&lt;h3 class="header">Here is a test for the header format.&lt;/h3>
</p>
<p class="body">
<a name="Body"></a>
This is the code to define a tutorial body.<br/>
</p>
<p class="code"><br/>
<br/>
&lt;p class="body">Here is a test for the tutorial body format.&lt;/p>
</p>
<p class="body">
<a name="Note"></a>
This is the code to define a tutorial note section.<br/>
</p>
<p class="code"><br/>
<br/>
&lt;p class="note">&lt;br>Here is a test for a note/warning/tip.&lt;/p>
</p>
<p class="body">
<a name="Code"></a>
This is the code to define a tutorial code section.<br/>
</p>
<p class="code"><br/>
<br/>
&lt;p class="code">&lt;br>Here is a test for the code format.&lt;/p>
</p>
<p class="body">
<a name="Reference"></a>
This is the code to define a tutorial reference section.<br/>
</p>
<p class="code"><br/>
<br/>
&lt;p class="reference">&lt;br>Here is a test for the reference format.&lt;/p>
</p>
<p class="body">
<a name="Tables"></a>
This is the code to define a table.<br/>
</p>
<pre class="code"><br/>
&lt;table class="table">
&lt;tr>
&lt;th>Table Header 0&lt;/th>
&lt;th>Table Header 1&lt;/th>
&lt;th>Table Header 2&lt;/th>
&lt;/tr>
&lt;tr>&lt;!-- This is column 1 -->
&lt;th>Table DATA&lt;/th>
&lt;td>TABLE DATA&lt;/td>
&lt;td>TABLE DATA&lt;/td>
&lt;/tr>
&lt;tr>&lt;!-- This is column 2 -->
&lt;th>Table DATA&lt;/th>
&lt;td>TABLE DATA&lt;/td>
&lt;td>TABLE DATA&lt;/td>
&lt;/tr>
&lt;tr>&lt;!-- This is column 3 -->
&lt;th>Table DATA&lt;/th>
&lt;td>TABLE DATA&lt;/td>
&lt;td>TABLE DATA&lt;/td>
&lt;/tr>
&lt;/table>
</pre>
<p class="body">
<a name="List"></a>
This is the code to define a list. You have have two levels: the title of a section(dt) and the subsection(dd).
</p>
<pre class="code"><br/>
&lt;dl>
&lt;dt>Section 1&lt;/dt>
&lt;dd>Section 1.1&lt;/dd>
&lt;dd>Section 1.2&lt;/dd>
&lt;dd>Section 1.3&lt;/dd>
&lt;dt>Section 2&lt;/dt>
&lt;dd>Section 2.1&lt;/dd>
&lt;dt>Section 3&lt;/dt>
&lt;dd>Section 3.1&lt;/dd>
&lt;dd>Section 3.2&lt;/dd>
&lt;dt>Section 4&lt;/dt>
&lt;dd>Section 4.1&lt;/dd>
&lt;dd>Section 4.2&lt;/dd>
&lt;/dl>
</pre>
<p class="body">
<a name="Links"></a>
This is the code to define a link.
</p>
<pre class="code"><br/>
&lt;a class="link" href="http://www.example.com">Example link&lt;/a>
</pre>
<br/>
<a name="Using images"></a>
<h3 class="header">Using images</h3>
<dl>
<dt>No hotlinking of files from other sites: images must be uploaded to the /sys/html/tutorials/images folder</dt>
<dt>When using images tags must be clearly defined.</dt>
<dd>
<br/>
Incorrect<br/>
<p class="code">
<br/>
&lt;img src="tutorials/images/example.png"/><br/>
</p>
</dd>
<dd>
Correct<br/>
<p class="code">
<br/>
&lt;img src="http://sdf.org/tutorials/images/example.png" alt="Example" height="128" width="128"/><br/>
</p>
</dd>
</dl>
<br/>
<a name="Using references"></a>
<h3 class="header">Using references</h3>
<pre class="reference">
Book:
Author's last name, first initial. (Publication date). Book title. Additional information. City of publication: Publishing company.
Encyclopedia & Dictionary:
Author's last name, first initial. (Date). Title of Article. Title of Encyclopedia (Volume, pages). City of publication: Publishing company.
Magazine & Newspaper Articles:
Author's last name, first initial. (Publication date). Article title. Periodical title, volume number(issue number if available), inclusive pages.
Online periodical:
Author's name. (Date of publication). Title of article. Title of Periodical, volume number, Retrieved month day, year, from full URL
Online document:
Author's name. (Date of publication). Title of work. Retrieved month day, year, from full URL
</pre>
<br/>
<a name="Example"></a>
<h3 class="header">Example</h3>
<p class="body">
Here is the <a class="link" href="http://sdf.org/?tutorials/example">example</a> and <a class="link" href="http://sdf.org/?tutorials/example_source">source</a> of a typical tutorial.
</p>
<cite>$Id: format.html,v 1.17 2014/09/11 09:30:24 grobe0ba Exp $</cite>
</div></div></body></html>