What’s a component?

One of the most basic and important tools for any business is your landing page. When you’re building a new product, this page is likely your first and only point of contact with a prospective user, partner, or investor. It allows you to test and validate your idea before you even begin building. BowTie makes it easy to do all this an more.

With the recent release of the BowTie Collection Editor, we reworked our daily deal template to utilize collections in place of data files. This version of the template allows you to create and edit offers directly from the BowTie dashboard, making it an ideal option for client hand off.

The Collection Editor allows you to create, modify, or remove content on your project site from any browser. It’s ideal for content that changes often, marketing content and blog posts, and content with a similar format that is frequently repeated.

When using BowTie’s profile data and Zapier integration, collecting and connecting user input is as simple as a few lines of javascript. In this tutorial I will show you how to covert our standard contact form component to use Zapier.

Your site files are hosted in a private repository that you can modify using git, or using the BowTie editor. Visitors access your static site using Domains configured to point to your _site directory.

BowTie projects are created with a hosted domain (e.g. ‘example.bowtied.io’) and two environments (test, and live). You can add additional domains to customize the URL or to point to custom environments or branches within your repository.

This guide will explain how to configure domains on new and existing projects.

Hosted Domains

Setting Initial Domain on Project Creation

Create a brand new BowTie project by clicking ‘+Add Project’ from the top navigation of the BowTie dashboard, or clicking here.

Step 1: Choose a plain text name for your project. The hosted domain for your project will be based on your project name. If you select ‘this custom domain’ your default live domain will become ‘this-custom-domain.bowtied.io’ and default test domain will be ‘this-custom-domain-test.bowtied.io’.

Step 2: Select a template and click the ‘Add Project’ button. This will begin the installation process (which takes a few minutes).

If you have several projects, you can leave this screen once installation begins. The process will run in the background.

You can check the status or return to the process by clicking the alert indicator on the top right of your dashboard. You will receive an email from the BowTie System explaining how to access your files.

When the build completes, click the ‘Roll Out’ to access your dashboard and begin using your repo. Files will now be available at the address above.

Adding a New Domain (hosted)

You can add or reassign domains to any environment defined in your project. Each project is allotted up to 10 domains, as determined by your plan.

1. From the project dashboard, visit the Settings > Domains page and click ‘Add a Domain’.
2. Type a plain text domain, and select the environment you wish to add the domain to. BowTie will automatically configure DNS and SSL for that domain.
3. Click ‘Add Domain’ to being installation. The process will complete in a few minutes. You can leave this screen. Check the status, or return to the process by clicking the alert indicator on the top right of your dashboard. You’ll receive an email when the process completes (or fails).

Removing and Editing Domains

To remove an existing domain, click the ‘Settings’ button on the Settings > Domains page next to the domain you wish to modify, then click the ‘Remove Domain’ button.

Note: Custom domains purchased on BowTie that have been removed from a Project can be located and re-assigned from the Account > Purchased Domains page.

To edit or reassign an existing domain, click the ‘Settings’ button on the Settings > Domains page. The process to reassign a domain is two steps:

1. Select the environment/branch you wish to assign the domain to from the drop down list. Note: If you don’t have an available environment you can create a new environment.
2. Click ‘Update Domain’ to save your changes. The domain installation process will begin. You will receive an email when it is complete.

Custom Domains

Purchasing a Domain on BowTie

If you have a payment card on file, you can purchase new custom domains directly from the ‘Add Domain’ screen.

This is the easiest way to use a custom domain on BowTie. Custom domains vary in cost. The amount is determined and presented when you add a TLD in the field (e.g. ‘example.co’). We automatically include and configure SSL certificates for every custom TLD added to your project.

1. To purchase a new custom domain, visit the Settings > Domains page and click ‘Add a Domain’.
2. Type your desired domain including the TLD (e.g. ‘thiscustomdomain.xyz’). The price will vary based on the domain you are trying to register and you need to have an active card on file in order to purchase a domain.
3. Now, select the environment you wish to add the domain to from the dropdown and click ‘Attach Domain’. BowTie will automatically configure DNS and SSL for this custom TLD.
4. The installation process will complete in as little as a few minutes but may take an hour to propagate. You can leave this screen and check the status, or return to the process by clicking the alert indicator on the top right of your dashboard. You’ll receive an email when the process completes.

Adding a Domain Purchased Elsewhere

You can configure your BowTie project to work with with domains or subdomains purchased elsewhere. Follow the instructions below to complete the process:

1. Navigate to the ‘Add Domain’ interface found at ‘Settings’ > ‘Domains’, and enter the domain name you would like to point to your BowTie project. You will see a prompt to alert you that the domain is not available for purchase, and that you can proceed if you own it.
2. Select the environment you would like to associate with this domain, to (e.g. ‘live’ or ‘test’), and click ‘Add Domain’. Note: If you don’t have an available environment you can create a new environment.
3. Click ‘Add Domain’. This will being a multi-step installation. BowTie will assign an SSL certificate for your domain, then provide you instructions to configure your domain’s nameservers.
4. After receiving the list of nameservers from the BowTie interface, navigate to the nameserver configuration at your registrar and make the suggested changes. You will also receive an email containing the nameserver settings.
5. When you return to BowTie, Click ‘Resume’ on the installation page to continue the installation.

Please ensure that you’ve updated your DNS properly and give them time to resolve. The installation process may complete in as little as an hour, but may take 24 hours to propagate.

You can check the status, or return to the process by clicking the alert indicator on the top right of your dashboard.

Configuring a Subdomain

Subdomains (e.g. ‘project.example.com’ or ‘www.example.com’) are treated like any other domain on BowTie and can be assigned to any environment defined in your project.

1. From your dashboard, visit the Settings > Domains page and click ‘Add a Domain’.
2. Next, type the subdomain (for a domain you already own or manage) into the field and select the environment you wish to add the domain to.
3. Click ‘Add Domain’ to begin the installation. BowTie will automatically configure DNS and SSL for this subdomain.
4. If you would like your BowTie site to appear as a subdomain of a property hosted elsewhere, the installation instructions will be similar to the steps in ‘Adding a Domain Purchased Elsewhere’

The installation process may complete in as little as an hour, but may take 24 hours to propagate if you have to change nameservers. You’ll also receive an email when the process completes. You can check the status, or return to the process by clicking the alert indicator on the top right of your dashboard.

Using a third party DNS provider to Control Subdomains

Some registrars will not provide the ability to update DNS settings for a subdomain. In this situation, we recommend you use a third party DNS provider that supports this such as DNSimple or DNS Made Easy.

You can also use a CNAME record to point to your BowTie Project at the ‘x.bowtied.io’ domain (where ‘x’ is the portion of the domain chosen for your project).

Other Domain Features

Google Apps Email Configuration

Your BowTie project is preconfigured to use Google Apps for email. Using Google Apps Email requires zero configuration. We automatically install the required MX records with every domain added to your project.

To verify ownership of your site, we recommend using the META tag method.

One of the best reasons to use Google Apps with your BowTie account is that you have the ability to leverage the Zapier Gmail integration. Combined with our integration you will have a number of options for contact forms and lead generation.

Note: BowTie does not directly suport the customization of MX records within the Dashboard. Contact us for assistance in setting up other custom MX records.

Custom Test Environments

Environments allow you to separate test users, transactions, and project settings from your primary Live application. Environments are associated with a unique domain, and can be associated to a unique branch in your repository.

To create a new Staging environment:

1. Create a new domain under the ‘More’ > ‘Domains’ tab in your BowTie dashboard (set any environment initially).
2. Visit the ‘Environments’ tab in your dashboard and select ‘Add Environment’
3. Name the environment (e.g ‘Staging’), choose a branch from your repository (e.g. ‘/staging’), and point it to an available domain (such as the one you just created).
4. Toggle ‘Use Stripe Live Mode’ if you intend to take real transactions in this environment, or leave it unchecked for test transactions.

Learn more about adding environments.

If you are new to BowTie, check out our other Getting Started guides.

Getting Started with BowTie:

• Build a Landing Page in 5 minutes
• Using the BowTie Collection Editor
• Initial Configuration
• Setting Up Custom Domains
• Customizing and Styling BowTie frontend content
• Build a website with a pay wall
• Blogging with BowTie
• Launch a simple donation site
• Using BowTie’s User Profile system
• Build a Daily Deal Site with Jekyll Collections
• Using Jekyll Data to extend your site
• Adding BowTie users to MailChimp with Zapier

To keep up to date, follow us on twitter at @bowtie_io

Questions? Please comment! Thanks for your support and feedback.

BowTie provides a lightweight and easy way to collect and save information about a user, without using a database. Our User Profiles eliminate the need for a backend and allow you to record and pass information back to your site or to a third party service with ease.

BowTie’s Project API is built for explicit compatibility with some really cool authorship and administrative tools. One tool I’ve admired and enjoyed using is an open source content editor called Prose.

BowTie allows you to host content from practically any static site generator or framework. This post will show you two methods for hosting Middleman, and show you how to take advantage of some of BowTie’s other features when using Middleman for content generation.

User Profiles are one of the my favorite BowTie features. We store every user record in our database so you don’t have to maintain one, and give you access to your users with simple APIs. User Profiles contain a number of predefined values, and can be customized to suit your needs.

A marketing agency recently reached out for help creating a Groupon-style daily deals site for their clients. Their goal was to be able to quickly create ‘special offer’ pages that could capture secure payments without having to worry about scale or security. This was a good use case for a BowTie project that takes advantage of our Stripe Checkout integration, and the functionality included in Jekyll data files.

If you’re using BowTie’s User Management system, you can leverage Zapier to connect to dozens of third party marketing, business management, and communication services. In this post I’ll show you how to connect your BowTie project to Zapier, and build an example integration to Mailchimp.

BowTie’s user management system makes it easy to store and use oAuth2 tokens from our integrated social accounts. This gives your BowTie application access to your users’ account information from each provider, and allows both user registration and login. At the moment, we have both Google and Twitter oAuth2 functionality.

If your site or web app includes content or functionality that you would like to secure or monetize, you can benefit from BowTie’s policy management and payment microservices. BowTie allows you to set and restrict access within your frontend environment with incredible ease.

With Bowtie’s donation template and Stripe Checkout integration, spinning up a static website and accepting donations for any cause is simple.

One of the most powerful features baked into BowTie is the hosted blog. You can use BowTie as a standalone markdown blog, or use our proxy to link a BowTie marketing site to another URL or subdomain.

This guide will show you how to make style changes to basic BowTie themes, work with our existing templates, and use our underlying static site generator to modify and create templates of your own. BowTie’s library of static components can be used as is, customized, or used as a reference to build components in another language.

This post describes the basic configuration of a BowTie provided Jekyll template expected to be performed by the site developer or designer. If you are using the hosted editor to update content on your site, begin with our getting started guide or request a workflow from the developer who set up your site.

One of the most basic and important tools for any business is your landing page. When you’re building a new product, this page is likely your first and only point of contact with a prospective user, partner, or investor. It allows you to test and validate your idea before you even begin building. Your landing page should be lightweight, responsive, and easy to update.

Note: This guide is for Windows users. If you are working on a Mac, Start with our docs.

This post will walk through the basics of getting spun up on BowTie, and demonstrate our recommended workflow. BowTie is designed for developers and agencies building sites and static apps for clients. We provide a git based workflow for developers and designers, and a simple and customizable cloud editor for non-technical content creators.