Hand-picked content at the top of a chronologically sorted view: Option 1, make it Sticky!

<p><span class="drop-cap">E</span>very time that I have to implement a <strong><em>list of articles, sort them by created date and also allow our content editors to override that order by selecting which articles go at the top of the list</em></strong> I need to sit back and think for a minute about the best implementation for that particular case. I realized today, discussing this with my coworker and friend Uriel, that <em>I’ve done this differently many times</em>. That doesn’t mean <em>all but one</em> implementations were wrong. Some implementations had advantages over the others for each special case. </p> <p>Without further ado, we came up with this <a href="https://www.youtube.com/watch?v=4kg9LasvLFE"><em>one way or another</em></a> series (I hope the song gets stuck into your heads as well), to approach common issues and solve them in different ways, weighing their pros and cons, and showing quick tutorials on each approach. </p> <p>Today is the turn of the checkbox<strong><em> Sticky</em></strong>! </p> <ul> </ul> <p>"Sticky at top of lists" is a checkbox on the promotion options of your content edit page. It's easy to set up and It is a good option, when for example a content manager wants to display one article (or any content type of their choice) in a special page and have the option to override it and showcase one hand-picked node at times.</p> <p>Here's how it's done: I’ll start by creating a view that displays <strong>one</strong> article:</p> <p><img alt="Create a view of type Page, that displays only one Article tagged with the term Animals." data-entity-type="file" data-entity-uuid="9a4de577-c1d1-4b55-8874-9cd61b4ec4cc" src="/sites/default/files/inline-images/sticky_01_create_view.png" width="991" height="1282" loading="lazy" /></p> <p>You'll notice that I also added a filter by term "animals". This is because I created a few simple articles to test the view with that term. Nothing special.</p> <p>Back to the view: we want to prioritize the contents marked as <em>sticky</em>, so we'll add a <strong>"Sticky at top of lists" sort criteria</strong> to our view, and set it to <strong>descending</strong> order:</p> <p><img alt="Add a sort criteria on the view edit page." data-entity-type="file" data-entity-uuid="9c144c88-5cf6-4ee4-a366-61e388766fd9" src="/sites/default/files/inline-images/sticky_02_add_sort_criteria_0.png" width="991" height="893" loading="lazy" /></p> <p><img alt="Select &quot;Sticky at top of lists&quot;" data-entity-type="file" data-entity-uuid="197510b1-4a28-4d9e-a2d1-a0b06dbdefa8" src="/sites/default/files/inline-images/sticky_03_add_sort_criteria.png" width="915" height="608" loading="lazy" /></p> <p><img alt="Set the order to &quot;descending&quot;" data-entity-type="file" data-entity-uuid="5123f0b3-4253-4794-98aa-a96c84006441" src="/sites/default/files/inline-images/sticky_04_add_sort_criteria.png" width="915" height="608" loading="lazy" /></p> <p>After that, we need to rearrange the sort criteria. Do not forget this step! It's crucial to this feature, that the Sticky sort criteria gets applied <em>before</em> the rest of the criteria. This is done by clicking on the little arrow next to “Add” and clicking on “Rearrange”.</p> <p>What this does, is that the view will first sort by Sticky (has sticky first, doesn't have sticky next), and if there is a tie (more than one article has the Sticky checkbox on), it will sort those tied articles by "Authored on" date.</p> <p><img alt="Rearrange the sort options, so that the sticky sort option gets applied first." data-entity-type="file" data-entity-uuid="33b7c49c-9841-4212-a031-935cfe056f14" src="/sites/default/files/inline-images/sticky_05_rearrange_sort_criteria.png" width="915" height="608" loading="lazy" /></p> <p>Now the view is finished. To test this, I have two Articles with pictures of animals in them (and tagged them with the Animals term). The first (and therefore oldest) article has a bunny, and the newest has an elephant. None of the articles is marked <em>sticky</em> yet.</p> <p>The first result of the page is The polar bear, since it's the newest content.</p> <p><img alt="The view displays an article with a Polar bear." data-entity-type="file" data-entity-uuid="103d1e30-dfc9-4b03-b107-7de63ff21167" src="/sites/default/files/inline-images/sticky_06_results.png" width="915" height="608" loading="lazy" /></p> <p>Then I edited another article, The rabbit, and marked it as sticky on the promotion options. Notice that, to be able to access the promotion options, an admin has to allow it on the content type first at <strong>Structure</strong> &gt; <strong>Content types</strong> &gt; <strong>Article</strong> (or your content type) &gt; <strong>Edit</strong>.</p> <p><img alt="The article with the bunny is now marked as sticky." data-entity-type="file" data-entity-uuid="cf9528ab-c5fe-45e5-a9e9-0975a1066018" src="/sites/default/files/inline-images/sticky_07_rabbit_sticky.png" width="915" height="1124" loading="lazy" /></p> <p>The view gets updated, and displays the rabbit instead of the elephant, because the rabbit is marked sticky!</p> <p><img alt="The view now displays the rabbit article." data-entity-type="file" data-entity-uuid="bd6a2ba4-2585-440c-9a1b-a28efd702d8d" src="/sites/default/files/inline-images/sticky_08_rabbit_result.png" width="915" height="608" loading="lazy" /></p> <p> </p> <p>Summing up, sticky is a great feature, because:</p> <ul> <li>it <strong>comes along with the Drupal core</strong> (there’s no need to install anything new). It’s a nice checkbox in the sidebar of your content edition page. That’s it.</li> <li>It’s also very <strong>easy to integrate with views</strong> (I’ll show you later).</li> </ul> <p>But nothing is perfect, and this also has some cons:</p> <ul> <li><strong>Using a checkbox doesn’t provide any way for the user to specify the order of the elements</strong>, and also,</li> <li>once you mark many contents as sticky, It gets harder to remember or even figure out which ones you marked: <strong>it's messy</strong>. In the worst case scenario, your content editor might end up having to edit them all again in the quest of <em>“the lost content with the sticky checkbox”</em>. One way to help your content editors out is to create an administration view where you can show them which contents are sticky at one glance. They will appreciate it very much.</li> </ul> <p>Hope this is useful to you all. Next, we'll implement this feature with entity queues! Stay tuned!</p>