Style.css änderungen zeigen keine Wirkung?

m4soN

Hallo zusammen,

bin jetzt nicht so der erfahrene WP Nutzer, aber ich habe ein paar Änderungen im Style.css von einem Template vorgenommen die sich auf der Startseite nicht nachvollziehen lassen.

Ich bin mir allerdings totsicher dass sie veränderungen mit sich bringen müssten.

Installation ist http://www.dr-killus.de/drkillus/

Gibt es soetwas wie einen Schreibschutz? Wenn ja, wie behebe ich ihn?

Und kann ich mir irgendwie ganz simpel ableiten welche Werte was genau bedeuten, so dass ich mir leichter ableiten kann was sich verändern würde?

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

Monika

Zitat von m4soN

Hallo zusammen,
bin jetzt nicht so der erfahrene WP Nutzer, aber ich habe ein paar Änderungen im Style.css von einem Template vorgenommen die sich auf der Startseite nicht nachvollziehen lassen.
Ich bin mir allerdings totsicher dass sie veränderungen mit sich bringen müssten.
Installation ist http://www.dr-killus.de/drkillus/
Gibt es soetwas wie einen Schreibschutz? Wenn ja, wie behebe ich ihn?
Und kann ich mir irgendwie ganz simpel ableiten welche Werte was genau bedeuten, so dass ich mir leichter ableiten kann was sich verändern würde?

Alles anzeigen

wo und wie und welche Änderungen hast du vorgenommen?

lädst du die css via FTP greift kein Schreibschutz,
magst du via Dashboard Änderungen an der CSS machen und besteht ein Schreibschutz, dann siehst du das unterhalb des Files, das du ändern möchtest
Dashboard => Design => Editor

unabhängig, dass selbst ich niemals via Dashboard irgendein File editiere...
ist zu fehleranfällig und unsicher.

m4soN

Ah ok. Ich bin tatsächlich hergegangen und habe alle Änderungen über den Editor im Dashboard ausgeführt. Dann wohl doch lieber via FTP. Damit ist mir doch schon mal geholfen.

Wie verhält es sich mit meiner anderen Frage? Gibt es irgendeine Möglichkeit zb in der linken Bildhälfte mir den Code von der CSS anzusehen und rechts dann quasi in "Live" zu sehen was der Code "darstellt"?

Marcus[IS]

Zitat

[COLOR=#333333]Wie verhält es sich mit meiner anderen Frage? Gibt es irgendeine Möglichkeit zb in der linken Bildhälfte mir den Code von der CSS anzusehen und rechts dann quasi in "Live" zu sehen was der Code "darstellt"?[/COLOR]

Ja, dafür gibt es in den Browsern die Entwicklertools. Damit kannst du die Elemente deiner Webseite untersuchen und bekommst auch angezeigt, welche CSS Anweisungen hierfür greifen. Ist, wie du schon selber richtig vermutest sehr hilfreich, wenn man Änderungen machen möchte und Testen will, wie man das am besten dann umsetzt. Ist aber nur Temporär, also musst du die gewünschte Änderung in der style.css per Texteditor machen und diese dann hochladen.

m4soN

Letzte Frage. Was sind für euch Entwicklertools im Browser? Extra Addons? Wenn ja, welche zb?

Denn wenn ich zb im Chrome den Seitenquelltext anzeigen lasse, dann bekomme ich nur eine komplette Seite mit dem Code, nicht aber die Optik was Zeile X gerade tatsächlich auf der Page darstellt.

Monika

Zitat von m4soN

Letzte Frage. Was sind für euch Entwicklertools im Browser? Extra Addons? Wenn ja, welche zb?
Denn wenn ich zb im Chrome den Seitenquelltext anzeigen lasse, dann bekomme ich nur eine komplette Seite mit dem Code, nicht aber die Optik was Zeile X gerade tatsächlich auf der Page darstellt.

developer extension
naja zumindest heißt es unter Chrome "extension"
unter Firefox ADD ON ;)

Marcus[IS]

Unter Chrome musst du das Menü oben Rechts (das Symbol mit den Drei Balken) anklicken und dann unter Tools auf Entwicklertools gehen. Dann öffnen sich die Extra Fenster.

Oder du klickst einfach auf der Webseite auf das gewünschte Element mit der Rechten Maustaste und wählst aus dem Kontext Menü den Punkt Element untersuchen.

Edit;
Oder so wie Monika beschrieben hat, wenn man die Englische Version Einsetzt. ;)

Putzlowitsch

Für Chrome oder Firefox braucht man keine Add-Ons oder Extensions. Die Entwicklertools sind bereits integriert. Man kann sie mit Strg+Umsch+I aufrufen.

Gruß
Ingo

m4soN

Habt ihr noch einen hilfreichen Tipp wie ich die richtigen Werte in einem Template finden kann?

Ich möchte ein kostenloses Template verändern und teilweise Linkfarben, Logogröße etc in Angriff nehmen. Wenn ich jetzt per Chrome und Entwicklertool mir die Seite aufrufe und ein Element untersuche, dann hab ich es bis jetzt noch nicht geschafft den passenden Abschnitt zu Schriftfarbe oder Logo Position ausfindig zu machen.

In der CSS ist oben eine Agenda zu Punkten wie Header, Typographie etc, aber für mich richtig ersichtlich sind keine der besagten Werte.

Gibt es denn außer der CSS evtl andere Dateien in denen soetwas definiert worden sein kann? Ich dachte in meinem Anfängerdenken bisher immer dass sowas nur in der CSS definiert wird.

Oder um die Frage vllt noch etwas anders zu formulieren, wie lerne ich denn die CSS von so einem Template richtig zu lesen?

Da stehen Dinge wie sup, mark, ins usw usf und ich kann mir darunter (noch) nichts vorstellen. Wo kann ich mir so ein Wissen anlesen?

Fsb311

Das ist nicht ganz einfach. Da mußt Du probieren. Ich habe auch mal lange Zeit an so einer css gespielt. Dann war es so wie ich es haben wollte. Dann kam eine Aktualisierung für das Themes und alles war weg.
Damit das nicht Passiert : setze hinter jeder Änderung die Du machst ein ! important. Beispiel:
. Site-Header { Color: # FFOODD ! important ; }
Das bewirket das die Zeile nicht bei Aktualisierung überschrieben wird.

Und ich habe mir immer erst mal Markierungen an den Stellen wo ich geändert habe gesetzt. Dann konnte ich die Bereiche ohne weiteres wieder finden. Beispiel:
. Site-Header { Color: # FFOODD ! important ; }. // änderung von #cdcdcd ;

Irgendwann brauchst Du das nicht mehr. Aber es kann helfen.
Viel erfolg weiterhin.
////Thorsten

Kai Nehr

Tipp eins: ein Programm zum direkten Editieren von Dateien auf dem Server verwenden, zB. PSPad (Du änderst Werte in der style.css, speicherst und siehst Dir die Wirkung per Reload im Browser an, geschieht direkt über ftp, Du sparst Dir das ewige Neuhochladen von Hand)

Tipp zwei: Hier kann man (fast) alles nachlesen über CSS und welche Styles es gibt: http://wiki.selfhtml.org/wiki/CSS/Eigenschaften

Tipp drei: Auf Deiner Webseite über bestimmten Elementen (Überschrift, Bild, Textblock etc.) die rechte Maustaste klicken, mit "Element untersuchen" lassen sich Rückschlüsse ziehen über id oder class des Elementes (und Werte, die in der style.css stehen)

lg
.k

Monika

Zitat von Kai Nehr

Tipp eins: ein Programm zum direkten Editieren von Dateien auf dem Server verwenden, zB. PSPad ..............

Achtung der Download von PSPAD ist mit unerwünschter Wrbung kontaminiert, die allerdings entfernbar ist....

Kai Nehr

Ach Du Schreck! Stimmt, also Vorsicht bei CHIP-, Computerbild-Downloads etc.
Sorry, war keine Absicht!

Ich glaube direkt von der Entwicklerseite kann man noch ohne "Nebenprogramme" installieren bzw. vor der Installation abwählen.

lg
.k

m4soN

Jetzt brauch ich bitte doch noch mal eure Hilfe.

Wenn ich mit Chrome oder Firefox unter http://www.dr-killus.de/drkillus/ bei den Seitenüberschriften wie zb bei Leitgedanken in dem grauen Balken zu sehen, auf Inspect gehe, dann bekomme ich einen Block der

[COLOR=#303942][FONT=Menlo][COLOR=#808080]media="all"[/COLOR]

[COLOR=#888888][COLOR=#222222].header-title[/COLOR][/COLOR] {

[/FONT][/COLOR]

[COLOR=#C80000]background[/COLOR]: #f7f7f7;
[COLOR=#C80000]padding[/COLOR]: 10px 15px;
[COLOR=#C80000]display[/COLOR]: block;
[COLOR=#C80000]margin-top[/COLOR]: -40px;
[COLOR=#C80000]margin-bottom[/COLOR]: 60px;
[COLOR=#C80000]border[/COLOR]: solid 1px #eee;
[COLOR=#C80000]border-top[/COLOR]: none;
[COLOR=#C80000]font-size[/COLOR]: 30px;
[COLOR=#C80000]color[/COLOR]: #777777;
[COLOR=#C80000]max-width[/COLOR]: 1115px;
[COLOR=#C80000]margin-left[/COLOR]: 15px;

[COLOR=#303942][FONT=Menlo]}

zb. das hier beinhaltet. Wenn ich danach in der Style.css von dem Template suche, finde ich davon überhaupt nichts.

Wo sind denn diese Werte alle versteckt??? Ich würde nämlich genau diese gerne überarbeiten. Was mache ich falsch?

Edit: Habe gerade selbst in einem der Kästchen oben rechts etwas von main.css gelesen? Von der lese ich gerade zum ersten mal. Wo liegt denn die?[/FONT][/COLOR]

Monika

Zitat von Kai Nehr

Ach Du Schreck! Stimmt, also Vorsicht bei CHIP-, Computerbild-Downloads etc.
Sorry, war keine Absicht!
Ich glaube direkt von der Entwicklerseite kann man noch ohne "Nebenprogramme" installieren bzw. vor der Installation abwählen.
lg
.k

nein genau dort habe ich mir so einen bösen Buben eingefangen :(

Monika

Zitat von m4soN

Jetzt brauch ich bitte doch noch mal eure Hilfe.
Wenn ich mit Chrome oder Firefox unter http://www.dr-killus.de/drkillus/ bei den Seitenüberschriften wie zb bei Leitgedanken in dem grauen Balken zu sehen, auf Inspect gehe, dann bekomme ich einen Block der
[COLOR=#303942][FONT=Menlo][COLOR=#808080]media="all"[/COLOR]

[COLOR=#888888][COLOR=#222222].header-title[/COLOR][/COLOR] {
[/FONT][/COLOR]
[COLOR=#C80000]background[/COLOR]: #f7f7f7;
[COLOR=#C80000]padding[/COLOR]: 10px 15px;
[COLOR=#C80000]display[/COLOR]: block;
[COLOR=#C80000]margin-top[/COLOR]: -40px;
[COLOR=#C80000]margin-bottom[/COLOR]: 60px;
[COLOR=#C80000]border[/COLOR]: solid 1px #eee;
[COLOR=#C80000]border-top[/COLOR]: none;
[COLOR=#C80000]font-size[/COLOR]: 30px;
[COLOR=#C80000]color[/COLOR]: #777777;
[COLOR=#C80000]max-width[/COLOR]: 1115px;
[COLOR=#C80000]margin-left[/COLOR]: 15px;

[COLOR=#303942][FONT=Menlo]}
zb. das hier beinhaltet. Wenn ich danach in der Style.css von dem Template suche, finde ich davon überhaupt nichts.
Wo sind denn diese Werte alle versteckt??? Ich würde nämlich genau diese gerne überarbeiten. Was mache ich falsch?
Edit: Habe gerade selbst in einem der Kästchen oben rechts etwas von main.css gelesen? Von der lese ich gerade zum ersten mal. Wo liegt denn die?[/FONT][/COLOR]

Alles anzeigen

wenn ich mir das im Quelltext ansehe finde ich das da

HTML

<div class="entry-content">
        <h1 style="text-align: center;"><span style="color: #e39353;">Schön dass Sie sich für die Psychotherapeutische ............... interessieren<br />
</span></h1>
<p><span style="color: #e39353;"> </span></p>
<p style="text-align: justify;">Schön, dass Sie auf meine Webseiten gefunden haben! Damit haben Sie schon den ersten Schritt getan. ..................</p>
<p style="text-align: left;">
<p style="text-align: justify;">Ich glaube, dass jeder Mensch grundsätzlich übe................</p>
<p>&nbsp;</p>

und das Willkommen findest du mit

<div class="header-title col-md-12">
Willkommen...

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Style.css änderungen zeigen keine Wirkung?

Jetzt mitmachen!

Benutzer online in diesem Thema