Your website, in your hands.

The left panel changes things. The right panel shows them.

That one idea is the whole editor. On the left you make changes. On the right you see exactly what a visitor will see. The right side is a live preview: you never type on it directly.

mainfolk.com/sites/your-site/website

1 You edit here 2 Live preview of your site

The editor: controls on the left, a live preview on the right.

There are two ways to open something for editing, and they do the same thing:

1. Click it in the list on the left.Each row is one part of your page. Click a row to open its settings.
2. Or click it in the preview on the right.Click any headline, photo, or button in the preview and its controls open on the left, ready to edit.

You cannot lose your work. Every change is saved the moment you make it. And nothing is public until you press Publish changes, so feel free to experiment.

How to open the editor

Start from your dashboard, pick the page you want to work on, and you are in.

1. Log in at mainfolk.com/login.Use the email you signed up with. We send a magic link, so there is no password to remember.
2. Open your site from the dashboard.If you run more than one site, choose the one you want.
3. Choose a page under Pages (for example, Home).The editor opens with that page's controls on the left and the preview on the right.

What the buttons across the top do

The bar along the top of the editor holds the controls you use most often.

The editor top bar

Your page is a stack of sections

A section is one band of your page: a hero banner, a block of text, a row of cards, a contact form. The list on the left shows them top to bottom, in the same order they appear on your site.

The section list

Each row is one section. Click a row's name to open it for editing.

The small icons on each row let you manage that section without opening it. Here is what each one does:

Change any words on your page

Open a section and its fields appear on the left. Type in a field and the preview updates as you go.

1. Click the section you want to change.It opens to show its fields, like Eyebrow, Headline, and Sub-headline.
2. Click into a field and type.Each field has a small grey hint under its name telling you what it is for.
3. Watch the preview update.Your new words appear on the right. There is no Save button, it saves as you type.

A section open for editing

Fields for the Hero banner. Every field has a plain-English hint under its name.

Replace a picture with your own

This is the one people ask about most, so here it is in detail. Every photo on your page has the same four controls.

The photo controls

1. Open the section that has the photo, and find the Image control.You will see a small preview of the current photo and four buttons beside it.
2. Replace photo puts your own picture in.Choose a photo from your computer or phone. JPG, PNG, or WEBP files work best.
3. Stock photo searches thousands of free professional photos.Type what you want (for example "candles" or "main street"), then click one to use it.
4. Library reuses a photo you have already added.Everything you have uploaded lives here, so you never have to upload the same picture twice.
5. Remove takes the photo back out.The spot falls back to its default. Add a new one any time.

Add something new to the page

Need a new band on your page, like a row of photos, a set of hours, or a contact form? Add a section.

1. Click + Add section at the top of the section list.A gallery of building blocks opens, each with a short description of what it is.
2. Pick the block you want.It is added to the bottom of your page, ready to edit and move.
3. Edit it and drag it into place like any other section.

Add a section: the block gallery

Every block has a one-line description so you can pick the right one.

Reorder, hide, duplicate, or delete

You are never stuck with a layout. Use the row icons from step 4, or drag.

1. Reorder: drag a section by its handle (the six dots), or use the up and down arrows.
2. Hide: click the eye to take a section off the live site without deleting it. Great for something seasonal.
3. Duplicate: click the copy icon to clone a section as a starting point.
4. Delete: click the trash icon. It asks first, and Undo brings it back.

Make your changes go live

Your edits are saved as a private draft as you work. The public does not see them until you publish.

1. Review your page in the preview, and check it on phone with the device buttons.
2. Click the red Publish changes button, top right.Your updates go live within a few seconds.
3. That's it. The status returns to a calm "Live" with no pending changes.

More than one page

Most sites have a few pages: Home, About, Contact, and so on. Everything above works the same on every page.

1. Click ← Pages at the top left to see all your pages.
2. Open any page to edit it, or add a new one.You can rename a page and choose which one is your home page.
3. Your menu (the links across the top of your site) is set in the Header & Footer area, so visitors can find every page.

Make a button open a PDF

Have a gift guide, a menu, a flyer or a form you want people to open? You can point any button or menu link at a PDF. It opens in a new tab, so visitors never lose their place on your site.

1. Open the button you want to change.Click the section that holds the button, then find its link. Buttons, cards and menu links all work the same way.
2. Click Upload a PDF under the link and choose the file from your computer or phone.PDFs up to 20 MB work. Anything that is not a real PDF is turned away with a message.
3. Check the file name.Once the PDF is added you will see its name and the words "opens in a new tab" where the web address used to be. Remove takes it off again.
4. Publish.Visitors who click the button see your PDF in a new tab.

Make a button open another website

Want a button to send people to a store, a partner, a sign-up form or any other website? Every link in the editor asks the same question, Where should it go?, so it works the same on buttons, cards, banners and menus.

1. Open the section that holds the button.Click the section, then find the button. Type what the button should say under Button text, for example "Learn more".
2. Under Where should it go? choose Another website.The other choices are a page on your site, a PDF file, an email address and a phone number.
3. Type or paste the website address.You can leave off the https://. Typing example.com works.
4. Check the line that says Goes to:It names the website the button opens. Click Test link to try it in a new tab before you publish.
5. Publish.Visitors who click the button see that website in a new tab, so your own site stays open behind it.

Put a photo on a card instead of an icon

Feature cards show a small icon by default. Give a card a photo and the photo takes the icon's place, at the top of the card with the title underneath. It is a good fit for a list of ways to volunteer, committees, programs or team areas.

1. Open the Feature cards section and pick the card you want to change.The numbered buttons under Cards switch between cards.
2. Find Photo (optional) and click Upload, Stock or Library.The help line under it reads "Add a photo and it replaces the icon." The same photo controls work here as everywhere else in the editor.
3. Repeat for the other cards.A card with no photo keeps its icon, shown in a tinted panel the same size as the photos, so every title lines up in a tidy row.
4. Changed your mind? Click Remove next to the photo.One click and the card goes back to its icon.
5. Publish.A card that links somewhere stays clickable as a whole, photo and all.

A few things people ask