How to Display WordPress Sidebar on Non-WordPress/WordPress Sites

While working on my latest project, DevGrow Discussion, I found the need to embed my entire WordPress sidebar on a non-WordPress site – namely a bbPress forum. Since I use different widgets to display popular posts and other dynamic content, simply copying and pasting the HTML won’t be enough. In the end, there are really only two ways to do this:

1. Include yours wp-load.php files in your app and actually loads all of WordPress to get access to plugin functions
2. Use simple caching to store the sidebar in HTML format and include it in any other application, then rebuild as needed when new content is published

If it’s not obvious enough, the first option is very expensive in terms of database queries and can slow down your site considerably. The second option requires a bit of effort in implementation but performance wise there is no competition.

Host your WordPress sidebar

Before we can write our function, we need to understand what exactly we are trying to do. Our goal is archive our sidebar to a text file and update that cache whenever we publish a post, change our theme or change the sidebar widgets. Since we plan to use our cache to show the sidebar on another app, we need to be able to clear the cache easily without any ill effects (we don’t want the sidebar to be blocked). broken at any time).

To do this effectively, we will also create a log of our archive files and used to determine if cache should be cleared. If so, the actual cache file will be overwritten the next time someone visits the WordPress site, ensuring the right sidebar is always displayed on both apps.

Create functions

To get started, open your thread Functions.php file and add the following functions to it:

 bộ đệm chức năng ($ task, $ cacheFile, $ cacheTime = 21600) global $ cache; // Định cấu hình tệp và thư mục: $ cacheDir = TEMPLATEPATH. "/ Cache"; $ cacheFileName = $ cacheDir. "/ cache- $ cacheFile.txt"; $ cacheLogFile = $ cacheDir. "/ cache-log.txt"; // Tạo thư mục bộ đệm nếu nó không tồn tại if (! Is_dir ($ cacheDir)) mkdir ($ cacheDir, 0755); // Tạo nhật ký của các tệp bộ đệm với trạng thái hiện tại của chúng nếu (file_exists ($ cacheLogFile)) $ cacheLog = unserialize (file_get_contents ($ cacheLogFile)); khác $ cacheLog = mảng (); if ($ task == 'start') // Nếu bộ đệm tồn tại, chưa đến 6 giờ và không có trong hàng đợi xóa, hãy giữ lại - nếu không thì xây dựng lại bộ đệm nếu (file_exists ($ cacheFileName) && (time () - filemtime ($ cacheFileName)) $ value) $ cacheLog [$ key] = 0; file_put_contents ($ cacheLogFile, tuần tự hóa ($ cacheLog));  

The first functions, cache, is key for our cache to work. Depending on where in your file you call it, the function will set up the correct files and directories, verify the cache needs to be built, and if so, will save the output and update the cache log . The function uses PHP’s output buffer to save any generated HTML to a text file.

The second function is used to filter all cache files and is useful for adding to existing WordPress hooks. With it we can make it so that our cache is cleared every time our theme is updated, a post is saved or our sidebar widgets are updated by adding later at the end Functions.php:

 add_action ('switch_theme', 'cache_purge', 10); add_action ('Publish_post', 'cache_purge', 10); add_filter ('widget_update_callback', 'cache_purge', 10); 

For a complete list of hooks, see the WordPress Plugin API Reference.

Configure your Sidebar

Now that you have the functions ready, you can start hosting your sidebar. Open sidebar.php and add this line at the top of the file:

This function will start saving to the sidebar where it needs to, otherwise it won’t do anything. Because of the way PHP output buffering works, we also need to disable buffering at the end of the file. Add this line to the bottom of the same file:

After you have added those two lines, refresh your blog. You won’t see anything in your browser but check /buffer folder in your theme folder and you will see two files starting with cache-.

Use your cache

Now that you have created your cache file, you can use it in any application that has access to it. You can easily do this using include but I also want to make sure the file exists, just to be safe:

Just be sure to double check your file path is correct. If you want to set your cache to clear from an external application, you will have to include cache_purge function in your script somewhere and just call it whenever needed. Then it’s simply a matter of calling the function:

Conclusion

This technique is really useful for any PHP application, especially when you want to display dynamic content without sacrificing performance. Use it to speed up your WordPress installation, or perhaps use useful bits (like the sidebar) on any other website or application.

Editor’s Note: This post was written by Monjurul Dolon for Hongkiat.com. Monjurul is an interface designer and web developer based in NYC, freely going through life. He blogs at DevGrow.com, where he shares tips and resources on web design and development.