unitylogolarge

Integrating Unity into your WordPress blog

If you are a starting game designer/programmer like I am you’ll most likely want to be able to showcase your creations easily on your personal blog or website. Since I’ve been using Unity a lot lately I wanted to make publishing my Unity Web Player demonstrations as easy as possible. It turned out to be quite a tough combination, if I added my WordPress blog into the equation. So I decided to write a guide on how to smooth the road from a published .unity3d file to the final WordPress post.

1. Installing the Unity WordPress Blog Plugin

First thing first, why not smoothly integrate embedding Unity content into your posts? It seems like the guys at Unity have already thought about that and they provided a small yet pretty plugin for that. So what you need to do is:

1. Download the zipped plugin (‘WP_UnityObject’) from the official Unity website

UPDATE: the plugin has in the past been known to move around the Unity website and disappear, so if the link above doesn’t work, I also made the plugin available here. 

2. In your WordPress Dashboard, go to Plugin>Add New>Upload

3. Upload the previously downloaded file and activate the Plugin

Once you’re set, inserting Unity applications into your posts should be a breeze, using the WP_UnityObject  tag.  Examples as well as parameters are all documented in the plug-in’s readme file.

2. Modifying WordPress to allow the upload of Unity files

To publish the Unity content on your website you would now normally have to access your hosting account and upload the Unity file through the file manager. Or you could set up a FTP account and do it through FTP. But why not keep everything in once place? By default, the Media Library of WordPress does not allow the uploading of Unity files (out of security reasons, or whatnot). At a quick glance, WordPress checks the uploaded file types through the wp_check_filetype function in the wp-includes/functions.php file. We could easily modify this function to allow unity3d extensions, but then each time WordPress gets updated you’d lose all the modifications.

So, there’s a better way to do it. The default allowed extensions array is passed into the upload_mimes filter, so you can  easily add and remove types using a quick plugin hook, which we will introduce into the theme’s functions.php file.

add_filter('upload_mimes', 'custom_upload_mimes');
function custom_upload_mimes ( $existing_mimes=array() )
{
$existing_mimes['unity3d'] = 'application/vnd.unity';
return $existing_mimes;
}

In the code above ‘unity3d’ is the extension and  ‘application/vnd.unity’ is the mime/type corresponding to Unity Web Player applications.

You might also want to increase the maximum upload limit of WordPress (as 10 MB is rarely sufficient) in the wp-config.php file:


/** Maximum upload limit */

define('WP_MEMORY_LIMIT', '64M');

If this doesn’t work, you most likely have to update your php.ini file as well:

upload_max_filesize = 64M

3.  Final touch: Filter tweak

To make everything even prettier, let’s enable  Wordpress to filter the Media Library based on the Unity3D extension. This can be easily done by using the  ‘post_mime_types' filter. This way, you can isolate and check your internal WordPress game links when you want to publish them using the Unity plugin.

So open your theme’s functions.php file again and add the following:

function modify_post_mime_types( $post_mime_types ) {

// then we define an array with the label values
$post_mime_types['application/vnd.unity'] = array( __( 'Games' ), __( 'Manage games' ), _n_noop( 'Games (%s)', 'Games (%s)' ) );
// then we return the $post_mime_types variable
return $post_mime_types;
}
add_filter( 'post_mime_types', 'modify_post_mime_types' );

This is how the final result looks like:

4. Testing it all out

Time to test if everything works, with our trusty crash test dummy that Unity provides. It’s not much, but it serves our purpose:

Ana Todor is a Computer Scientist with a playful and literary twist. She has a Bachelor of Science degree in Engineering and a Bachelor of Arts degree in Cultural Studies. She is currently studying towards obtaining a Master of Science degree in Computer Science, Digital Interactive Entertainment. Areas of specialty: programming, web design and development, video game development, literary criticism, and creative writing. Notable hobbies: photography.

Leave a Reply

53 Comments

  1. Just curious, if I connected the dots right, Unity is a flash engine for game development and this plugin allows its integration into wordpress ? ^___ ^

    • Not quite. Unity is a 3D engine similar in scope to the Unreal engine, but much more user friendly. Also allows the publication of games to the iOS, Android and Browsers. Can be use for 2D as well if you feel like it. This plugin simply makes posting Unity Web Player content to your website a breeze.

  2. Funny bug, right click unity player to go Setup, you get redirected to their page, right click that unity player click Setup and the poor browser crashes :D

    • Well, it must be your browser, I don’t get a crash. The Setup simply reloads over and over again.

  3. hi Ana, great tutorial this is exactly what im looking for im having trouble getting my head round it. im using the eclipse theme, so ive gone appearance and editor and ive added the code into theme functions but i cant get your end result is there a certain place to put it as ive just inserted it into the top. Also there is no wp-config.php file! thanks

    • Hi there, and thank you for visiting my website. The code above goes anywhere in the functions.php code, as long as it’s not inside another function, it should work out of the box. Do you get any errors or changed behavior?

      The wp-config file is part of the WordPress installation and is not normally visible in the backend of WordPress. The only way you can access it is by going to your hosting backend and using the file manager (or maybe use a FTP client to connect). I have to ask, are you hosting your WordPress installation yourself or is it a blog on the WordPress domain ?

    • Thank you for visiting my website. I intend to write much more on the subject of Unity.

  4. But the plugin is only for Unity 1.x and 2.x not the newest version..?

    • Hi Lars,
      I’m actually using it with Unity 3, works like a charm. Haven’t tested it with Unity 4 yet.

  5. Hi Ana, thanks for the response ive used a ftp like you said at it worked fine. If any once else has a problem uploading into the functions. It wont work at the top it has to be under * Define global theme functions.to work…..!!! so now it loads to wp under (games) :) but i cant get it to appear on the page. I have gone to the html display and clicked on link and copied the file url but on the preview nothing happens! what would recommend is the best way to do achieve this thanks :)

    • Hi again Mr. Bo,

      Are you using the WP_UnityObject tag as specified in the Unity plugin example readme file ? Get the link for the unity file from the media library (where you uploaded), put it in the post using the tag, otherwise it won’t work. Currently, there’s no plugin that allows to insert unity content directly from the backend editor into the post with the click of a button. If I’ll have the time I will try to build one in the near future ;).

  6. hi, I like your article.. It seems to be exactly what i need.. except for 2 minor details..
    1. Which game files did you upload? Only the two files generated for web player? .html and .unity3d?

    2. Did you add– define(‘WP_MEMORY_LIMIT’, ’64M’); — to the wp_config.php file? Or did you simply modify ’64M’ to a higher number? I ask because no such line exists in my wp-config.php file…

    • Hi MrN,

      Sorry for the late response, but Aksimet actually put you on my Spam list and I had to take you out manually.
      1. Only the unity3d file is necessary, it will be embedded in the webpage using the unity plugin for wordpress.
      2. Yes, add it. This line overwrites the default value of 10 and is not necessary if you’re not tinkering with that.
      Again, sorry for the late reply. Feel free to contact me if you have any more questions.

  7. I can’t seem to find the php.ini you speak of… :(

    • Hello Mary,
      Sorry for the late answer, you’ve been accidentally tagged as spam by my anti-spam software and I only checked for false-positives yesterday. The visibility of php.ini files is up to each hosting provider’s policy. Some give you full liberty upon it, other don’t. Hostpapa is one of the hosters who like to have strict control over everything. Your safest bet in this case would be to open a support ticket on their website and ask them make the change (although the initial 10MB limit should be enough for your smaller games). Otherwise you could try making your own php.ini file and putting it in your /etc folder, but I don’t guarantee it will overwrite base hosting settings.

  8. Hey, i’ve done all of the above and on the page where the game should be I get a small little unity window that just reads ‘failed to download data file’. I’m hosting through hostgator using wordpress.

    • Hi James,

      What is the name and extension of the file you are trying to attach ? Make sure you are typing it exactly as is, as information is usually case sensitive. I’m using hostgator myself, so I don’t think the webhosting is to blame.

  9. Thanks for this info… it seems the WordPress plugin is no longer on Unity’s site, though?

    • Thank you for the heads-up Karl. I’ve updated the page with the downloadable plugin, as I downloaded it from the Unity website. I’ll also keep an eye out for a new version of the Unity WordPress Plugin to update the official link.

  10. No worries :) Also, I get errors when I upload my Unity files… says I can’t do it for security reasons… is there some codey stuff I need to do? ONLY JUST BLOODY GOT MY HEAD AROUND UNITY! lol.

  11. Oh, doh… I see you talk us through that in this very post. lol. Total noob question, though… where do I find the files to edit? I have absolutely no idea when it comes to web design stuff (hence choosing WordPress).

  12. Gah, I give up… found the file but says I can’t edit it… I think I’ll stick to making games… lol.

  13. I’m trying to get this to work. All I get is a blank spot where the web player should be. Not even the Unity logo :( If I look in the chrome console, it says “Uncaught ReferenceError: UnityObject is not defined”
    I know you aren’t in charge of this stuff, but have you found anyone else with this issue?

  14. Wow !!! this is amazing just what i was looking for, and im here to confirm just tested with unity 4 , works amazing you are my hero. have the most current build of wordpress 3.5.1 and the most current build of unity 4 as of 2/13/2013 in case any one is wondering and its working flawless.

    • Glad to hear it’s working. I didn’t have the time to properly test it on all versions.

  15. Madd Props!! miss Todor this is just what i needed for a site I’m creating really impressive to see a woman so into gaming and coding keep at it hope to read of your great success in the future…:)

  16. Hi Ana,

    Thanks for the great plugin. Do you have any plans to make it available in the wordpress plugin directory? It would be easier to find and to install :) Not that it is that difficult, but programmers are lazy, as you know ;)

    I saw the ‘failed to download data file’ error message one user mentioned, myself when using the plugin the first time. It has nothing to do with your plugin, but I’d like to answer it anyway.

    I’m using a Windows server and in IIS you have to setup the MIME type for the unity3d files. You can read how this is done at http://technet.microsoft.com/en-us/library/cc725608(v=ws.10).aspx

    The MIME type for Unity3D is application/vnd.unity (from http://answers.unity3d.com/questions/28968/mime-settings-for-unity3d-file-type.html)

    Hope this helps some people.

    • Hi Christian,

      I was actually thinking of making a more complex plugin to allow the easy upload and integration of Unity files into WordPress. I’m thinking of making it possible to allow the insertion of games into the WordPress blog directly through the editor. I’m a little tied up with work right now, but I’ll try to give the project some of my free time.

      Thank you for offering a fix for the ‘failed to download data file’ error message !

      • I had the same thought with the editor. Would be great to make it as easy as inserting an image :) I’m sure there is a big request for such a plugin as Unity3D is getting more and more popular. That plugin should then really go into the official plugins directory (http://wordpress.org/extend/plugins/add/)!

  17. hi, I managed to get the plug-in working a while ago. However it seems every few days the game stop loading (I don’t even get the white unity splashbackground). In order to temporarily fix it I have to go into wordpress (hosted by hostgator) and update the page its on. Simply updating the page brings the game back to life. Do you have any ideas on a more permanent fix.

  18. Thanks for the post.
    One question I have is, once I download the unity plugin folder, there are several files within that and not sure which ones I should upload to WP. Some will not be accepted since they are not the expected file type…

    Rick

    • Hi Rick, upload the archived folder as such (the zip file). No need to open it. WordPress interprets it as a whole. And you should not upload it per se, but install the zip as a plugin.

      • Awesome, thanks. I should have tried that first :-)
        One question. I was reading the text file and shows how to change around the width and height within the tag. But doing that only changes the overall size of the play window.

        The plugin seems to be chopping off the sides of the game and you can’t see the left and right lateral limits. If you want, you can check it out here: http://lightningdrop.com/free-online-games/

        Rick

  19. Hello again. Please disregard. I realized before that the build was generated using web 960×600, but didn’t realize I needed to get rid of the sidebar on my page for the window to show the full screen…trying to figure out how to do that without getting rid of my page header/logo. Thank you for your help.
    Rick

  20. thanks for the tutorial!
    i’m trying to integrate little unity game on my wordpress static page.
    my question is how do you make unity game run in a new page (or pop up) when user press ‘click to press’?

    just like this example below:
    http://redknightgames.com/category/games/

    thanks for your work!

    • Hi!

      It seems that the website you showed me is using lightbox:

      http://lokeshdhakar.com/projects/lightbox2/

      i know it’s possible to show anything from photos to videos in a lightbox, so a unity game should work just as well. I haven’t tried doing it yet, but I’ll consider experimenting with lightbox and the unity player in the near future. If you manage to do it before me, just let me know.

      • Thanks for a reply!
        Unfortunately, they are using wordpress
        You can go to its footer and you will see a message
        “Powered by WordPress and the Graphene Theme”
        any idea? : /

        • oh wait. sorry i see what you meant now.
          so executing unity game on popup is something that should be done with lightbox instead of editing unitygame or wordpress’s php files?

          • Lightbox is a jQuery script that can be surely integrated into your WordPress blog. What I was saying is simply that you’ll have to test it with the Unity player to see how easily it can be integrated. I intend to do that as well as I think I’ll like to use it myself.

    • I’ve seen a similar concept, where it doesn’t automatically load and start the unity player, instead it has an image, with a link at the bottom that says something like ‘Click to Play’ and then if you click that, it changes to ‘Click to Close’ or something like that. If ‘someone’ could come up with the code for this, it would be nice. I have a couple unity games on my site, one of them with sounds and background music, I can only imagine how chaotic it will get if I add 3-4 more, not to mention how slow the page would be to load.

  21. I found some issues regarding the resolution presented. Seems the plugin is applying the width to the height, ignoring the inserted height value.
    As no master in php and other internetz stuff, I tried to solve this and maybe I got it.
    I’ve got the fixed file and will be happy to provide it. But the fix is simple and with wordpad or even notepad, edit the WP_UnityObject3.php and where it reads:

    if(typeof unityObject != “undefined”){
    unityObject.embedUnity(“unityPlayer”, “‘.substr($tUOParams[0],5,-1).’”, ‘.substr($tUOParams[1],7,-1).’, ‘.substr($tUOParams[1],7,-1).’);

    replace the last ‘.substr($tUOParams[1],7,-1).’);
    with:
    ‘.substr($tUOParams[2],8,-1).’);

    Its just a matter to make the plugin to read the correct value for height.

    If I’m wrong by any means, please correct me and disregard my input.

    Thanks for the lovely tutorial Ana! Helped me ALOT!

  22. I have a solid knowledge about .php and excellent in wordpress, but I didn’t manage to change functions.php file according to your instructions.
    All I get is the text from second functions.php modifications appears in header of my website.
    So where in functions.php should it be placed ? I put it at the end of the file, but the issue is like I described.
    Can you please help me with this ?

  23. Hello Ana. I seem to be the only one having this issue, but I’m getting an error after inserting the custom_upload_mimes() function. Specifically:
    Parse error: syntax error, unexpected T_FUNCTION in /home/adamsing/public_html/wp-content/themes/radius/functions.php on line 190
    Not sure what I’ve done wrong.

    • Actually, I get that error without the function, just by hitting Update File without changing anything…

      • I switched to editing the code in the code editor on my cpanel instead of inside the wordpress dashboard and it seems to resolve that error when the functions in your tutorial aren’t present. So I still get the error if I add your code. I get it for both functions you provide for the Functions.php file.

  24. Hi!
    It’s the first time I’ve tried adding code into my wordpress site and it’s gone wrong… I pasted the bit for allowing to upload unity files into the functions.php and as a result my page has gone all white and I can’t access it at all. Can you help please??

  25. Hi Ana,
    With you being the clever and generous type of web jocky, I wonder if you’ve managed to solve the issue of launching an in-game web browser?
    Something like this..
    http://labs.awesomium.com/unity3d-integration-tutorial-part-1/
    I understand that Awesomium doesn’t work on the web player due to a custom dll requirement but maybe you know of something similar which doesnt?
    I want hotspots in Unity to launch extra information via a browser but don’t really want to launch an external browser. Perhaps I could customise the page in which Unity game displayss and have ‘other information appear ‘around the game window’?
    Cheers
    Nigel
    Australia

  26. Pingback: Getting Started with Unity3D here is you 1 stop of shop of great resources - Microsoft UK Faculty Connection - Site Home - MSDN Blogs

  27. Pingback: Mohamed Emam | Windows Game Development With Unity3D

Next ArticleThe Martian Chronicles