Kleine Schönheitsfehler im Blog

[rodriguez]

Dann solltest du vielleicht ein paar deiner "besten Foodfotos" auch auf deiner eigenen Seite veröffentlichen. Damit ich als potentieller Kunde auch Lust bekomme einen Blogeintrag bei dir zu kaufen ...

 

[thobie]

Das Thema des Namens der Website ist, wie leicht zu verstehen ist, Nudeln, Fleisch und Sosse. Ich habe dazu in meinem alten Foodblog genau 10 Fotos gefunden, die thematisch passen und optisch ansprechend sind. Ich lasse alle 10 Fotos zufällig auf der Startseite einblenden.

Zum einen ist bei dem schmalen Ausschnitt der Fotos die Präsentation der drei kulinarischen Produkte schwierig. Zum anderen habe ich einen bestimmten Fotografierstil, der dem einen gefällt, dem anderen nicht. Ich habe keine Studioküche für gestylte Foodfotos, in denen z.B. für bessere Optik Rasiercreme anstelle aufgeschlagene Sahne verwendet wird. Außerdem lehne ich solche Fotos ab. Sie spielen nur eine Gegebenheit vor, die niemand hat und niemand will. Ich fotografiere ein Gericht einmal im Vollformat, einmal aus der Nähe im Detail. Fertig.

 

[Veritas]

Ich habe keine Studioküche für gestylte Foodfotos, in denen z.B. für bessere Optik Rasiercreme anstelle aufgeschlagene Sahne verwendet wird.

Und keiner sagt, dass man das benötigt. Schöner Untergrund, etwas Mühe geben, natürliches Licht und fertig.

 

[Ciccio]

Das Thema des Namens der Website ist, wie leicht zu verstehen ist, Nudeln, Fleisch und Sosse. Ich habe dazu in meinem alten Foodblog genau 10 Fotos gefunden, die thematisch passen und optisch ansprechend sind. Ich lasse alle 10 Fotos zufällig auf der Startseite einblenden.

Zum einen ist bei dem schmalen Ausschnitt der Fotos die Präsentation der drei kulinarischen Produkte schwierig. Zum anderen habe ich einen bestimmten Fotografierstil, der dem einen gefällt, dem anderen nicht. Ich habe keine Studioküche für gestylte Foodfotos, in denen z.B. für bessere Optik Rasiercreme anstelle aufgeschlagene Sahne verwendet wird. Außerdem lehne ich solche Fotos ab. Sie spielen nur eine Gegebenheit vor, die niemand hat und niemand will. Ich fotografiere ein Gericht einmal im Vollformat, einmal aus der Nähe im Detail. Fertig.

@thobie,

trotzdem soll doch das, was du fotografierst, dazu anregen, es nachzukochen und zu essen, oder?
Wenn du in deinem Archiv keine besseren Foros findest als die, welche du aktuell benutzt, musst du halt neue Bilder machen ...


Gruss, Ciccio

 

[thobie]

Und keiner sagt, dass man das benötigt. Schöner Untergrund, etwas Mühe geben, natürliches Licht und fertig.

Das wird alles beachtet. Stoffhintergrund, um die marode Fensterbank und die waagrechte Kante wegzunehmen, viel Mühe und ein Beleuchtungsmittel auf der Kamera, um die Motive gut auszuleuchten. Natürlich mit entsprechendem Weißabgleich und ausgemessenen Lichtverhältnissen mit einer Graukarte.

 

[thobie]

@thobie,
trotzdem soll doch das, was du fotografierst, dazu anregen, es nachzukochen und zu essen, oder?
Wenn du in deinem Archiv keine besseren Foros findest als die, welche du aktuell benutzt, musst du halt neue Bilder machen ...
Gruss, Ciccio

Das dauert zu lange, deswegen Rückgriff auf bereits vorhandene, um die Site fertig zu stellen.

 

[tehabe]

Ist nicht der Sinn eines Foodsblogs, dass du Essen zeigst, welches du aktuell zubereitest oder gerade zubereitet hast und darüber berichtest bzw. das Rezept zu teilen? Das ist zumindest was ich erwarten würde, wenn ich ein Foodblog öffne.

 

[thobie]

Ich habe jetzt den CSS Code in der style.css im Parent Theme wieder auf text-transform:capitalize gesetzt, denn bei jedem Update des Themes würde dies ja automatisch wieder so geschehen.

Dann das Child Theme aktiviert. Und im Quellcode die Klasse des Metatags „Hinterlasse einen Kommentar“ identifiziert. Es ist comments-link a.

Diese kann ich testweise ausblenden, um zu prüfen, ob ich auch das richtige Element anspreche.

Aber ich kann nicht die Texttransformation ausschalten, da reagiert die Klasse nicht drauf. Vermutlich wegen des übergeordneten CSS Code im Parent Theme.

Ich habe nur mit dem folgenden Code Erfolg:

.comments-link a{
    text-transform: none!important;
}

Gibt es eine andere Lösung?

 

[thobie]

Ist nicht der Sinn eines Foodsblogs, dass du Essen zeigst, welches du aktuell zubereitest oder gerade zubereitet hast und darüber berichtest bzw. das Rezept zu teilen? Das ist zumindest was ich erwarten würde, wenn ich ein Foodblog öffne.

Korrekt. Das ist der Sinn und Zweck eines Foodblogs. Dazu veröffentliche ich jeden zweiten Tag in meinem (alten) Foodblog ein Rezept mit zwei (professionellen) Foodfotos. Das neue Foodblog ist nur aus dem Problem heraus entstanden, dass die Datenbank des alten Foodblogs die Speichergrenze überschritten hatte (Datenmüll aus u.a. Statistik- und Sicherheitsplugins) und ich zur Vorsicht bei einer freien Domain noch das neue Foodblog eingerichtet habe.

 

[Ciccio]

Das dauert zu lange, deswegen Rückgriff auf bereits vorhandene, um die Site fertig zu stellen.

@thobie,

mit diesem Anspruch "dauert zu lange" stellst du meine Auffassung von Professionalität auf die Probe ...
Ich kenn Leute, die fotografieren ihr Essen, ohne dass es kalt wird
Es gibt ein italienisches Sprichwort:
Gott hat die Zeit erfunden, von Eile hat er nichts gesagt.

Gruss, Ciccio

 

[Difool]

Aber ich kann nicht die Texttransformation ausschalten, da reagiert die Klasse nicht drauf. Vermutlich wegen des übergeordneten CSS Code im Parent Theme.

Ich habe nur mit dem folgenden Code Erfolg:

.comments-link a{
    text-transform: none!important;
}

Gibt es eine andere Lösung?

Es sind hier, wie bereits angemerkt mehrere „Klassen-Selektoren“ gesetzt.
Wenn du dies berücksichtigst, dann greift es auch ohne ein !important.

Dies ist der Abschnitt insgesamt vom originalen CSS:

.blog-grid .byline a,
.blog-grid .comments-link a,
.blog-grid .cat-links a,
.blog-grid .tag-links a,
.single-blog .byline a,
.single-blog .comments-link a,
.single-blog .cat-links a,
.single-blog .tag-links a {
    color: #7f7f7f;
    font-size: 14px;
    text-transform: capitalize;
}

Möchtest du jetzt nur explizit alle Vorkommen vom Klassen-Selektor .comments-link a ansprechen, dann in dessen Kaskade (Vererbung).
Es sind soweit 2 ersichtlich:

.blog-grid .comments-link a,
.single-blog .comments-link a {
  text-transform: none;
}

Und damit sollten beide Vorkommen von .comments-link a angesprochen und überschrieben werden.

Weil wie zuvor gesagt, greift „nur“ der einzelne gesetzte Klassen-Selektor hier nicht, weil dieser in Kaskadierung gesetzt ist –
und damit eine höhere Wertigkeit / Gewichtung als der „einzelne“ Klassen-Selektor hat.
Den du so nur mit der Brechstange !important ansprechen kannst, wenn du die höhere Spezifität (höhere Wertigkeit / Gewichtung) ignorierst.

Beispiel:

.gewicht a {
  text-transform: none;
}

.mehr .gewicht a {
  text-transform: none;
}

.viel .mehr .gewicht a {
  text-transform: none;
}

 

[thobie]

Möchtest du jetzt nur explizit alle Vorkommen vom Klassen-Selektor .comments-link a ansprechen, dann in dessen Kaskade (Vererbung).
Es sind soweit 2 ersichtlich:

.blog-grid .comments-link a,
.single-blog .comments-link a {
  text-transform: none;
}

Danke. Funktioniert. Jetzt auch ohne !important. Das mit der Kaskade kenne ich so noch nicht so ganz ausführlich. Ich muss mich da jetzt doch mal einlesen.

 

[Difool]

Danke. Funktioniert. Jetzt auch ohne !important. Das mit der Kaskade kenne ich so noch nicht so ganz ausführlich. Ich muss mich da jetzt doch mal einlesen.

Merke:
Von oben nach unten von leicht zu schwer = Spezifität, yeah!

Lies dir mal diesen kurzen Artikel von Jonas durch:
https://kulturbanause.de/blog/css-spezifitat/#h-css-spezifitat

Und dies als Bookmark: https://josh.github.io/css-explain/
Damit bekommst du anhand deines CSS-Selektors u.a. dessen Gewichtung berechnet.

Hier die generellen Standard-Gewichtungen von Selektoren für Browser:

    HTML-Elemente (z.b. h1, p, blockquote ) = 1 Punkt
    CSS-Klassen (z.B. .alert, .js) = 10 Punkte
    Pseudo-Klassen/Elemente (z.B. :nth-of-type) = 10 Punkte
    CSS-IDs (z.B. #container, #header) = 100 Punkte
    Inline-Styles (z.B. <h1 style="color: red;"></h1>) = 1000 Punkte
    !important - gewinnt immer, es sei denn mehere Selektoren haben ein !important erhalten.