Drei Spalten Template für Redaxo erstellen

Das ganze Template für Redaxo aufbereitet inkl. dem CSS Framework Grid 960 und 2 ctype Spalten. XHTML und CSS sind unter den entsprechenden Reitern zu finden.

Vom Frontend ins Backend do surf

Code hier kopieren und als Template anlegen. Do Surf ist in dem Beispiel Template mit der id 2 angelegt, sollte sich die id ändern bitte im Template auch ändern. Dank geht an Thomas Skerbis für die do surf

<?php if ($_SESSION[$REX['INSTNAME']]['UID']>0) { ?>

<div class="do_rexsurf">

	<a href="<?php echo $REX['SERVER'];?>/redaxo/index.php?page=content&amp;article_id=<?php echo $this->getValue('article_id');?>&amp;mode=edit&amp;clang=0" title="Bearbeiten">

    	<img src="files/edit.png" alt="Bearbeiten" width="30" height="30" />

    </a>

    <a href="<?php echo $REX['SERVER'];?>/redaxo/index.php?page=content&amp;article_id=<?php echo $this->getValue('article_id');?>&amp;mode=meta&amp;clang=0" title="Metainformationen" >

    	<img src="files/metainfo.png" alt="Metainformationen" width="30" height="30" />

    </a>

    <a title="Abmelden" href="<?php echo $REX['SERVER'];?>/redaxo/index.php?rex_logout=1">

    	<img src="files/abmelden.png" alt="Abmelden" width="30" height="30" />

    </a>

</div>

<?php }?>

Rootartikel Navigation für das CMS Redaxo

sollte als Template mit der id 3 angelegt werden oder die id im Template ändern. REX_TEMPLATE[id=3]

<?php $articles = OOArticle::getRootArticles(true);

echo '<ul>';

foreach($articles as $article) {

if ($this->getValue('article_id') == $article->getId())

echo '<li><strong>'.$article->getName().'</strong></li>';

else

echo '<li><a href="'.$article->getUrl().'">'.$article->getName().'</a></li>';

}

echo '</ul>';

?>

Nützliche Links zu den Templates

Redaxo Templates
http://www.redaxo.de/19-0-templates.html

REX-Templates
http://www.rex-templates.de/tutorials/templates/einfaches-template/artikel-ausgabe.html

YAML-Templates für redaxo
http://www.raybeam.de/13-0-templates.html

Redaxo-Templates
http://redaxo-templates.de/

XHTML Strict Template Vorlage für Redaxo Version 4.2

Template kopieren und in Redaxo als z.Bsp.: 01 default Template anlegen.
Bitte beachten charset=utf-8 evtl. ändern, je nach installation.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<?php

session_start();

$OOStartArticle = OOArticle::getArticleById($REX['START_ARTICLE_ID'], $REX['CUR_CLANG']);

$meta_beschreibung = $OOStartArticle->getValue("art_description");

$meta_suchbegriffe = $OOStartArticle->getValue("art_keywords");

$meta_bild = $OOStartArticle->getValue("art_file");



if($this->getValue("art_description") != "")

$meta_beschreibung = $this->getValue("art_description");



if($this->getValue("art_keywords") != "")

$meta_suchbegriffe = $this->getValue("art_keywords");

?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<base href="<?php echo $REX['SERVER'];?>" />

<meta name="robots" content="INDEX,FOLLOW" />

<meta http-equiv="content-language" content="de" />

<meta name="Description" content="<?php print $meta_beschreibung; ?>" />

<meta name="Keywords" content="<?php print $meta_suchbegriffe; ?>" />

<title><?php print $REX['SERVERNAME'].' | '.$this->getValue("name"); ?></title>

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

<link href="files/reset.css" rel="stylesheet" type="text/css" media="all" />

<link href="files/960.css" rel="stylesheet" type="text/css" media="screen" />

<link href="files/main.css" rel="stylesheet" type="text/css" media="screen" />

</head>

<body>

<div class="container_12" id="wrapper">

<div class="grid_12" id="top_navi"> REX_TEMPLATE[id=2] REX_TEMPLATE[id=3] </div>

<div class="clear"></div>

<div class="grid_12" id="header"><img src="index.php?rex_resize=940c__120h__REX_ARTICLE[field="headerbild"]" alt="as" /></div>

<div class="clear"></div>

<div class="grid_12" id="navi_main">

<?php $rexnav = rex_navigation::factory(); echo $rexnav->get(0,1,FALSE,TRUE); ?>

</div>

<div class="clear"></div>

<div class="grid_3" id="linkes">

<?php $P = explode("|",$this->getValue("path").$this->getValue("article_id")."|"); $rexnav = rex_navigation::factory(); echo $rexnav->get($P[1],3,FALSE,TRUE); ?>

</div>

<div class="grid_6" id="mitte"><?php print $this->getArticle(1); ?></div>

<div class="grid_3" id="rechtes_dreispalter"><?php print $this->getArticle(2); ?></div>

<div class="clear"></div>

<div class="grid_12 hell rund" id="footer">

<p class="copy"><a href="http://www.rexvideo.de" title="REXvideo Videotutorials rund um Redaxo">by REXvideo</a> | <a href="http://www.redaxo.de" title="einfach, flexibel, sinnvoll">CMS REDAXO</a></p>

</div>

<div class="clear"></div>

</div>

<!-- end wrapper -->

</body>

</html>

Die Datei reset.css

Code hier kopieren und im Root der Installation in den Ordner files/ mit dem entsprechenden Namen reset.css ablegen.

/* http://meyerweb.com/eric/tools/css/reset/ */

/* v1.0 | 20080212 */

*{

margin:0;

padding:0;

}



div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {

margin: 0;

padding: 0;

border: 0;

outline: 0;

font-size: 100%;

vertical-align: baseline;

background: transparent;

}

body {

line-height: 1;

}

ol, ul {

list-style: none;

}

blockquote, q {

quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

content: '';

content: none;

}



/* remember to define focus styles! */

:focus {

outline: 0;

}



/* remember to highlight inserts somehow! */

ins {

text-decoration: none;

}

del {

text-decoration: line-through;

}



/* tables still need 'cellspacing="0"' in the markup */

table {

border-collapse: collapse;

border-spacing: 0;

}

Die Datei 960.css

An die Vorlage angepasst und nicht benötigtes entfernt. Code hier kopieren und im Root der Installation in den Ordner files/ mit dem entsprechenden Namen 960.css ablegen.

/*

960 Grid System ~ Core CSS.

Learn more ~ http://960.gs/



Licensed under GPL and MIT.

*/



/* `Containers

--------------------------------------------*/



.container_12 {

margin-left: auto;

margin-right: auto;

width: 960px;

}



/* `Grid >> Global

-------------------------------------------*/



.grid_1,

.grid_2,

.grid_3,

.grid_4,

.grid_5,

.grid_6,

.grid_7,

.grid_8,

.grid_9,

.grid_10,

.grid_11,

.grid_12 {

display: inline;

float: left;

position: relative;

margin-left: 10px;

margin-right: 10px;

}



.container_12 .grid_3 {

width: 220px;

}



.container_12 .grid_6 {

width: 460px;

}



.container_12 .grid_9 {

width: 700px;

}



.container_12 .grid_12 {

width: 940px;

}



/* `Grid >> Children (Alpha ~ First, Omega ~ Last)

-----------------------------------------------------------*/



.alpha {

margin-left: 0;

}



.omega {

margin-right: 0;

}



/* `Grid >> 12 Columns

--------------------------------------------------*/



.container_12 .grid_1 {

width: 60px;

}



.container_12 .grid_2 {

width: 140px;

}



.container_12 .grid_4 {

width: 300px;

}



.container_12 .grid_5 {

width: 380px;

}



.container_12 .grid_7 {

width: 540px;

}



.container_12 .grid_8 {

width: 620px;

}



.container_12 .grid_10 {

width: 780px;

}



.container_12 .grid_11 {

width: 860px;

}



/* `Clear Floated Elements

---------------------------------------------------------*/



/* http://sonspring.com/journal/clearing-floats */



.clear {

clear: both;

display: block;

overflow: hidden;

visibility: hidden;

width: 0;

height: 0;

}