Everything In Between

If your project so much as pretends to have a profit motive, I will tell you to go fuck yourself and your project.

Bring Your Own Content: Virtual Self-Hosting Web Publishing

17 comments

Dear LifeHacker readers, you may be under the impression this tool is designed for hosting your own content, rather than providing a way to easily piggyback on the robust Web hosting services provided for free from outlets such as Tumblr.com and WordPress.com. Please read this clarifying comment for a more appropriate contextualization about the intended use of this virtual appliance.

Remember that article I recently wrote, “How to use Tumblr as a web host for a blog you FULLY control, without paying anything“? Oh, you didn’t read it? That’s okay. I know it was long, and somewhat arcane.

The good news is you don’t have to bother with that anymore. Here’s a much, much shorter, 100% point-and-click solution that does the same exact thing as everything in that blog post (except the part about buying your own domain, which you should still do before you start).

  1. Download VirtualBox for your platform, and install it. This is just like every other software application installation process you’re already familiar with, but it’s really cool.
  2. Download the Bring Your Own Content (BYOC) appliance I’ve already pre-configured. This is a standard ZIP archive. It’s big. (I’m sorry. Workin’ on that….) All you need to know is that an “appliance” is a pre-packaged computer-in-a-file (yes, an entire computer bundled inside one file) that a program like VirtualBox can run on your physical computer. This is the special file that lets you skip all the complicated stuff in the previous article, because I’ve done all the complicated arcane server configuration for you already.
  3. Double-click the ZIP file to unzip it. The ZIP file contains three important components. They are:
    • The “Bring Your Own Content” virtual appliance itself (this is the pre-packaged your computer that is already set up to be your own personal web host).
    • A folder called mysql-data-vm (this is where your databases, the contents of your blog posts) will be saved). In an upcoming step, you’ll need to tell VirtualBox where to find this folder because the virtual appliance is expecting it.
    • A folder called wordpress-vm (this is where your images and other media assets will be saved). Like the mysql-data-vm folder, you’ll need to tell VirtualBox where to find this folder because the appliance is expecting this folder, too.
  4. Double-click the “Bring Your Own Content” file. This will open VirtualBox’s “Import Appliance…” screen.
    Screenshot of VirtualBox Manager's 'Import Appliance' screen.
    Click “Import” at the bottom of the screen and go get a coffee. This could take a couple minutes.
  5. Click “Shared folders” to help VirtualBox find the other two folders that you downloaded.
    Screenshot of VirtualBox Manager's 'Details' pane for a virtual machine.
    For each of the two shared folders (the mysql-data-vm folder and the wordpress-vm folder), you’ll need to edit the “Path” that tells VirtualBox where to find them. They’re called “shared folders” because both your physical computer and the virtual appliance will be using them. And because of that, you might want to move these folders to some spot on your computer where you can access them easily but that won’t be in your way, and that you won’t accidentally delete. Your “Downloads” folder is probably not a good place for these folders, but your home folder’s “Documents” folder might be (that’s where I keep mine), so move them there.

    1. Select the mysql-data-vm folder from the list and then click the “Edit” button, which looks like a small blue folder with an orange circle on top of it.
      Screenshot of VirtualBox Manager's 'Shared folders' preference screen for a virtual machine.
    2. Enter the full path to wherever you moved the mysql-data-vm folder on your computer. You can click the downwards pointing arrow and choose “other…” from the list to browse to the location, like you would using just about any other program.
    3. Do the same thing as you did with the mysql-data-vm folder with the wordpress-vm folder, editing its path to wherever you moved the wordpress-vm folder, of course.
    4. Click “OK” as many times as you need to to return to the VirtualBox Manager main screen.
  6. With the “Bring Your Own Content” appliance selected, click “Start” to get things going.

Give it a few moments to do its thing (30 seconds or so), during which time you should see what looks like an oldschool computer booting up, and which you can just ignore.1

Then open a new tab in your Web browser (as in, the Web browser on your computer, not in the appliance) and type in localhost:8080/wordpress in the address bar. You should see a WordPress installation screen, ready to go.

From here on out it’s just a standard WordPress install, also described in the prior article, except without any of the automatic install and update feature limitations. It all works. Just go to your new WordPress plugins screen—you might wanna bookmark that—and activate Tumblr Crosspostr. Follow the on-screen instructions for connecting to Tumblr (also detailed in Tumblr Crosspostr’s screenshots over at the WordPress Plugin Repository), and voila.

As long as the “Bring Your Own Content” window is running in the background somewhere, your personal web host is up. If you want to shut it down, just close the window and select “Save state” or “Pause” which will, unsurprisingly, freeze the virtual machine. Then you can quit VirtualBox Manager, too. When you want to do some Web publishing again, just open VirtualBox and click “Start” to fire up the Bring Your Own Content appliance again, and point your browser at your locally-installed WordPress again.

With this process, you’ve got your Tumblr blog backed up to your computer. You can create posts on Tumblr from your own computer. You don’t need a Web host at all. As long as you’re making backups of your personal computer (and you should be), you’ve got all your bases covered.2

See? Free as in no money really does mean free as in freedom.

  1. What you’ve just done is turned on a virtual machine, a computer inside your computer, that just so happens to be pre-configured with everything you need to be your own Web host. In other words, it’s a Web server. Yup, like the ones you would otherwise have to pay for. When it’s done, you’ll see a login screen with the default username “byoc” already entered into the box. The password is the same, byoc, but you’ll never actually have to log in here unless you want to explore what a Linux server looks like. []
  2. You might want to tell whatever backup software you’re using to exclude the actual VirtualBox virtual machine, as in, the appliance you’re running. That’s because it’s huge and every time you run it, your backup software is likely to think it’s changed bunches. But it hasn’t. All the important stuff is in those shared folders, so even if you totally lose the appliance, you can still start right back up where you left off by pointing your existing shared folders at another copy of the thing. []

Written by Meitar

March 13th, 2014 at 10:58 pm

17 Responses to 'Bring Your Own Content: Virtual Self-Hosting Web Publishing'

Subscribe to comments with RSS or TrackBack to 'Bring Your Own Content: Virtual Self-Hosting Web Publishing'.

  1. Does switching the computer with VM and the “Bring Your Own Content” appliance installed off means the self-hosted blog is offline?

    aau

    31 Mar 14 at 7:04 AM

  2. Does switching the computer with VM and the “Bring Your Own Content” appliance installed off means the self-hosted blog is offline?

    Yes, it does, and sadly the LifeHacker article that you read that alerted you of this technique has badly miscontextualized the purpose of this tool.

    BYOC is not intended to be “your own web server to host content for other people,” it’s intended to be an easy-to-use dashboard for you to create, own, and manage content that you use a free hosted service such as Tumblr.com or WordPress.com to host your content for you.

    The way LifeHacker wrote about this makes it sound like you want to use the VM on your local computer as the ONLY webserver, but that’s not going to work well for most people. It’s not designed to. Instead, you want to use the VM to crosspost (copy) content onto one of the free services that BYOC supports. These currently include Tumblr.com (via the Tumblr Crosspostr plugin) and WordPress.com (via the WP-Crosspost plugin), for which content can be moved to and copied from via the “crossposting” plugins that come pre-installed with BYOC.

    The value of using BYOC to do this is that you own your own content, as the LifeHacker article describes, but you are piggybacking on the free Tumblr or WordPress to actually present your content to the world. This is useful specifically because:

    • it lets you use the free service’s Web hosting infrastructure instead of your personal computer for that purpose
    • it provides you with an always-up-to-date backup of your blog, and
    • it lets you easily move your content between services even if they don’t provide export functionality of their own (like Tumblr doesn’t).

    Consider reading the very beginning of the prior post, “How to use Tumblr as web host for a blog you FULLY control without paying anything” to gain more context about the intended use of the BYOC virtual appliance.

    I hope this helps clarify the situation.

    Meitar

    31 Mar 14 at 9:50 AM

  3. […] Bring Your Own Content: Virtual Self-Hosting Web Publishing | Everything In Between […]

  4. […] Bring Your Own Content: Virtual Self-Hosting Web Publishing [Everything In Between] […]

  5. Thanks for this, very interesting. I currently use a piece of software called DesktopServer to locally develop WordPress sites. I develop them locally mainly for speed reasons, i.e. the changes update faster then if I were to develop them on my domain. However, I haven’t gotten to the point yet where I push the locally developed sites online(not sure how complicated that will be).

    My question is, if i use this tutorial will it also making developing WordPress sites faster than doing developing online?

    Basically it boils down to I’m wondering if this tutorial and your appliance will give me a faster & easier workflow for developing locally and pushing online (as compared with DesktopServer, which I believe is an implementation of XAMPP).

    Thanks again for this.

    John

    31 Mar 14 at 5:22 PM

  6. John, BYOC isn’t intended for website development, but I don’t see why it can’t be used for that. You can certainly use this as an alternative to XAMPP/MAMP. If you take the time to read through the prior post, you’ll see this virtual machine is just an encapsulation of a standard LAMP stack in the first place, which is more or less what XAMPP is trying to offer, too.

    You could also just try it out and see what you like better for development purposes. But again, my focus here is not to support web developers, it’s to support end users. If you already use XAMPP, you’re not my target audience for this project.

    Meitar

    1 Apr 14 at 1:20 AM

  7. Brilliant! I’ve been looking for a variant of this… would you think it difficult to set this up as a wordpress blog on openshift.redhat.com?

    Jay

    1 Apr 14 at 2:23 PM

  8. (replaced my previous post with a bit more clarity – hopefully)

    Brilliant! I’ve been looking for a variant of this… would you think it difficult to set this up as a wordpress BYOC on openshift.redhat.com?

    Jay

    1 Apr 14 at 2:28 PM

  9. (LOL… ok I replaced my previous posts again… want to make sure I’m being clear!)

    Brilliant! I’ve been looking for a variant of this… would you think it difficult to set this up to upload (BYOC) posts to a wordpress BLOG that’s running on openshift.redhat.com?

    Jay

    1 Apr 14 at 2:32 PM

  10. :) Your enthusiasm is welcome, Jay.

    And, yes, moving content from your BYOC-hosted WordPress to some other WordPress install is explicitly the purpose of the WP-Crosspost plugin I’m working on. That’s why it ships with the BYOC appliance in the wordpress-vm folder.

    Currently, however, WP-Crosspost uses the WordPress.com REST API, which means your self-hosted WordPress blog on OpenShift needs to have JetPack installed and enabled, so that WP-Crosspost can talk to WordPress.com about your blog on the OpenShift platform.

    I do have plans to add support for native WordPress-to-WordPress crossposting in the future (without going through the WordPress.com REST API). However, I am starting by focusing on the “.com” services because that’s what most people will use, of course.

    Thanks for your interest and please feel free to fork/patch/etc. the WP-Crosspost portion of the project on GitHub.

    Meitar

    1 Apr 14 at 7:29 PM

  11. Hi – This looks great and I want to play around with it. I’m hitting a snag right off the bat though. This is what I get when I double click the ova:

    http://i.imgur.com/uaIubTj.png

    Any thoughts on what I am doing wrong? Thanks!

    Glenn

    1 Apr 14 at 8:09 PM

  12. Glenn, that’s definitely weird. And, sadly, that error message from VirtualBox is very unhelpful. :(

    Other than double-checking to ensure you’ve already installed the latest version of VirtualBox on your system, and that you in fact successfully downloaded the entire ZIP archive linked in my post, I would take a guess that maybe your build of VirtualBox doesn’t like one of the default settings in the appliance’s XML descriptor file. You can use any `tar` utility to un-tar the .ova file contained in the .zip archive and more closely examine its bundled .ovf file. In particular, the default shared folder definitions have paths that probably don’t exist on your system, so maybe editing those to absolute paths that DO exist and then importing the .ovf (instead of the .ova) that you untar’ed might help.

    But this is a total shot in the dark because I don’t actually know.

    Do your VirtualBox log files show anything more helpful?

    Meitar

    1 Apr 14 at 8:27 PM

  13. I got this working on my Windows box. There’s a nearly 100% chance that not getting it to work in Crunchbang has to do with my sucking. :)

    I’ll keep tinkering and if I get it to go I’ll post my solution here. Thanks for all of your work.

    Glenn

    2 Apr 14 at 8:22 AM

  14. […] Bring Your Own Content: Virtual Self-Hosting Web Publishing | Everything In Between […]

  15. Hi Maymay,

    I really like your Project. Do you have a walkthrough on how you configured your image. I opened the image with vmware, and I have the commands that you put into the terminal but what you actually did is missing. And this would be very interesting for me (who is not that familiar with the subject), when I try to modify it to my needs. So if there is an older post or something with more information this would be great. Thank you Maymay!

    Best Regards,
    Dennis

    Dennis

    12 Apr 14 at 4:27 PM

  16. Dennis, the closest thing to what you’re looking for is the “prior post.”

    There are some differences, notably the BYOC appliance uses Lighttpd while the Mac OS X walkthrough deals with Apache. But, beyond that, the basics are the same.

    Hope this helps.

    Meitar

    15 Apr 14 at 1:50 PM

Leave a Reply