Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Themes & Theming ›

[gelöst] Zufälliges CSS?

Eingetragen von stixer2 (113)
am 08.05.2015 - 16:49 Uhr in
  • Themes & Theming
  • Drupal 7.x

Hi.

Ich würde gern mehrere CSS erstellen und diese dann zufällig laden lassen. Hintergrund ist, dass ich z.b. 3 Farbvarianten habe…

Hat jemand eine Idee, wie ich das umsetzen kann?

Danke und Grüße!
Alex

‹ Menu items - Markup probleme [gelöst] Zufälliges CSS? ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

Für dein Vorhaben benötigst

Eingetragen von SteffenR@drupal.org (2262)
am 08.05.2015 - 19:09 Uhr

Für dein Vorhaben benötigst du noch nicht einmal mehrere CSS Dateien - hier würde auch eine Datei ausreichen. Das kleine Beispiel über die preprocess_page beschreibt beide Wege.

Du kannst hier einfach in deinem Theme über die Funktion template_preprocess_page eine weiter Klasse auf das HTML Body Element setzen.

<?php

function mytheme_preprocess_html(&$vars) {
 
// Set body class for styling via CSS.
 
$body_classes = array("green", "blue", "red", "white", "black"); 
 
$random_bodyclass = array_rand($input, 1);
 
$vars['classes_array'][] = $random_bodyclass[0];
 
// Or add a custom CSS file to your theme.
 
$theme_path=path_to_theme();
 
drupal_add_css($theme_path.'/css/' . $random_bodyclass[0] . '.css');
}
?>

HIer solltest du aber prüfen, ob dies auch zuverlässig beim Caching der Seite funktioniert - sonst müsstest du den Umweg über Javascript gehen. Hier wäre es dann aber auch möglich dem body Tag eine weitere Klasse zuzufügen.

Über Javascript sieht es ähnlich aus:

(function($) {
Drupal.behaviors.randomBodyClass = {
  attach: function (context, settings) {
    var classes = ["body--green", "body--blue", "body--red", "body--white", "body--black"];
    var randomnumber = Math.floor(Math.random()*classes.length);
    $('body').addClass(classes[randomnumber]);
  }
};
})(jQuery);

Im CSS kannst du dann einfach auf die definierten Klassen zugreifen und dann die verschiedenen Farbvarianten laden lassen.

SteffenR

  • Anmelden oder Registrieren um Kommentare zu schreiben

Super, vielen Dank! Das ist

Eingetragen von stixer2 (113)
am 08.05.2015 - 20:24 Uhr

Super, vielen Dank! Das ist natürlich viel einfacher so…

Beste Grüße!

  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • für drupal11 ein Slider Modul
  • [gelöst] W3CSS Paragraphs Views
  • Drupal 11 neu aufsetzen und Bereiche aus 10 importieren
  • Wie erlaubt man neuen Benutzern auf die Resetseite zugreifen zu dürfen.
  • [gelöst] Anzeigeformat Text mit Bild in einem Artikel, Drupal 11
  • Social Media Buttons um Insteragram erweitern
  • Nach Installation der neuesten D10-Version kein Zugriff auf Website
  • Composer nach Umzug
  • [gelöst] Taxonomie Begriffe zeigt nicht alle Nodes an
  • Drupal 11 + Experience Builder (Canvas) + Layout Builder
  • Welche KI verwendet ihr?
  • Update Manger läst sich nicht Installieren
Weiter

Neue Kommentare

  • melde mich mal wieder, da ich
    vor 3 Tagen 23 Stunden
  • Hey danke
    vor 4 Tagen 17 Stunden
  • Update: jetzt gibt's ein
    vor 5 Tagen 12 Stunden
  • Hallo, im Prinzip habe ich
    vor 1 Woche 2 Tagen
  • Da scheint die Terminologie
    vor 1 Woche 3 Tagen
  • Kannst doch auch alles direkt
    vor 2 Wochen 6 Stunden
  • In der entsprechenden View
    vor 2 Wochen 6 Stunden
  • Dazu müsstest Du vermutlich
    vor 2 Wochen 7 Stunden
  • gelöst
    vor 4 Wochen 3 Tagen
  • Ja natürlich. Dass ist etwas,
    vor 4 Wochen 4 Tagen

Statistik

Beiträge im Forum: 250233
Registrierte User: 20449

Neue User:

  • Mroppoofpaync
  • 4aficiona2
  • AppBuilder

» Alle User anzeigen

User nach Punkten sortiert:
wla9461
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3857
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 13 Gäste online.

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association