COS-Blog

Gewusst wie: Ändern der Darstellung Ihrer Mehr-lesen-Schaltfläche

Zuletzt aktualisiert am: April 29, 2016

So ändern Sie die Darstellung der „Mehr lesen“-Schaltfläche auf Ihrer Blog-Auflistungsseite

Eine Änderung der Darstellung Ihrer „Mehr lesen“-Schaltfläche auf der Blog-Auflistungsseite kann ausgesprochen hilfreich sein, wenn Sie möchten, dass die „Mehr lesen“-Schaltfläche besonders auffällt.

Beispiel

Screen_Shot_2013-09-04_at_1.55.00_PM

Schritt 1

Als Erstes müssen Sie eine CSS-Klasse erstellen, die die Styles für die Mehr-lesen-Schaltfläche enthält.

.read-more-btn{
background: blue;
border-radius: 10px;
color: white;
}
			

Schritt 2

Der zweite Schritt besteht im Hinzufügen der neu erstellten read-more-btn-Klasse zu dem „Mehr lesen“-Link auf der Blog-Auflistungsseite. Gehen Sie zum Vorlagen-Designer und suchen Sie Ihre Blog-Vorlage. Klicken Sie im Blog-Inhaltsmodul auf „Bearbeitungsoptionen“. Daraufhin erhalten Sie eine Eingabeaufforderung mit einigen HTML-Codes. Gehen Sie zur „HTML der Blog-Auflistungsvorlage“ und suchen Sie den folgenden Code:

<a class="more-link" href="">Mehr lesen</a>

Fügen Sie die Klasse read-more-btn zu dem oben genannten Link für „Mehr lesen“ hinzu. Der Code sollte nun wie folgt aussehen:

<a class="read-more-btn" href="">Mehr lesen</a>

Der Screenshot unten zeigt, wie der HTML-Code für die Blog-Vorlage aussieht. Um auf diesen Code zuzugreifen, müssen Sie zum Vorlagen-Designer gehen und die Blog-Vorlage suchen. Nachdem Sie den Code gefunden haben, können Sie mit einem Klick auf „Bearbeitungsoptionen“ einen Bildlauf nach unten zu der Auflistungs-HTML durchführen, um den Mehr-lesen-Link zu suchen.

Screen_Shot_2013-09-04_at_3.33.16_PM