Marketing Site in a Box
Marketing Site in a Box (MSIAB) gives you everything you need to bootstrap a beautiful, production-ready website or landing page in less than 5 minutes. And since it’s powered by Editmode, all of the content can be managed, updated and changed by you or anyone on your team - technical or otherwise.
There are two parts to Marketing Site In A Box - The pre-built theme(s), which you can browse here, and the content, which we've pre-packaged into a cloneable Editmode project. We've spent a good deal of time and energy preparing and polishing both to make sure that you you have everything you need to get up and running super quickly.
There are two ways, at the moment, to get up and running with an MSIAB theme from our gallery of themes: the Editmode Vercel Integration and the Editmode CLI.
Our Vercel integration is made up of two functionally different installation flows: the Deploy Button Flow helps you bootstrap a new site with starter content, while the Marketplace Flow simply lets you link your Vercel projects to your Editmode projects (this will store the id of the Editmode project in the NEXT_PUBLIC_PROJECT_ID environment variable of the linked Vercel project), and leaves further configuration to you.
Step 1 - Theme Selection
Visit the MSIAB repo, select a starter theme from our gallery, and click the
deploybutton to deploy the theme to Vercel. This will open up Vercel to start the deployment flow.
Step 2 - Vercel Deployment
Once redirected to Vercel, create and link the project to a GitHub repo, and then add the integration as prompted. You'll be redirected to a popup window where a new Editmode project — with the starter content needed to hydrate your website — will be generated for you. You will need an Editmode account for this, so you will be prompted to log in or sign up for an Editmode account.
Step 3 - Using Editmode
You may now make changes to any piece of content on your new website via inline editing (see: the Magic Editor) or on your admin panel, the Content Management Hub, accessed by visiting Editmode and accessing your project dashboard.
Using the Magic Editor.
Step 1 - The Marketplace
Visit the Editmode Vercel integration marketplace page and click the "Add Integration" button. This will open up the scope selection modal and then the project selection modal — you'll be allowed to select which scope to install the integration and which projects the integration has access to. Click the "Add" button on the project selection modal when you're done to proceed to the dashboard.
Step 2 - Linking Projects
Once redirected to the dashboard, you may select which Editmode projects to link to your Vercel projects in a one-to-one mapping scheme. Also, you may link the same Editmode project to multiple Vercel projects but not the other way around.
Click on the "Add Integration" button when you're done selecting — this will create the create the connections between the selected projects.
Navigation the marketplace flow
If you'd like to add or remove existing links between your Vercel and Editmode projects, our integration supports post-installation configuration —this can be accessed via the "Configure" button on the page of the installation instance of the integration.
Accessing the configuration URL
Making changes via the configuration URL
The CLI will let you get started with Marketing Site In A Box on your local machine.
To install the latest version of the CLI, run
npm i -g editmode-cli
You must own accounts on and be logged into both Editmode and Vercel in your command line before using this CLI tool. Editmode will ask you to log in on your first attempt to run any MSIAB CLI commands. To log into Vercel, simply run
vercel login(prefix it with
npxif you don’t have the Vercel CLI tool installed globally on your machine) and authenticate with one of the many options provided by Vercel.
To quickly start a new project, run this command from your project directory:
editmode starter msiab-lagos --git
The above command will generate a new theme (the “Lagos” theme), clone the MSIAB starter project from Editmode, install the dependencies of the theme, and instantiate a new git repository locally.
Arguments and Flags
The first three arguments
editmode starter msiab-lagosin the command above are required.
To generate a different theme, simply replace the
msiab-lagosargument in your command with the name of a different theme prefixed by
git initto instantiate a new git project
--deploywill deploy the theme to Vercel and open up your browser with the theme upon completion