########################################
# deV!L`z Clanportal - kurz 'DZCP'
# ====================================
# www.dzcp.de
########################################


1) Installation
================
Die Installation gestaltet sich recht einfach.
Lade alle Dateien aus dem Archiv per FTP auf deinen Webserver und ffne anschlieend in deinem Web-Browser das Installationsprogramm unter z.B. www.url.de/_installer/.
Folge hier den Anweisungen, die dich durch die Installationsroutine begleiten.



2) Update
================
Da ein Update von frheren Versionen aus schwierig wren, gehe ich hier nur auf ein Update von mindestens der Version 1.4.x aus.
Grundstzlich gilt, das nahezu jede Datei bearbeitet wurde, daher werden vorher installierte Mods vorerst verloren gehen!

Empfehlenswert ist, es in jedem Falle das Update erst separat in einer Testumgebung durchzufhren und erst wenn alles luft dieses in die eigentliche Seite zu integrieren.

Solltest du dir das updaten deines Portals nicht zutrauen, kannst du auch den UpdateService auf Clandesigns.de nutzen. http://mystarmedia.clandesigns.de/modifikationen/83/update-service/

	
	1. Vorbereitung
	================================
	Nenne zuerst den Templateordner aus dem Archiv (/inc/_templates_/version1.5/) in den von dir verwendeten Ordner um.
	Lsche (!) aus diesem Templateordner folgende Ordner oder Dateien:
	
		~/_css/stylesheet.css
		~/images/~
		~/index.html
    
  Lsche ebenfalls den Inhalt der folgenden Ordner:
  
    /inc/images/uploads/userpics/
    /gallery/images/  



	2. Aktualisierung der Dateien
	================================
	Kopiere nun alle Dateien ber deine vorhandene DZCP-Installation drber.
	


	3. Anpassung der stylesheet.css
	================================
	Fge die folgenden CSS-Klassen ans Ende der stylesheet.css hinzu:


/**************
  Permission Table
**************/
div.permissions input.checkbox {
  float: left; margin: 1px 2px;
}

div.permissions label {
  display: block; float: left; clear: right;
  width: 45%;
  text-align: left;
}

div.permissions br {
  clear: both;
  height: 0; line-height: 0; font-size: 0;
}

/*********************************/
td.navEventsLeft {
  width: 10px;
}

td.navEventsContent {
  text-align: left;
}

td.navEventsRight {
  width: 2px;
}

td.navTrialLeft {
  width: 22px;
}

td.navTrialRight {
  width: 0px;
}

td.navTrialContent {
  text-align: left;
}

/**************
  Lightbox
**************/
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../../../images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../../../images/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 26px; float: right;  padding-bottom: 0.7em; outline: none;}

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

/**************
  Newsticker
**************/
div#ticker {
  position: relative;
  width: 650px;
  overflow: hidden;
  margin: 0 auto; padding: 0;
  text-align: center;
}

div#ticker,
div#ticker div.scrollDiv,
div#ticker div.scrollDiv td {
  white-space: nowrap;
}

div#ticker a:link,
div#ticker a:visited {
  color: #FFF;
}	

div#ticker a:hover,
div#ticker a:active {

}

/**************
  globale Suche
**************/
#searchpanel {  
  border: 1px solid #111;
  border-top: 1px solid #555;
  border-right: 1px solid #555;
  background-color: #F7F7F7;
  color: #000;
  padding: 2px;
  width: 150px;
}
* html #searchpanel { margin: -1px 0 }
*+html #searchpanel { margin: -1px 0 }

input.searchSubmit {  
  padding: 0;
  padding-left: 5px;
  padding-right: 5px;
  background-color: #FFF;
  background-image: url(../images/submit.jpg);
  border: 1px solid #5F5F5F;
  color: #000;
  cursor: pointer;
}
input.searchSubmit:hover {
  background-image: url(../images/submit_hover.jpg);
}
/*IE Hack*/
*+html input.searchSubmit { overflow: visible; }
* html input.searchSubmit { overflow: visible; }

/****************************************/

img.border {
  border: 1px solid #777;
}

div#infoDiv {
  visibility: visible;
  display: none;
}



	4. Anpassung der index.html
	================================
	Hier sind die meisten Anpassungsarbeiten von Nten.
	Passe den Teil zwischen <head> und </head> so an, das er wie folgt aussieht. Wichtig sind dabei die neuen / umbenannten Javascript-Dateien:

  <head>
    <title>[title]</title>
    <meta http-equiv="title" content="[title]" />
    <meta http-equiv="classification" content="General" />
    <meta http-equiv="pragma" content="No-Cache" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="Content-Script-Type" content="text/javascript" />
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" type="text/css" href="[dir]/_css/stylesheet.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="[dir]/_css/icons.php" media="screen" />
    <link rel="alternate" type="application/rss+xml" href="../rss.xml" title="[rss] RSS-Feed" />
    <link rel="shortcut icon" href="../favicon.ico" type="image/ico" />
    <link rel="home" href="" title="Home" />
    <link rel="top" href="#toplink" title="TOP" />
    <script language="javascript" type="text/javascript" src="[dir]/_js/lib.js"></script>
    <script language="javascript" type="text/javascript" src="../inc/tinymce/tiny_mce.js"></script>
    [java_vars]
    <script language="javascript" type="text/javascript" src="[dir]/_js/dzcp.js"></script>
    <script language="javascript" type="text/javascript" src="[dir]/_js/lightbox.js"></script>
  </head>

	
	Als nchstes musst du - sofern vorhanden - die Elternelemente (meistens <table>, <div>) um einen Platzhalter entfernen, da dies fortan automatisch in den PHP-Dateien geschieht.
	
	Beispiel 1:

		VORHER:
		
                  <tr>
                    <td>
		      <table class="navContent" cellspacing="1">
                        [nav_main]
		      </table>
                    </td>
                  </tr>

		NACHHER:

                  <tr>
                    <td>
                      [nav_main]
                    </td>
                  </tr>


	Beispiel 2:

		VORHER:
		
                  <tr>
                    <td>
		      <div id="navKalender">
                        [kalender]
		      </div>
                    </td>
                  </tr>

		NACHHER:

                  <tr>
                    <td>
                      [kalender]
                    </td>
                  </tr>


	Falls ntig, fge eine der folgenden neuen Platzhalter hinzu um die neuen Funktionen nutzen zu knnen:
	
		[rotationsbanner]	- Werbebanner in der Rotation (einstellbar im Adminmenu)
		[sponsors]		- Sponsor Logos (wie die Partnerbuttons)
		[eventbox]		- Anstehende Events aus dem Kalender
		[motm]			- Member of the Moment
		[newsticker]		- Newsticker in Endlosschleife
		[random_gallery]	- zuflliges Bild aus der Gallerie inkl. verlinkung
		[top_match]		- Top Match (einstellbar im Adminmenu)



	5. Update der MySQL-Daten
	================================
	Fhre nun das Update der MySQL-Daten aus, indem du die Datei www.url.de/_installer/update.php.
	Folge hier den Anweisungen bis zum Ende.




Fertig.
Wenn alles geklappt hat sollte deine DZCP-Version nun auf dem neusten Stand sein!
Gegebenfalls mssen die Gameserver neu eingestellt werden.
