0251 / 590 837 15
info@a-coding-project.de
;

Logout + CustomCSS (CMS)

Code & Blog Logo

Code & Blog Logo

In diesem CMS-Beitrag geht es heute um das Logout und um CustomCSS. Was das Logout macht sollte euch allen klar sein, aber das CustomCSS werde ich kurz erklären. Wie ihr vielleicht bemerkt habt, ist seit dem das Dashboard eingebaut ist das CSS ein bisschen fehlerhaft. Wenn man zum Beispiel mal auf die Links achtet: Die sind alle weiß.

Mit dem CustomCSS habe ich folgendes vor: Jede Seite kann ihren eigenen Stylesheet bekommen, der in der DB festgelegt ist. So wird nur dann das CSS des Dashboards benutzt, wenn das Dashboard auch wirklich angezeigt wird.

Fangen wir mit der Datenbanktabelle an. Hier gibt es zwei Spalten. Einmal die id und dann den Path des StyleSheets. Ich habe die id id genannt, damit man später nicht nur Urls, sondern auch andere Sachen darin speichern kann. Hier ist erstmal der Create-String:

CREATE TABLE `cms_custom_css` (
`id` VARCHAR( 100 ) NOT NULL ,
`stylePath` VARCHAR( 100 ) NOT NULL ,
PRIMARY KEY ( `id` )
) TYPE = MYISAM ;

Die id für den Admin-Bereich setzt sich so zusammen: {admin}/ + Include-Path. Ich nehme hier mit Absicht nicht den ganzen Path, denn so müsste man später alle Parameter mit in die DB speichern, was natürlich Unsinn ist. Nun wollen wir als erstes den StyleSheet fürs Dashboard einfügen. Das geht dann so:

INSERT INTO `cms_custom_css` ( `id` , `stylePath` )
VALUES (
'{admin}/', '/admin/inettuts.css'
);

Nun benötigen wir eine neue Klasse (/system/classes/customcss.php). In ihr wird das ganze ausgelesen:

<?PHP
  class CustomCSS{
 
    function printStylesheet($id){
      $path = self::getStylePath($id);
      if($path){
        echo "<link href="".$path."" rel="stylesheet" type="text/css" />";
      }
    }
    
    function getStylePath($id){
      global $dbpraefix;
      $id = mysql_real_escape_string($id);
      $mysqlRes = mysql_query("SELECT stylePath FROM ".$dbpraefix."custom_css
                              WHERE id = '".$id."'");
      if($row = mysql_fetch_row($mysqlRes)){
        $res = $row[0];
      }
      
      return $res;
    }

  }
?>

Bevor wir das ganze nun im Admin-Bereich einbauen, werden wir erstmal das dort von uns gebrauchte CSS auslagern. Dafür legt mal die Datein /admin/style.css an. Hier habe ich, wenn ich schonmal dabei bin, auch noch #content ein neues Padding zugewiesen. Den #content-Bereich erstellen wir aber erst gleich.

body{
  margin:0;
  padding:0;
  font-family:Tahoma, sans-serif;;
}
label{
  display:block;
}
#adminmenue{
  list-style-type : none;
  margin:0;
  margin-bottom:40px;
  padding:0;
  background-color:#333;
  width:100%;
  height:20px;
}
#adminmenue a{
  color:#fff;
}
#adminmenue li{
  display:inline;
}
thead{
  background-color:#ddd;
  color:#333;
}
fieldset{
  width:50%;
}
fieldset input{
  width:95%;
}
.dbtable{
  font-size:14px;
}
.dbtable thead{
  background-color:#333;
  color:#fff;
}
.dbtable tbody tr:hover{
  background-color:#ddd;
}
img{
  border:0;
}
#content{
  padding:20px;
  padding-top: 5px;
}

Kommen wir zur /admin/index.php. Hier wird nun das CustomCSS angezeigt. Es ist unter dem allgemeinen CSS, damit bestehende Eigenschaften überschrieben werden können. Das #content ist nun ein Div, welches den Bereich unter dem Menü umfasst. Hier ist die komplette Datei:

<?PHP
  session_start();
  function __autoload($class_name){
      require_once "../system/classes/".strtolower($class_name).".php";
  }
  include("../system/dbconnect.php");
  include("../system/settings.php");
  include("../system/filterfilename.php");
  include("../system/sys.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml/" xml:lang="de">
  <head>
    <title>Admin-Bereich</title>
    <link href="/admin/style.css" rel="stylesheet" type="text/css" />
    <?PHP
      CustomCSS::printStylesheet("{admin}/".$_GET['page']);
    ?>
  </head>
  <body>
      <?PHP
        $user = new User();
        if($_POST['user']){
          if($user->login($_POST['user'],$_POST['password'])){
            $_SESSION['username'] = $_POST['user'];
          }
          else{
            echo "<p>Login Fehlgeschlagen!</p>";
          }
        }
    if(isset($_SESSION['username'])){
       Menu::display(Menu::getIdByName("{admin}"),
                     "<ul id="adminmenue">",
                        "</ul>",
                     " <li>",
                     "</li>",
                     "adminmenue");
      if(!$_GET['page']){
        $_GET['page'] = 'dashboard';
      }
      echo "<div id="content">";
      include(filterfilename("includes/".$_GET['page']));
      echo "</div>";
    }
    else{
          include('includes/login.php');
    }
      ?>
  </body>
</html>

Das CSS ist nun für heute erstmal fertig. Kommen wir nun zum Logout, was wir bisher noch nicht gemacht haben. Ihr erinnert euch vielleicht an die Klasse User. Diese bekommt nun eine neue Funktion, welche einfach die Session zerstört und somit den Benutzer ausloggt (/system/classes/user.php):

  function logout(){
    session_destroy();
  }

Nun muss sie noch in der neuen Datei /admin/includes/logout.php aufgerufen werden. Die Variable $user speichert im Admin-Bereich immer den aktuell eingeloggten User. So können wir hier einfach die Methode aufrufen. Dann kommt noch ein Abschlussgruß und die Weiterleitung zum Login:

<h1>Bis zum n&auml;chsten Mal!</h1>
<?PHP
  $user->logout();
?>
<script type="text/javascript">
<!--
setTimeout("self.location.href='/admin/index.php'",1000);
//-->
</script>

Und damit sind wir für heute auch schon durch.

Kommentare

jULiM schrieb am 05.06.2011:

Habe irgendetwas verpasst? Was bedeutet {admin}? Wo wurde es definiert?

Stefan Wienströer schrieb am 08.06.2011:

{admin} sollte mal ein Platzhalter für den Admin-Bereich sein, wird aber in der aktuellen Version auch schon nicht mehr genutzt.

m1staX schrieb am 09.10.2011:

Damit das Beispiel funktioniert muss das Insert-Statement so aussehen: INSERT INTO `cms_custom_css` ( `id` , `stylePath` ) VALUES ( '{admin}/dashboard', '/admin/inettuts.css' );