Index HowTo – Post-Snippet and Post-Thumbnail

Sometimes it's convenient to control a post's text and/or image excerpt for index view, regardless of its actual content. To be clear, this methode is just a visual facade and utilizes only css properties to become hidden in post view.

---

Index-Snippets consist of textnodes only and are limited to a specific amount of the first characters. For effective use it's recommended to strip unecessary whitespace, e.g. markup indentations.

Situation

Following we have text content only, no media content available.

<div class="separator cover-item none-cover" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAc5pFE6rEHtbj9F-r_hsG-BzSnqRtXGeu766Dxny-lYlI-KDnhvVxoZMwI62z5Tk8a9dwKyp5cm73HkDizry09lLuYvlUepnywehc4M5yEFDtTnQMu6LoYCrCJtyA2OlkcPDXWzZFiYiv/s1600/landscape_gray_5.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;">
<img border="0" data-original-height="512" data-original-width="1024" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAc5pFE6rEHtbj9F-r_hsG-BzSnqRtXGeu766Dxny-lYlI-KDnhvVxoZMwI62z5Tk8a9dwKyp5cm73HkDizry09lLuYvlUepnywehc4M5yEFDtTnQMu6LoYCrCJtyA2OlkcPDXWzZFiYiv/w800-h534-p-k-no-nu/landscape_gray_5.png" />
</a>
<span>Sometimes it's convenient to control a post's text and/or image excerpt for index view, regardless of its actual content. To be clear, this methode is just a visual facade and utilizes only css properties to become hidden in post view.</span>
</div>

cover-item none-cover

---

Index-Snippets consist of textnodes only and are limited to a specific amount of the first characters. For effective use it's recommended to strip unecessary whitespace, e.g. markup indentations.