WidgetTypes (CMS)

Auf dem Dashboard unseres CMS gibt es sie bereits: Die Widgets. In Zukunft plane ich den Einsatz der Widgets auszubauen. Dies werden wir auch für unser neues Backend benötigen. Als erstes gibt es heute so genannte WidgetTypes. Derzeit werden unsere Widgets ja mit einer schönen Umrandung und der Möglichkeit zum Farbwechseln angezeigt. Später soll es aber auch im FrontEnd verwendet werden könne (zum Beispiel auch ohne die Drag & Drop Funktion). So kann man sich damit seine Sidebar o.Ä. aufbauen.

Die Umrandungen der Widgets sind jetzt die WidgetTypes. Jeder Typ hat sein eigenes Template im Verzeichnis /system/templates/widgets. Fangen wir an mit dem derzeitigen /system/templates/widgets/dashboard.html:

<li class="widget color-{VAR:COLOR}">
  <divclass="widget-head">
    <h3>{VAR:HEADLINE}</h3>
  </div>
  <divclass="widget-content">
    {VAR:CONTENT}
  </div>
</li>

Und als Default wird dieser hier genommen: /system/templates/widgets/default.html:

<h3>{VAR:HEADLINE}</h3>
<div>
  {VAR:CONTENT}
</div>

Die Templates werden nun in der abstrakten Klasse /system/classes/widgetbase.php ausgelesen:

<?PHP abstract class WidgetBase{public $color              = "white";public $headline = "";public $content = "";public $minwidth = -1;public $maxwidth = -1;public $minheight = -1;public $maxheight = -1;public $displayType = "default";public $allowDisplayRandom =true;public function display(){$template =new Template();$template->load("widget_".$this->displayType);$template->assign_var("COLOR",$this->color);$template->assign_var("HEADLINE",$this->headline);$template->assign_var("CONTENT",$this->content);$template->assign_var("MINWIDTH",$this->minwidth);$template->show_if("HASMINWIDTH",$this->minwidth != -1);$template->assign_var("MAXWIDTH",$this->maxwidth);$template->show_if("HASMAXWIDTH",$this->maxwidth != -1);$template->assign_var("MINHEIGHT",$this->miheight);$template->show_if("HASMINHEIGHT",$this->minheight != -1);$template->assign_var("MAXHEIGHT",$this->maxheight);$template->show_if("HASMAXHEIGHT",$this->maxheight != -1);$template->output();
    }public abstract function load();
  }
?>

So kann man zum Beispiel später bei Bannern o.Ä. festlegen, dass der Bereich, in dem das Widget angezeigt wird eine bestimmte Größe haben muss.

Da wir für die Widget-Templates einen neuen Namespace verwenden, müssen wir den auch in der /system/classes/template.php einbauen:

          else{$res .= "/system/templates/controls/".$namespaces[1].".html";
          }$imported =true;
        }
        else if($namespaces[0] == "widget"){
          if(file_exists(getSetting("global","global","root")."/system/skins/".$skin."/templates/widgets/".$namespaces[1].".html")){$res .= "/system/skins/".$skin."/templates/widgets/".$namespaces[1].".html";
          }
          else{$res .= "/system/templates/widgets/".$namespaces[1].".html";
          }$imported =true;
        }
      }
      if(!$imported){

Zu guter letzt müssen wir im /system/classes/dashboard.phpnoch den Typ dashboard festlegen. Das geht so:

          <?PHP
            if($this->cols[$id]){foreach($this->cols[$id]as $widget){$widget->displayType = "dashboard";$widget->display();
              }
            }
          ?>

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project