If you keep up with my posts, you'll know I'm a big fan of graceful degradation when it comes to JavaScript. For me, graceful degradation means two things:<\/p>\n
A search engine is like a non-javascript user in many ways, as it crawls content without applying any javascript (or css) to it.<\/p>\n
With that aside, I thought I'd toss out another method of collapsing content while adhering to rules of graceful degradation. Sometimes we find our unordered or ordered lists get a little lengthy. Instead of paginating or truncating them, you can "collapse" them with just a few lines of jQuery:<\/p>\n
\t$('li span').click(function() { If you keep up with my posts, you'll know I'm a big fan of graceful degradation when it comes to JavaScript. For me, graceful degradation…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"amp_status":""},"categories":[5],"tags":[183],"_links":{"self":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/670"}],"collection":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/comments?post=670"}],"version-history":[{"count":1,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/670\/revisions"}],"predecessor-version":[{"id":671,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/posts\/670\/revisions\/671"}],"wp:attachment":[{"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/media?parent=670"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/categories?post=670"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.sitekickr.com\/blog\/wp-json\/wp\/v2\/tags?post=670"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}$('ul').each(function() {
\n\t if($(this).find('li').length > 1)
\n\t $(this).find('li:first').
\n\t append('<span>more…<\/span>').
\n\t siblings().hide();
\n\t});<\/p>\n
\n\t $(this).parent().siblings().toggle();
\n\t});
\n\t<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"