Website/how-to
Introduction
If you're used to editing a page of html and ftp'ing it to a webserver, then you may it an 'interesting' experience creating content for the OOo site.
Collabnet CMS
OOo uses a web hosting infrastructure from Collabnet which provides a complete content management system (CMS). In simple terms, the CMS takes the html you submit and wraps the site headers, menus, and footers around it. Your html and css gets embedded in a whole pile of other stuff - which will probably break a lot of the nice formatting you have prepared offline.
How it works in practice
At the end of this page there is a simple example sample.html of a web page just as you might prepare it offline. You can upload this into the CMS using cvs (there's some hints on cvs [here]). To see what it looks like once it's been through the CMS, check [this link]. Do a View -> Page Source in your browser and see if you can spot your original sample.html.
Note: at the time of writing, there is an interesting bug in the CMS. If you omit the trailing '.html' in the URL, the CMS will render your content without alteration - check [this link]. You should not rely on this 'feature' working in future ...
Hints and tips
- it is pretty difficult to prepare content for the site, unless you can upload your content to a test area somewhere and see how it actually renders through the CMS
- the CMS will use any css references you include, either as <style type="text/css"> ...</style>, or as external .css files (don't forget to uplaod them to the site :-)
- sometimes you will wonder what on earth is going on. A tool like the DOM Inspector add-on for Firefox is almost essential to help you unravel the layers of cascading style information on a page
- with patience, it is possible to hide the CMS generated content by using appropriate css. The [Spanish Native-Language project] and the [Marketing Project Why OpenOffice.org pages do this. However, every time there is a Collabnet upgrade, these usually need a lot of hasty re-work...
sample.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Sample text</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<style type="text/css">
#redbox { border: 1px solid red; }
</style>
</head>
<body>
<div id="redbox">
<h1>This is H1 style</h1>
<h2>This is H2 style</h2>
<h3>This is H3 style</h3>
<h4>This is H4 style</h4>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam placerat sapien quis dui.
Curabitur ut sapien at lectus fringilla luctus. Duis et nulla. Maecenas ut urna.
Pellentesque diam elit, varius a, euismod sit amet, sagittis id, mi. Nulla felis arcu,
elementum vitae, consectetuer at, tempor vel, tortor. Duis imperdiet. Morbi ultricies
bibendum diam. Phasellus aliquam molestie neque. Sed in velit vitae urna mollis sodales.
Donec massa. Aenean vitae magna. Aliquam erat volutpat. Phasellus aliquam egestas elit.
Pellentesque sit amet justo. Cras et magna. Phasellus consequat mauris vel lectus.
Cras gravida elit in nisi. Vestibulum blandit justo in nibh.
</p>
<hr />
<ul>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Etiam placerat sapien quis dui.</li>
<li>Curabitur ut sapien at lectus fringilla luctus.</li>
</ul>
<hr />
<ol>
<li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
<li>Etiam placerat sapien quis dui.</li>
<li>Curabitur ut sapien at lectus fringilla luctus.</li>
</ol>
</div>
</body>
</html>
