Replacing Tumblr’s Missing Paragraphs

matthewb:

When generating page markup, Tumblr’s template engine outputs any single line (or paragraph) entered into its source, caption or description fields without any containing elements (ie, no <p> tags). Containing elements are only added when there is at least two lines of copy, separated by a blank line.

Although this behaviour is commonplace in text-to-HTML converters, it can prove troublesome when your CSS expects consistent markup in all cases. Here’s a little piece of jQuery magic I wrote to solve this issue for a new theme I’m working on:

    $(".content:not(:has(p,ol,ul,dl,blockquote))")
        .wrapInner("<p></p>");

It looks for every element with a class of (in my case) content, checks to see if the element contains any of five common block-level children, and if not, wraps the content in a paragraph tag. You’ll need at least jQuery 1.3 for this selector combination to work.

1. haydenhunter liked this
2. jbrewer liked this
3. dannygarcia liked this
4. jerrybrito liked this
5. ferrydust liked this
6. trey liked this
7. pilnick liked this
8. johnburke liked this
9. paulgiacherio liked this
10. jarredbishop liked this
11. toyra liked this
12. nttm liked this
13. rinsespin liked this
14. esquareda liked this
15. dannygarcia reblogged this from matthewb
16. evanwalsh liked this
17. jonic liked this
18. bsag reblogged this from matthewb and added:

    Useful. The missing...tags on the automatically imported Twitter fed has irritated me

19. brier liked this
20. dydric liked this
21. michaellynton liked this
22. petervidani liked this
23. pierreism liked this
24. mattschwarz reblogged this from matthewb
25. mattschwarz liked this
26. jennul liked this
27. shabdar reblogged this from matthewb
28. acc liked this
29. thebronzemedal liked this
30. sneak liked this
31. topherchris liked this
32. svnlto liked this
33. copacetic reblogged this from matthewb
34. copacetic liked this
35. minorjive reblogged this from matthewb
36. matthewb posted this