Wordpress Plugin: Read More Right Here
A small, simple to use plugin to automatically transform your
links into "view right here" links. When clicked, the rest of that entry's content will be loaded and made visible to the reader immediately, without redirecting them to the post's single page display.
To view this plugin in action, visit the Wooliet front page
and find an entry with a "read more" link. Click the link and watch the content load. Click again and the content will slide back out of view.
Download and Use Right Now!
The latest version of the "Read More Right Here" plugin is available for download at Wordpress's plugin directory
- Extract the 'read-more-right-here' directory to your Wordpress installation's 'wp-content/plugins' directory
- Find the 'Read More Right Here' entry in the "Plugins" listing within your Wordpress dashboard and click "Activate"
- Visit the plugin's Settings page to customize
How It Works
"Read More Right Here" uses the jQuery
framework already included with Wordpress installations. When your blog is loaded, all links of the "more" class (as created by Wordpress when you include the
quicktag) are modified to no longer send the user to that post's single page display when clicked. Instead, the Wordpress database is queried for that specific post, and all content after
tag (i.e. only what you need) is returned. The new content is then immediately displayed to the user, inline with the opening content.
If clicked once more, the new content will slide out of view. Now that it has loaded, any subsequent clicks will simply re-display that existing content. No new server requests are made!
If, for some reason, the request fails, an error message is displayed where the new content would have been seen. The
link then reverts to normal use so that the reader can still click on it to go to its single page display.
1. Available Options
2. The "Loading" Image
- Loader Image: Images found in the "loader" directory can be selected as the displayed "ajax spinner" image. You can also choose to display nothing.
- Link Text On Expanded Content: The 'more link' text displayed when new content is displayed (e.g. 'read less').
- New Content Expand Speed: The animation speed at which the new content expands.
- Duplicate More Link: If selected, a duplicate 'more link' is appended to the bottom of new content when it is displayed.
- Use with Wordpress Pages: If selected, the plugin will work on single pages containing a 'more link'. See here for more information.
- Use UTF-8 Decode: If selected, the 'more' content retrived will be passed through PHP's utf8_decode function. It might help for situations such as this.
The "loading" image used to visually inform the user that the new content is arriving was created using the excellent Ajax Load
website. If you would like to modify the default image used with this plugin (i.e. make it bigger, match your theme's colors, etc.), create your own image and place it in the
directory located in the plugin's root directory. Then visit the Settings page and set that image using the
". It has been compressed using Google's Closure Compiler
4. Calling the Plugin Manually
If the plugin needs to be executed manually for any reason (see this support thread
for an example), it can be called directly:
// No arguments: executes plugin on entire document (but already modified 'more links' will be ignored)
// Within a more specific context: executes plugin within provided context
5. Client-side events
The plugin client-side code triggers custom "events" using jQuery's trigger
method. Other scripts loaded to the page can hook into these events to offer additional functionality.
'RMRHContentExpanded' is triggered when the new content is displayed
'RMRHContentCollapsed' is triggered when the new content is hidden
The events are triggered by the 'more-link' anchor element. Any element futher up the DOM can handle them.
Example code for handling these events:
// '.post' is the post containing element.
// return false; // prevents event from bubbling up the DOM