2011-05-19, 10:25 AM
This tutorial is for my achieving maximum speed tutorial which helps you fully integrate your CDN to your MyBB forum. It is a bit complicated and it will take some time - there is currently no easy way to do it, but this tutorial will make it as easy as possible.
For this tutorial, I will be using MaxCDN as an example. I'd highly recommend purchasing this if you're looking for a great CDN.
It is recommended to not use a CNAME unless it is really necessary. Use the default netdna-cdn.com domain to minimise DNS lookups and make it more simple. Create multiple zones, one global (for css, js, etc. e.g cdn.xx.netdna-cdn.com) and 2 or three for images (e.g img1.xxx.netdna-cdn.com, img2.xxx.netdna-cdn.com)
Before following this guide, make sure all the CDN URL's lead to your forum and are working completely.
--
Step 1: Go into templates & style, and select your theme and go into each of your stylesheets. Lets start with global.css. Copy the whole code and paste it in wordpad. Once done, click 'find and replace' in wordpad and replace the image URL's, the current path should look something like this: (/images/<theme>/xx.png> in the find box, put in '/images/'. Once done that, in the 'replace' box, input your CDN's url. For example: http://img1.xx.netdna-cdn.com/images/ - make sure to include the http and the forward slash! Keep clicking finding and replace 5-6 times then variate to img2 and img3, about 10-12 for all three depending on how many images you have. Repeat this for usercp, modcp, and all others.
Step 2: Go into your cPanel and edit your global.php - this is to display your stylesheets from your CDN. Find "<link type=\"text/css\" rel=\"stylesheet\" href=\" (without the quotes). As the href, input your CDN's URL. For example:
Step 3: Go into your templates in your admin control panel and select your theme. Go into 'ungrouped templates' and select 'headerinclude'. If you have followed my tutorial, you would notice that you only have one Javascript file (which you all combined into one). It looks like this:
Step 4: Make sure to replace URLs that are in the template, for example, change the logo to include the URL of your CDN (replace it with bburl) in the header. Also, go to your templates and search '.js', where is says 'master template' select your theme you want to edit and add your URL for each .js.
After this, you're all done! You have to manually edit this for plugins by going into the plugin's file into cPanel and editing the image paths. If you would like to put userstars or user ranks for your CDN, specify the full CDN URL for them. For example, for the star image whilst editing usergroups, do it like this:
If you've enjoyed the guide, please show your appreciated by repping me.
If you have any questions, feel free to ask!
For this tutorial, I will be using MaxCDN as an example. I'd highly recommend purchasing this if you're looking for a great CDN.
It is recommended to not use a CNAME unless it is really necessary. Use the default netdna-cdn.com domain to minimise DNS lookups and make it more simple. Create multiple zones, one global (for css, js, etc. e.g cdn.xx.netdna-cdn.com) and 2 or three for images (e.g img1.xxx.netdna-cdn.com, img2.xxx.netdna-cdn.com)
Before following this guide, make sure all the CDN URL's lead to your forum and are working completely.
--
Step 1: Go into templates & style, and select your theme and go into each of your stylesheets. Lets start with global.css. Copy the whole code and paste it in wordpad. Once done, click 'find and replace' in wordpad and replace the image URL's, the current path should look something like this: (/images/<theme>/xx.png> in the find box, put in '/images/'. Once done that, in the 'replace' box, input your CDN's url. For example: http://img1.xx.netdna-cdn.com/images/ - make sure to include the http and the forward slash! Keep clicking finding and replace 5-6 times then variate to img2 and img3, about 10-12 for all three depending on how many images you have. Repeat this for usercp, modcp, and all others.
Step 2: Go into your cPanel and edit your global.php - this is to display your stylesheets from your CDN. Find "<link type=\"text/css\" rel=\"stylesheet\" href=\" (without the quotes). As the href, input your CDN's URL. For example:
$stylesheets .= "<link type=\"text/css\" rel=\"stylesheet\" href=\"http://gbcdn.gamingbay2.netdna-cdn.com/{$page_stylesheet}\" />\n";Step 3: Go into your templates in your admin control panel and select your theme. Go into 'ungrouped templates' and select 'headerinclude'. If you have followed my tutorial, you would notice that you only have one Javascript file (which you all combined into one). It looks like this:
<script type="text/javascript" src="http://gbjs.gamingbay2.netdna-cdn.com/jscripts/gbay.js?ver=1600"></script>Step 4: Make sure to replace URLs that are in the template, for example, change the logo to include the URL of your CDN (replace it with bburl) in the header. Also, go to your templates and search '.js', where is says 'master template' select your theme you want to edit and add your URL for each .js.
After this, you're all done! You have to manually edit this for plugins by going into the plugin's file into cPanel and editing the image paths. If you would like to put userstars or user ranks for your CDN, specify the full CDN URL for them. For example, for the star image whilst editing usergroups, do it like this:
http://gbcdn.gamingbay2.netdna-cdn.com/images/usericon/lol.pngIf you've enjoyed the guide, please show your appreciated by repping me.
If you have any questions, feel free to ask!