Create a One Page Website with Carrd in Less than 10 Minutes!
If you need a quick, one-page, fully responsive website without all the muss and fuss of big CMS platforms such as Joomla, Drupal, or WordPress, then look no further! Whether you need to spin up a quick personal profile page, or a landing page that collects emails for a product or service that you offer, Carrd has you covered. In less than 10 minutes, you can spin up a single page site for FREE. It’s true!
According to their website, you can create up to 3 sites per account that have access to all of their core features for FREE. They do offer an upgrade to a PRO account that costs $19 per year that gives you custom domains, forms, google analytics, more sites, and the ability to embed your own custom widgets and code from 3rd party services (Think PayPal, Stripe, Typeform, etc).
They also say you can get started without signing up, so let’s see if that’s true.
- Click on the Choose a Starting Point button
2. Choose from All, Categories (Profile, Landing, Form, Portfolio, Sectioned), or a blank canvas to get started. If you rollover a design image, you can either Select it or Demo it. You can start from scratch by clicking the rectangle icon in the upper right-hand corner:
I selected Sectioned, because I wanted to try out their “multipage” experience instead of a single page.
NOTE: Form category templates are only accessible to PRO subscribers.
3. Scroll through and select a design image. I chose the last one on the page: Samantha Carter.
The first thing that pops up is an explanation page:
After studying that for a few minutes I clicked the Okay, got it! button in the lower right corner.
I decided to start with the image.
- Click on the image you wish to replace
An editing panel will slide into view from the left side of the screen. - Click Upload
- Navigate to the image you wish to upload
- Pull on the purple dots to crop the image
5. Click Accept in the upper right-hand corner
You can also add Alt Text, or a URL link if you so choose. It is NOT required. You will notice 3 other icons at the top of the side panel: Appearance, Animations, and Settings. Be sure to click on each of them to see all the things you can customize like height, width, shape, border, drop shadow, etc! Have fun, try things out, don’t be afraid. You can’t break anything here.
6. Click the Done button once you are ready to move on
Next I wanted to change the name field, so I clicked right on top of “Samantha“. As you might have guessed, an edit panel slid out from the left side of the screen (Spoiler: this will happen every time you click on an area/section). Simply type in the text field to change the name on the page. And just like the others, this section also has Appearance, Animation, and icons for you to explore.
To change my title from Chief Psychonaut to Chief Creative Officer, I clicked on the words “Chief Psychonaut”.
- Type the new title
- Change anything else on the Appearance and Animation tabs to suit you
- Click Done button
Super Easy!
Continue on down the page clicking in each section and replacing it with your own words, making changes to colors, spacing, etc
NOTE: If you change a section title (ABOUT OR CONTACT) to something completely different, you will need to scroll to the top and change the word on the menu button to match. It does not automagically do that for you.
- Click on the button area at the top of the page
- Click on the word you wish to change (OR click the Add button to create a new button)
- Click Done button when finished
I’m noticing that pretty much everything is clickable and customizable if you want more control over the template. For example, if you want a colored background, simply click in the blank space to the side of the content. Or, if you want colored menu button, click on them and the side panel will show you all the options available.
If you would like to ADD something your page/site, simply click on the + sign to drop down a list of items that you can add.
I clicked on Image and Carrd added it to the bottom of the page, but you can then drag & drop it to a new spot very easily. If you change your mind about it or if you wish to delete a pre-existing element:
- Click on the element
- Click on the trash can icon next to the Done button at the bottom of the edit panel
When I was finished with all the changes I wanted to make, I clicked the phone icon from the grey menu bar up top.
And instantly I saw how my elements would react on a mobile phone:
Once you are happy with what you see, simply Publish it by clicking the floppy disk icon (the icon that has the green dot in the upper right corner).
The following side panel appears with 3 icons up top: Publish, Media, and Settings (Google Analytics ID can be entered on this panel if you are a PRO subscriber).
- Create an account on the Publish panel
- Select Publish to a .carrd.co URL or select Save as an offline draft if you are not finished with it
This is when you are actually creating an Account with Carrd. You will use this same information to manage the site after it’s published. (If you already have an account, then you simply click the Log in text link provided.)
Nothing on the Media panel is accessible to non-PRO subscribers.
On the Settings panel, you can change the Language of your site, but that is all you can do as a FREE user on this panel.
3. Click the Publish button at the bottom of the panel
And presto, you have a one page site, and like the template we selected, you can make it appear like a multiple page site!
So, it is TRUE that you can get started without signing up or creating an account; however, you WILL have to create an account to publish your finished site and make it “live”.
If you need something FREE and quick, this might be a solution for you. Pop by their site and check it our for yourself. They have plenty of examples and a Documentation section that provides answers and instructions for the most common tasks and questions.
All-in-all this was a painless experience for me, and the $19 per year fee to Go Pro and unlock Carrd’s full potential is just crazy talk!! That’s cheap people!