I have a series of lines of text that each begin with a large bullet and space and are seperated by br tags.
br tags are being used because Blogger replaces the p tags with those.
I want to indent any wrapped line of text that does not start with a large bullet character so as to emulate a bulleted list. The wrapped text should line up with the red lines.
Blogger's home page post snippets strip out list tags.
● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>
The home page page used for Blogger accounts shows a small text snippet of each post + the post title and a thumbnail 1st image used in the post.
The snippet widget only recognizes some styling tags, the a tag and the br tag. List tags are stripped out. Blogger replaces p tags with br tags.
I use lists to display my content within posts and want to emulate a list in the snippets. Here is how two vertically stacked lists appear in the home page snippet. This sucks!
I've added a span / section at the beginning of each li with a large bullet inside. This is hidden on the actual post page via code inside the head. The content of this span / section, the large bullet, is shown within the snippet on the home page although the actual span / section tags will be stripped by the snippet. A br tag is added at the end of each li tag to force a new line within the snippet - this br tag does not change the appearance of the actual post.
This emulates the list found on the actual post, but I've not been able to emulate the indentation for any wrapped text.
<b>List Title 1</b>
<ul><div class="outer">
<li><section class="pointer">● </section><i>This is some sample text in the first li tag of the list, with more text to follow..<br>
</li>
</div>
<div class="outer">
<li><section class="pointer">● </section>This is some sample text in the second li tag of the list, with more text to follow. Some more text here as promised.</i>.<br>
</li>
</div>
<div class="outer">
<li><section class="pointer">● </section>This is some sample text in the third li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also.<br>
</li>
</div>
<div class="outer">
<li><section class="pointer">● </section>A similar <i>Seiler</i> This is some sample text in the fourth li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also.<br>
</li>
</div>
<div class="outer">
<li><section class="pointer">● </section>This is some sample text in the fifth li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also. Cemetery.<br>
</li>
</div>
</ul>
I have added 427+ lines of custom code to an exsisting Blogger template.