Carrd Tutorial: How to Make Your Own One-Page Website

PDF download Download Article
Create your own stunning website for work or fun
PDF download Download Article

Years ago, creating a website wasn't always the easiest for the typical internet user. Thankfully, making your own stunning website is now easier than ever, and one place you can do this is Carrd. Carrd allows you to create simple but aesthetically pleasing single-page websites and is used for everything from professional portfolios to personal "about me" pages—all with no coding experience required.

Things You Should Know

  • Carrd is free to use, but offers paid plans if you need more features.
  • You can start with a premade template and use it as is, or edit it to fit your needs.
  • If you feel creative, Carrd allows you to build your own webpage from scratch.
Section 1 of 3:

Creating with a Template

PDF download Download Article
  1. Go to Carrd.co . You can get started with designing a Carrd right away, or you can sign up beforehand by clicking the Log In button. There is a button to sign up on the login page, where you can enter your details such as email and desired password.
  2. If you're not on your dashboard, click the first icon in the left-hand sidebar that looks like a 2x2 grid of rectangles.
    Advertisement
  3. Carrd has a number of pre-made templates to make creating a site easier. Some of these templates are free, and some require a pro membership. The pro templates are denoted by a yellow tab in the corner of the template image that says PRO .
    • Use the dropdown at the top of the screen to sort the templates.
    • Hover a template you like and click Demo to see a preview of the template, to ensure it will work for your needs.
  4. This will open the template in the site editor.
  5. The first time you enter the site editor, Carrd will show an overlay explaining what each button does. You can go to Menu > Instructions to view this overlay again. [1]
    • The toolbar at the top of the screen has options to add an element, undo, redo, preview animations, switch to mobile view, and publish your site, as well as a three-line menu icon for other actions
    • Click on any element on the page to bring up its properties so you can edit it or delete it
    • Drag and drop elements to rearrange them on the page
  6. Before you get started, explore by clicking on elements and looking at how they work. Clicking on an element will bring up a popup sidebar that allows you to edit it. These sidebars have multiple tabs. Each element has different tabs, so click through those tabs to see what you can do with the site editor.
    • Most elements have a tab to edit the content of the element (text, image, etc.), a tab to edit the parameters or properties of the content (font size, image size, etc.), and a tab to edit the animation of the content (how it appears when the page loads).
  7. Most templates have a textbox near the top of the page in a larger font, or typeface. This is the title of the site, and what the site's title is may vary. You may want the site's title to be your name if you're creating a portfolio, or it could be the name of your business if you're making a website for your store.
    • The title can be anything you want. If you select a template that suggests a name is the title of the webpage, you can change it to something different.
  8. If you see any boxes on the page with a big X through them, you should insert an image. Add a relevant image (i.e. a picture of you if you're making a personal portfolio, or an image relating to your business if you're making a website for your store).
    • You must place an image in each image box before you can publish your site. If you're not sure what image to place in the box, you can insert a placeholder image instead, or delete the element by clicking on it and selecting the trashcan icon.
  9. Lorem ipsum is used as placeholder text, and looks like Latin words. If you see text on your site that is lorem ipsum text, replace it with relevant text. This could be a website subtitle, description, paragraph, or the title of a button or link.
  10. Some elements can be linked, including buttons or icons. If a button or icon has a logo of a social media site or an icon of a phone or envelope, it is likely intended to be a link to a social media profile, telephone number, or email address. [2]
    • Links can be added by clicking on the button or icon, then clicking on the name of the particular button or icon you want to edit in the sidebar.
    • Buttons and icons can be changed to fit your needs. If the template gives you a space to link your Instagram and Facebook, but you only have a Twitter/X and Deviantart, you can change the icon on the icon or button to match what link you're inserting. Buttons and icons have a dropdown list of many symbols and logos for you to choose from.
  11. You can adjust the background color as well as add a background pattern, gradient, or video. You can also adjust the page type and add page animations.
  12. Just because the template is set up a certain way doesn't mean you have to keep it that way. Play around with the site layout by rearranging, adding, or deleting things.
    • Drag and drop elements to rearrange them. You can rearrange the order of a list of buttons or icons by dragging the name of the button or icon in the popup sidebar.
    • Delete items you don't need by clicking on them and clicking the delete button at the bottom of the sidebar. If you want to delete just one button or icon, click the trashcan button next to that particular button or icon.
    • Add items by clicking the plus button on the toolbar at the top of the page. You can add a variety of elements to a page. Your template probably already has text, images, buttons, and icons, but you can also add lists, videos, audio, galleries, and more. Pro users can add slideshows, forms, widgets, and embeds. More advanced users can use containers and controls to further design their websites. You can also add new elements by duplicating existing ones by clicking on the existing element and clicking the duplicate button at the bottom of the sidebar.
  13. If you didn't sign up yet, Carrd will prompt you to do so before you can publish your site. Otherwise, fill out the information in the sidebar:
    • Title : The name of your site that will appear at the top of the browser window, in search engines, or in an embed when you share your Carrd link
    • Description : A brief description of your site that will be included in a search engine listing
  14. You can pick from a few different URLs in the dropdown under Action . Once you've decided on a URL, add your custom URL name. Each URL must be unique, so no two Carrds can have the same URL name. The URL name must also not have any symbols or spaces.
    • You can also save your Carrd as an offline draft if you want to edit it further. If you have a pro plan, you can publish to a custom domain, which involves purchasing a domain name from a domain name seller and connecting it with your Carrd by connecting the host and target with your custom domain.
  15. Once your site is published, Carrd will give you a confirmation popup with a link to your website so you can view it.
    16. Advertisement
Section 2 of 3:

Creating with a Blank Canvas

PDF download Download Article
  1. Go to Carrd.co . You can get started with designing a Carrd right away, or you can sign up beforehand by clicking the Log In button. There is a button to sign up on the login page, where you can enter your details such as email and desired password.
  2. You can go in without a plan if you prefer to just play with the website builder, but if you have a specific idea in mind, draft it on paper or in image editing software before you begin.
  3. If you're not on your dashboard, click the first icon in the left-hand sidebar that looks like a 2x2 grid of rectangles.
  4. You can also click the dotted-line rectangle in the upper-right corner to start from scratch.
  5. You can select a background color (or gradient, pattern, or video).
  6. Click this to edit the page, which allows you to customize the page style, position, width, and size. You can also adjust the padding, which increases the space between the content on the page and the edge of the page border.
    • Note that the padding will only be apparent if you pick a box page style.
  7. You can click the text box that says "Nothing here yet! :)" and edit it to fit your needs, or delete it entirely.
  8. You can add text, images, lists, buttons, links, and more, depending on the layout you're going for. [3]
  9. Click on each element to edit it. You can edit the content of the element as well as the properties of the element by selecting the tabs in the sidebar. You can change font, font size, image size, element padding, element spacing, and more.
  10. Containers and controls are a bit more advanced, but can allow you to format your webpage and organize your elements:
    • Containers allow you to create columns. You can also leave the container a single column if you want to add spacing (padding) around all or part of the elements on a page. [4]
    • Controls allow you to create sections or scroll points. Controls have names that start with a #, like #about . You can create the illusion of a multi-page website with controls by creating a button that links to your control, such as carrdname.carrd.co/#about . Anything beneath the gray control bar on the site editor will be on the new "page". [5]
  11. If you're creating a portfolio, you may want links to your social media pages or email. If you've created a Carrd with controls to make different sections, you should include navigational buttons that link to each control as well as the homepage for easy navigation.
  12. If you didn't sign up yet, Carrd will prompt you to do so before you can publish your site. Otherwise, fill out the information in the sidebar:
    • Title : The name of your site that will appear at the top of the browser window, in search engines, or in an embed when you share your Carrd link
    • Description : A brief description of your site that will be included in a search engine listing
  13. You can pick from a few different URLs in the dropdown under Action . Once you've decided on a URL, add your custom URL name. Each URL must be unique, so no two Carrds can have the same URL name. The URL name must also not have any symbols or spaces.
    • You can also save your Carrd as an offline draft if you want to edit it further. If you have a pro plan, you can publish to a custom domain, which involves purchasing a domain name from a domain name seller and connecting it with your Carrd by connecting the host and target with your custom domain.
  14. Once your site is published, Carrd will give you a confirmation popup with a link to your website so you can view it.
    15. Advertisement
Section 3 of 3:

Carrd Free vs. Premium

PDF download Download Article
  1. Carrd can be used completely free, but free accounts have some limitations. Carrd offers three premium plans: Pro Lite, Pro Standard, and Pro Plus.
    • Free accounts cost nothing, but you can only host one site with a maximum of 50 elements on the site. (Elements are images, text boxes, buttons, links, etc.) Your site will also have Carrd branding at the bottom and you cannot use a custom domain nor can you add forms, commerce widgets, or custom code.
    • Pro Lite is $9 per year and allows you three sites with no element limit and no Carrd branding. You can't use a custom domain, forms, or commerce widgets, but you can add multiple editors to your site, transfer your site, and use custom code.
    • Pro Standard is $19 per year and allows you 10 sites. Along with the perks of the Pro Lite tier, you can add a custom domain as well as use forms and commerce widgets.
    • Pro Plus is $49 per year and allows you 25 sites. Along with the perks of the previous two tiers, Pro Plus allows you to customize your site's meta tags as well as download the HTML so you can host your site somewhere else.
  2. Click on your user profile in the lower-right corner and scroll down to Plans . Click the Change button to change your plan, and follow the on-screen instructions to upgrade if you choose to do so.
    • The basics of creating a Carrd are the same whether you have a free or paid plan. A paid plan is beneficial if you know you'll need to place more than 50 elements on your site, or you want to host multiple sites. Otherwise, if you're just testing out Carrd or only need a simple site, the free plan should be more than enough for your needs.
    3. Advertisement

Expert Q&A

Ask a Question
200 characters left
Include your email address to get a message when this question is answered.
Submit
      Advertisement

      Video

      Tips

      • Don't post content against Carrd's TOS. Carrd does not allow pornographic content, but allows adult-oriented artwork. It also does not allow content that depicts illegal activity, is libelous or defamatory, or is invasive of someone else's privacy. [6]
        Thanks
        Helpful 0 Not Helpful 0
      • Don't be afraid to experiment and explore. If you want to make a site from scratch but you don't know how to lay one out, look at some of the premade templates for inspiration. Open one up to see how the elements are formatted before creating your own.
        Thanks
        Helpful 1 Not Helpful 0
      • Look up tutorials. There are a lot of tutorials for Carrd layouts, so if you're not sure where to begin or you want to recreate a design you saw, starting with a specific tutorial can be helpful.
        Thanks
        Helpful 1 Not Helpful 0
      Show More Tips
      Submit a Tip
      All tip submissions are carefully reviewed before being published
      Name
      Please provide your name and last initial
      Submit
      Thanks for submitting a tip for review!
      Advertisement

      You Might Also Like

      How to
      Copy a Website: Cloning & Using Designs as a Template
      A Complete Guide to Making Your Own Website
      How to
      Make a Free Website: Site Builders, Expert Tips, & More
      How to
      Troubleshoot Cloudflare Code 522: Fixes, Workarounds, & More
      How to
      Make a Free Website Using Wix: Easy Guide
      How to
      Get a Free Web Site
      How to
      Make a Website With Word
      How to
      Fix the 415 Error on Your Website: Meaning & Solutions
      A Complete Guide to the Best AI Website Builders
      Need a Small Business Website? Try One of These Website Builders
      Advertisement

      References

      1. ↑ https://carrd.co/docs/building/overview
      2. ↑ https://carrd.co/docs/building/url-types
      3. ↑ https://carrd.co/docs/building/basics
      4. ↑ https://carrd.co/docs/building/organizing-elements-into-columns
      5. ↑ https://carrd.co/docs/building/using-sections
      6. ↑ https://carrd.co/docs/general/content-policy

      About This Article

      Thanks to all authors for creating a page that has been read 15,991 times.

      Is this article up to date?

      Advertisement