Widgets an den Seitenrand verschieben

Sebastian_M

Hallo,

ich habe ein Problem mit dem Theme Agama. Ich möchte, dass die rechte Sidebar samt Widgets an den Seitenrand verschoben wird. Sie soll also mit dem Seitenrand rechts abschließen. Die Seite lief vorher unter dem Theme TwentyEleven. Dort habe ich das ohne Probleme hinbekommen. Bei Agama ich habe ich jetzt schon sämtliche Abstandsspielereien im style.css ausprobiert und bin dabei kläglich gescheitert.

Hier der Link zur Seite: https://vs.asta.uni-siegen.de/website/

Außerdem gibt es wohl ein Suchfeld für die Seite, welches im style.css zwar angezeigt wird, aber auf der Seite selbst nicht erscheint. Warum das so ist, ist mir schleierhaft. Im Customizer taucht das Suchfeld auch nicht auf. Ich möchte die Suche gerne unter dem Header platzieren.

Vielen Dank im Voraus für jegliche Hilfe :)

Viele Grüße

Sebastian

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

SirEctor

Um die Widgets an den Rand zu bekommen, müsste relativ viel im Theme umgeschrieben werden. Denn z. B. die Class .vision-row bekommt eine max-width von 1100px. Das verhindert das Verschieben. Wenn man aber die max-width raus nimmt, passt #primary nicht mehr. Das übersteigt eine einfache Hilfe zur Selbsthilfe mMn.

Sailor56

Ja... SirEctor hat da den Punkt getroffen! Das kann eine größere Baustelle werden und jede Änderung an einer Stelle kann an anderen Stellen zu unerwünschten Nebeneffekten führen.
Zusätzliche Komplikationen kommen hinzu, dass viele Dinge absolut positioniert sind und mit JavaScript einiges an den Formaten geändert wird, wenn die Seite scrolled.

Aber einen Versuch könnte man ja starten. Teste bitte mal folgendes in deinem 'zusätzlichen CSS' (vom Dashboard -> Design -> Customizer -> zusätzliches CSS)

HTML

@media screen and (min-width: 1100px) {
.vision-row {
  max-width: 100%;
}
.article-wrapper {
  margin-right: 1% !important;    
  }
#content div.article-wrapper:nth-child(2) {
  left: 31% !important;
}
#content div.article-wrapper:nth-child(3) {
  left: 62% !important;
}


#secondary {
  float: right;
  text-align: right;
}
}

Alles anzeigen

Wenn es nicht funktioniert und/oder deinen Erwartungen nicht entspricht, kannst du es ja ohne Nebenwirkungen gleich wieder löschen!

Sebastian_M

Hab vielen Dank! Es hat nicht ganz so geklappt, wie ich mir das eigentlich vorgestellt hatte, sieht aber dennoch so gut aus, dass ich es lassen werde :)

SirEctor

Das kann bei einem Grid-Style so nicht funktionieren. Außerdem bekommt nur das 2te und 3te Element andere Werte. Die nachfolgenden werden nicht berücksichtigt. Das sieht man auch, da sie jetzt ineinander ragen.

Lass die left-Angaben einfach ganz weg. Das wird durch die width und margin geregelt.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Widgets an den Seitenrand verschieben

Jetzt mitmachen!