Carrd Tutorial: Getting Started With Carrd Part 1

Table of contents

Carrd is an intuitive, user-friendly platform that allows you to create simple, responsive, one-page websites quickly and easily. 

Whether you’re building a personal profile, a landing page, or a portfolio, Carrd provides a wide range of customizable templates and tools to help you bring your vision to life without needing extensive technical skills.

This guide is designed to help you get started with Carrd, walking you through the basics of setting up your first site. We’ll cover everything from signing up and choosing a template to customizing your content.

Accessing the Editor

To begin editing your site in Carrd, you first need to access the editor.

Steps:

1) Log in to Carrd: Go to the Carrd website and log in to your account.

2) Open your site: Select the site you want to edit from your dashboard or click on “Choose a Starting Point”

Image: Choose a Starting Point

3) Enter Edit Mode: Click on “Blank page” or on a template to enter the editing interface.

Image: Select Blank Page

Editing the “Page”

This is our step-by-step example.

1) Click on “Page”:

Image: Click on the Menu Tab
Image: Drag the width slider

2) Change Width:

Image: Drag the width slider

3) Change the margins:

Image: Drag the margins slider

Changing Background

Customize the background of your site or specific sections to enhance visual appeal.

Steps:

1) Add Background: Click on “Menu” and select “Background” alternatively click on the area you want to change the background for (e.g., section, container).

Image: Click on the Menu Tab
Image: Click on background

2) Change Background Color: Use the color picker to choose a new background color.

Image: From style choose color option

3) Add Background Image: Click "Add Image" and upload a new background image or you can pick stock images from the Carrd library.

Image: Add a backround image

4) Adjust Background Settings: Modify the image size, position, and repeat options as needed, this option is available only if you “Upload” an image.

Image: Modify the image size

Adding Text

Learn how to add a text element to your Carrd site.

Steps:

1) Add Text Element: Click the "+" button and select "Text" from the menu.

Image: click the + button from the menu
Image: click on text

2) Position Text Element: Drag the text element to your desired location on the page.

Editing Text

Steps:

1) Select Text Element: Click on the text element you want to edit.

Image: Select a text element

2) Change Text Content: Type your new text in the text box.

Image: edit the content of text

3) Format Text: Use the Markdown from below to bold, italicize, or underline your text.

4) Adjust Text Alignment: Choose left, center, or right alignment.

Image: choose an alignment

5) Change Text Size: Drag the slider or type any number you want to adjust the text size.

Image: Change the size of text

Example

Here we will demonstrate how we applied these changes on a blank page.

Once you click on a text element you can start editing it like so.

  1. Changing the color of the text:
Image: Change the color of text from the appearance settings

For this we used a normal color like black.

  1. Choosing a Font:
Image: Choose a font

We chose the Font Poppins.

  1. Changing the size:
Image: Change the size of text

We chose 3, you can either type the size you want or drag the slider to your liking.

  1. Changing the Weight:
Image: Change the weight of text

We picked Medium weight.

  1. Picking Alignment:
Image: choose an alignment

Your options here are (Auto,Left,Center,Right and Justify), Justify gives your text straight edges on both sides of the paragraph.

  1. Changing the content of Text:
Image: edit the content of text

Lastly, as I mentioned above you can change what type of text you want from this panel. 

Adding Containers

Learn how to add containers to structure your content in Carrd.

Steps:

1) Add Container: Click the "+" button and select "Container" from the menu.

Image: click the + button from the menu
Image: click on container

2) Choose Container Type: Select the type of container (e.g., Default, Columns).

Image: Choose the type of Container

3) Position Container: Drag the container to your desired location on the page.

Editing Containers

Here’s how to edit containers to structure your content.

Steps:

1) Select a Container: Click on the container you want to modify.

Image: Select a container

2) Adjust Container Size: Drag the Sliders to resize the container.

Image: Drag the width slider

3) Move the Container: Click and drag to reposition the container.

4) Customize Appearance: Use the style options to change appearance settings such as:

  1) Margins:

Image: Change the margins top
Image: Change the margins bottom

  2) Color:

Image Choose a color

  3) Width:

Image: Drag the width slider

  4) Height:

Image: Drag the height slider

  5) Position:

Image: chaneg the position

Conclusion

Getting started with Carrd is a straightforward process that empowers you to create clean, professional-looking websites with ease. In this guide, we covered the essential steps for editing the basic elements, which are important in customizing your site’s content and layout. 

By mastering these basics, you’ve taken the first important steps toward building a site that reflects your personal style or brand. As you continue to explore Carrd’s features, remember that the platform’s simplicity is matched by its flexibility. 

Experiment with different design elements, explore advanced options, and refine your site to suit your needs. With Carrd, you have the tools to create a beautiful and functional web presence with ease.

Happy building!