XenForo CDN Integration
XenForo is a commercial forum software released in 2011 by XenForo Limited and is developed and maintained by Kier Darby, Mike Sullivan, and Chris Deeming. It is written in PHP and intended for creating an engaging community experience.
How to complete a XenForo CDN integration
This integration guide demonstrates how to complete a XenForo CDN integration with KeyCDN. Follow the steps below to successfully integrate your XenForo application with KeyCDN:
XenForo 1.x
Create a Pull Zone for the origin server.
From the KeyCDN dashboard, navigate to your Zone settings. From here, set the Ignore Query String setting to
disabled.Open the
library/config.phpfile and add the following snippet, replacinghttps://examplepull-hexid.kxcdn.comwith your Zone URL:$config['externalDataUrl'] = 'https://examplepull-hexid.kxcdn.com/data'; $config['javaScriptUrl'] = 'https://examplepull-hexid.kxcdn.com/js';Note: If your XenForo application is installed in a subdirectory include it in the file path.From the XenForo admin control panel, navigate to Appearance > Styles > [Your Style] > Style Properties > General > Settings. From here, prepend your Zone URL to the
Path to Imagessetting:From the XenForo admin control panel, navigate to Appearance > Styles > [Your Style] > Style Properties > Header and Navigation > Settings. From here, prepend
@imagePathto theHeader Logo Image PathandOpen Graph Logosettings:Verify the designated content is loading from KeyCDN. To check this inspect the HTML source code of your application, for example:
<!DOCTYPE html> <html id="XenForo" lang="en-US" dir="LTR" class="Public NoJs LoggedIn Sidebar Responsive" xmlns:fb="http://www.facebook.com/2008/fbml"> <head> ... <script src="https://examplepull-hexid.kxcdn.com/js/jquery/jquery-1.11.0.min.js"></script> <script src="https://examplepull-hexid.kxcdn.com/js/xenforo/xenforo.js?_v=6ac1b348"></script> <link rel="apple-touch-icon" href="https://examplepull-hexid.kxcdn.com/styles/example/og-image.png" /> ... <meta property="og:image" content="https://examplepull-hexid.kxcdn.com/styles/example/og-image.png" /> ... </head> <body> ... <img src="https://examplepull-hexid.kxcdn.com/styles/example/xenforo/avatars/avatar_m.png" width="96" height="96" alt="keycdn" /> ... <img src="https://examplepull-hexid.kxcdn.com/styles/example/xenforo/avatars/avatar_s.png" width="48" height="48" alt="keycdn" /> ... <img src="https://examplepull-hexid.kxcdn.com/styles/example/logo.png" alt="XenForo CDN Integration" /> ... </body> </html>Note: You can use a custom subdomain by creating a Zone Alias.
XenForo 2.x
Create a Pull Zone for the origin server.
From the KeyCDN dashboard, navigate to your Zone settings. From here, set the Ignore Query String setting to
disabled.Open the
src/config.phpfile and add the following snippet, replacinghttps://examplepull-hexid.kxcdn.comwith your Zone URL:$config['externalDataUrl'] = 'https://examplepull-hexid.kxcdn.com/data'; $config['javaScriptUrl'] = 'https://examplepull-hexid.kxcdn.com/js';Note: If your XenForo application is installed in a subdirectory include it in the file path.From the XenForo admin control panel, navigate to Appearance > Style properties > Basic options. From here, prepend your Zone URL to the fields in use:
Verify the designated content is loading from KeyCDN. To check this inspect the HTML source code of your application, for example:
<!DOCTYPE html> <html id="XF" lang="en-US" dir="LTR"> <head> ... <meta property="og:image" content="https://examplepull-hexid.kxcdn.com/styles/example/og-image.png" /> <meta property="twitter:image" content="https://examplepull-hexid.kxcdn.com/styles/example/og-image.png" /> ... <script src="https://examplepull-hexid.kxcdn.com/js/xf/preamble.min.js?_v=cdb16b95"></script> <link rel="icon" type="image/png" href="https://examplepull-hexid.kxcdn.com/styles/example/favicon.png" sizes="32x32" /> <link rel="apple-touch-icon" href="https://examplepull-hexid.kxcdn.com/styles/example/og-image.png" /> </head> <body data-template="forum_list"> ... <img src="https://examplepull-hexid.kxcdn.com/styles/example/logo.png" alt="XenForo CDN Integration" srcset="https://examplepull-hexid.kxcdn.com/styles/example/logo@2x.png 2x" /> ... <img src="https://examplepull-hexid.kxcdn.com/styles/example/logo.png" alt="XenForo CDN Integration" srcset="https://examplepull-hexid.kxcdn.com/styles/example/logo@2x.png 2x" /> ... <img src="https://examplepull-hexid.kxcdn.com/data/avatars/s/0/1.jpg?1555083147" alt="keycdn" class="avatar-u1-s" /> ... <script src="https://examplepull-hexid.kxcdn.com/js/vendor/jquery/jquery-3.3.1.min.js?_v=cdb16b95"></script> <script src="https://examplepull-hexid.kxcdn.com/js/vendor/vendor-compiled.js?_v=cdb16b95"></script> <script src="https://examplepull-hexid.kxcdn.com/js/xf/core-compiled.js?_v=cdb16b95"></script> ... </body> </html>Note: You can use a custom subdomain by creating a Zone Alias.
Upon completing this XenForo CDN integration, your XenForo application will deliver designated content from our global network. This will significantly improve the performance and user experience of your XenForo application. Adding a CDN to your XenForo application will bring your content as close as possible to your users, decreasing the overall latency of your application. Learn other ways to speed up XenForo.
Do you know of another integration approach with XenForo that we should mention here? Contact us to let us know and we will add it.