NYTimes Style Slider: Next Post WordPress Plugin

Advertisement:

You might have seen NYTimes and even some blogs have incorporated a cool animated Fadin/Fadout or Flyout style of showing next post, once user scrolls down the article. Its light-weight and looks cool.
There is a WordPress plugin called upPrev: NYTimes Style “Next Post” Animated Button, which lets us add this cool little feature to our blog, within 2 or 3 clicks of the button. Just drop the plugin into plugins folder and activate it from the WordPress dashboard.

NYTimes-upPrev-technotip

There is little to no configuration needed. You can set the style of animation: Fadin/Fadout or Flyout style. We are using Flyout style on this blog. Scroll till the end of the article and you will see a small window popping with a Flyout effect.

You can set the appearance of this window depending on the user scroll action, by mentioning the class name or the id name within your WordPress theme.

NYTimes-upPrev

For example, in our theme we have a class by name otherstuff at the end of each article. So when user scrolls till this class element, this window will Fadin. When user scrolls up above otherstuff class element, the window automatically fadsout.



Just like the NYTimes button, upPrev allows WordPress site admins to provide the same functionality for their readers. When a reader scrolls to the bottom of a single post, a button animates in the page’s bottom right corner, allowing the reader to select the next available post in the single post’s category (the category is also clickable to access an archive page). If no next post exists, no button is displayed.

Right click and see your blog/website source code and get the class name or id name and use it to set this plugin. Make sure to put # “hash” before the ID name, or . “dot” before a class name.

Usually comment section will have id name as #comment or class name as .comment

Leave a Reply