Examples Templates Store Pricing Docs Turbo CSS Blog Boomla WishList Introducing Turbo UI Named buckets Turbo CSS is Tailwind CSS on steroids Introducing Turbo CSS, the most advanced web-design language Calculate how much storage you use Better login system Collaboration settings Filesystem and Database are not cutting the problem space right What I'm working on 64bit File node IDs New how-to videos Creating buttons gets easier Introducing reusable components HTTPS by default Introducing the Boomla Theme CDN for faster pageloads Write your own website builder on top of Boomla On On composition Shared admin access A fresh config editor Building a multi-purpose theme A filesystem to replace your CMS New file link type: scope Mobile editing support Inline file wrapping changed Package sandboxing New PHP-like JavaScript engine [sjs-4e] Send emails to the website owner New JavaScript engine [sjs-4] A better editing experience New email service provider Glossary and other changes New panel changes Improved registration flow Boomla goes multiplayer Using local dev tools Why Boomla doesn't need Git File Panel Let's build a community Automatic updates Improved sjs-3 API New Frontend CSS modules Work offline with Boomla Faster page loads via caching Drag & drop supercharged Supporting CommonJS modules  Paranoid about loosing data IDE usability improvements Simple App install flow Meetups in Budapest Goodbye broken links Flow control from user space Customizing apps Contextmenu support for apps Deprecating the .Class file Hello Changelog Embedding 3rd party plugins Introducing Tools Installing apps just got amazing Public beta Host on our servers Simple deploy with push/pull Version Control for the Web 350M files on a 1TB disk 2 weeks in review
Control Panel

Work offline with Boomla

2017-09-14

Imagine you are on vacation in the middle of Australia, and you want to upload some photos on your website so that all the family knows you are alive and having BIG fun. Except. In the middle of nowhere. There is almost no Internet.

Local mode, Offline mode

Luckily, Boomla works in both Local and Offline modes. Let’s see the differences.

In Local mode, Boomla runs on your machine, you are editing your website locally. Your local website runs on a boomla.me subdomain, for example, on amazing.boomla.me. Your entire website is on your computer, but your computer doesn’t know where the domain amazing.boomla.me is to be found. For that, it relies on the Internet, a so called DNS or Domain Name Service, that tells your browser to look for the website on your own machine. Without an Internet connection, your browser won’t find it.

That should be okay even if you are on a very slow connection, because looking up the domain takes very little data. On the other hand, if your connection is super limited, or you have no connection at all (like on an airplane), you can also work in Offline mode.

In Offline mode, you need no connection at all. To achieve this, you have to configure your computer to know where boomla.me and amazing.boomla.me lives. It’s a simpe text file you need to edit, though it’s a bit more complicated due to access rights.

Let’s start with installing Boomla locally.

Installing Boomla locally

Here is a step-by-step guide. I’ll assume you already have a public Boomla website which you want to download for working on it; and that you want to upload it again once you are done.

  • Download Boomla for your OS

  • Extract the archive, you will end up with a Boomla directory. That will hold all the data to your Boomla website. You can move this directory to a different machine and it will work.

  • If you are using Skype, make sure to configure it to not touch port 80 and 443, which are used for serving websites. Go to Tools/Options/Advanced/Connection and disable Use port 80 and 443 for additional incoming connections. Restart Skype.

  • In the Boomla directory, double-click boomla.exe if you are on Windows, or start it according to your OS. On Windows, you may need to give it permission to access the network. Do that. On other platforms, you may need to run it with special privileges.

  • Go to boomla.me, which is your local Control Panel.

  • Create a new user. Note: this user is created on your machine. You will be able to log in immediately, there is no email activation.

  • Create a new website. I suggest you create an empty website because it is fastest. If you clone an existing template, you will have to download it first. You can name it amazing.boomla.me, or whatever.

  • Commit your public website. You can only download the latest saved snapshot of your website. If you don’t save it, which is called commiting, you will still download the latest saved snapshot, but that may be different from what you expected. To do that, go on your public website, in the toolbar, click Commit to Story, enter a short explanation (the name of your snapshot), and click Commit.

  • Download your public website.

    • Go to boomla.me.

    • Click Websites in the left menu.

    • You will see your website group on the right. Click it to see its website list.

    • Next to your domain, you will see an arrow that points down, that’s for downloading, or pulling your website. Click it.

    • To pull from your public website, enter its domain.

    • You will be asked for your public email//pass, that you are using on boomla.com.

    • Check the force checkbox. That’s because your local website is not an old version of the public website. That’s to avoid overwriting one of your websites by accident. Normally, you would not check this box, only for the first time.

  • Visit your website at amazing.boomla.me. You can edit it as usual.

Uploading your website to the Boomla Cloud

Once you are done with editing your website locally, you can upload it back to the Boomla Cloud for others to see. This is called pushing your website.

  • Make sure to commit your changes before pushing.

  • On your local Control Panel (boomla.me), go to your website group’s website list, and find the up arrow next to the desired website for pushing it.

  • You will not need to check the force checkbox, because you are pushing new changes. So when do you need it? If you change both your public website and your local one, they both will contain unique changes. If that happens, you have to force push, but always double check what you are pushing and where!

  • When pushing, make sure to user your email//pass for the Boomla Cloud, not your local installation.

  • Note that at the time of this writing, your local Control Panel will not show you a progress indicator, but you should see the page is loading.

Voila, your website should be live for all to see!

Uploading on bad connection

Boomla optimizes this for you. First, you always ever upload new modifications. If you website already contained 1000 images, and you add a new one, only that new image will be uploaded.

Second, if you partially upload changes, but the connection breaks, that’s okay. The next time you retry, you will continue where you left off.

Working offline

You’ll need to tell your OS that boomla.me and any website you want to use offline lives on your machine, that is, on the IP address 127.0.0.1. For that you need to edit your hosts file, which is a simple text file. On Windows, you can find it at C:\Windows\System32\drivers\etc\hosts. You will typically run into access control issues, so I suggest you copy the file onto your desktop before making any changes, than make those changes and copy it back.

You have to edit it with a decent text editor. I suggest you install and use Sublime Text. (MS Word is not a text editor. Notepad is not decent.)

The format of this file is super simple. For the above example, you’d have to append the following lines to the bottom of the hosts file:

127.0.0.1           boomla.me
127.0.0.1           ide.boomla.me
127.0.0.1           amazing.boomla.me

The lines start with an IP address (always 127.0.0.1), followed by some spaces or tabs, followed by the domain without any http:// or other path fragments. In the middle, you can use as many spaces or tabs as you like.

Make sure to replace amazing.boomla.me with your domain!

ide.boomla.me is a built-in IDE, that is, an Integrated Developer Environment that ships with Boomla, which allows you to work with your website’s filesystem. If you want to use it or not, just add this line anyway.

Save, then copy the hosts file back into the directory C:\Windows\System32\drivers\etc.

Note that Chrome will give you an error message if you want to visit any website in offline mode, even if it lives on your machine. The simplest solution: when working offline, use Firefox.


Good luck!

you can follow me on Twitter