{"id":6047,"date":"2020-11-25T12:39:32","date_gmt":"2020-11-25T12:39:32","guid":{"rendered":"https:\/\/colibriwp.com\/blog\/?p=6047"},"modified":"2023-03-28T09:52:24","modified_gmt":"2023-03-28T09:52:24","slug":"how-to-build-a-wordpress-website-in-2021","status":"publish","type":"post","link":"https:\/\/colibriwp.com\/blog\/how-to-build-a-wordpress-website-in-2021\/","title":{"rendered":"How to Build a WordPress Website in 2021 in 6 steps. An A to Z Guide"},"content":{"rendered":"

Back in 2017, there was an opportunity at the company I was working in to learn web design.<\/p>\n

I began learning HTML, CSS, and Javascript. I pretty much enjoyed it. Until I ran into my first bugs. Later on, I was assigned a side project: an actual website. I was thrilled, my colleagues were there for me when I asked for help.<\/p>\n

A few months later I was working on a pro-bono WordPress assignment for an NGO.<\/p>\n

Let me state that we were in the travel market and I was doing marketing. But there was this culture of empowering people in learning new skills.<\/p>\n

I am the DIY type and realized that the learning curve for learning code is far longer than expected. With WordPress, things worked differently.<\/p>\n

Fast forward, in 2020, I ended up working for the Colibri makers, Colibri being a popular WordPress drag and drop page builder.<\/p>\n

Things are so easy today with such tools. WordPress can really empower people to build a website from scratch in no time. And inspiration for websites is just…all over the internet.<\/p>\n

Now, here are steps:<\/p>\n

    \n
  1. Choose your domain name<\/span><\/a><\/li>\n
  2. Acquire website hosting<\/span><\/a><\/li>\n
  3. Get familiar with the WordPress interface<\/span><\/a><\/li>\n
  4. Install a WordPress theme<\/span><\/a><\/li>\n
  5. Build your WordPress website<\/span><\/a><\/li>\n
  6. Install vital WordPress plugins<\/span><\/a><\/li>\n<\/ol>\n

    Because having some steps ain\u2019t enough for having a supercalifragilisticexpialidocious website, I have one bonus for you at the end of the guide: UX design tips and tricks.<\/p>\n

    But before jumping into the topic, I want to shine a light on another subject. Won\u2019t take long, I promise.<\/p>\n

    How much does a WordPress website cost?<\/h2>\n

    If we are to make a cost breakdown for a WordPress website, here\u2019s what we should include:<\/p>\n

      \n
    • Buying a domain: prices can begin at $15\/year<\/li>\n
    • Hosting acquisition: prices start as low as $8\/year<\/li>\n
    • WordPress theme. Now, depending on the levels of customization and how many features you want to include, you can start with $0. If you don\u2019t want to settle with a basic website, yearly WordPress theme plans revolve around $70.<\/li>\n
    • WordPress plugins. Many of them are free of charge, but if you want advanced options, you\u2019ll need to upgrade to a paying plan.<\/li>\n<\/ul>\n

      This means that the most basic website will start from $23\/year. The moment you want advanced theme features, the cost will rise to about $100\/year.<\/p>\n

      When you upgrade plugins, you might end up paying around $200-500 a year.<\/p>\n

      If you want something custom made<\/a>, and you need to call in a WordPress developer, the costs can go over $1000 in the first year.
      \n      <\/a><\/p>\n

      For online stores, the costs can increase significantly, because you need lots of functionalities, and performance and security are top of mind.<\/p>\n

      Now that we clear this out, it\u2019s time to get to the bottom of our topic today: how to create a WordPress website in 2021.<\/p>\n

      1. Choose your domain name<\/h2>\n

      \"choose<\/p>\n

      Source: https:\/\/unsplash.com\/photos\/N1XUwR8iOf0<\/em><\/p>\n

      If you didn\u2019t know this yet, the domain name<\/a> is your business name or product name. Names can be really powerful, so don\u2019t be hasty when choosing your domain name. If you feel you\u2019re getting cold feet, don\u2019t worry, there are tools out there that can help you out.<\/p>\n

      Tips and tricks for website domain name choosing<\/h3>\n

      I was doing some brainstorming for a website domain for a business a while ago and realized that “Wazz” sounded quite interesting. It\u2019s short, easy to remember. But the moment I googled it, well\u2026.let me say, I burst into laughter. In British slang, it meant \u201curination\u201d. Really folks, do your research.<\/p>\n

      Later on, I wanted to name my photography website. I was analyzing \u201cmoonshine\u201d. It felt so nice, romantic, fairytale-ish…except it wasn\u2019t. It seems that it meant \u201c illicitly distilled or smuggled alcohol\u201d.<\/p>\n

      So, make sure your naming is unique, memorable, and doesn\u2019t have any weird meaning in English or another popular language (eg: Spanish) if you want to go international. If you\u2019re a local business, you might skip this.<\/p>\n

      Now, let\u2019s look a bit at a tiny checklist for choosing a domain name for your WordPress website:<\/p>\n

        \n
      • Make a list of relevant keywords<\/strong> for your business\/product. Think of how the users should feel after using the product. Let\u2019s say you have a skin product line based on natural ingredients. Your list might contain words such as \u201cskin\u201d, \u201ccare\u201d, \u201csafe\u201d, \u201cnatural\u201d, \u201cbeautiful\u201d, \u201cfresh\u201d etc. Use a tool such as Namelix<\/a> or Novanym<\/a> to generate domain name ideas.<\/li>\n
      • Check the meaning<\/strong> of your newly found domain name. I always google it like this \u201c{insert name here} meaning\u201d. I will end up with dictionary explanations. Next, I go to Google images<\/strong> and see how it gets matched. Maybe there\u2019s a singer with that name, a manga cartoon name, etc. If so, you\u2019ll need to redo the process.<\/li>\n
      • Look for the domain name on Facebook or LinkedIn<\/strong> to see if there is a business page with that name.<\/li>\n
      • Check if there\u2019s a website domain available<\/strong> for sale. For many sites, \u201c.com\u201d is the best top-level domain (TLD), followed by \u201c.org\u201d, \u201c.net\u201d or \u201c.io\u201d.<\/li>\n
      • Buy your domain name<\/strong>. You can do so via a domain registrar such as GoDaddy or via your hosting provider.<\/li>\n<\/ul>\n

         <\/p>\n

        And this leads us to our next chapter.<\/p>\n

        2. Acquire website hosting<\/h2>\n

        Every website you\u2019ve ever visited is hosted on a server. This means you\u2019ll need to acquire web hosting from a hosting provider.<\/p>\n

        Considering we\u2019re building a WordPress website you can choose a hosting plan from WordPress.com or some other third-party hosting provider.<\/p>\n

        Let me clear something out before we proceed. There are wordpress.com and wordpress.org. The difference is that on WordPress.com you can host and build a website. From WordPress.org you usually acquire themes and plugins for your website, which is hosted elsewhere. You can compare the WordPres.com plans here<\/a>.<\/p>\n

        This guide’s hypothesis is that you really want to build a brand and have full control over your website. This means you\u2019ll go to a third-party hosting provider.<\/p>\n

        There are three main hosting services: shared hosting, VPS, and managed hosting. In the first situation server resources are split among more sites. In the long run, if these sites grow, and yours as well, you might encounter performance issues. You might realize that you need a VPS service or a managed hosting plan.<\/p>\n

        So, you need to have this in mind when choosing a hosting provider<\/a>: which are your business goals?<\/p>\n

        If you go with VPS hosting, resources will still be shared, but you\u2019ll gain some control over them. You\u2019ll see improvements in terms of security and performance as well.<\/p>\n

        Managed hosting is kinda an \u201c\u00e0 la carte\u201d service. You\u2019ll get your own physical server all to yourself, and you\u2019ll see a boost in performance and security.<\/p>\n

        Definitely, things can get more complicated than this, but I just wanted to paint the big picture of hosting.<\/p>\n

        Next, when you analyze the plans, take a closer look at:<\/p>\n

          \n
        • Pricing<\/li>\n
        • Storage<\/li>\n
        • Support<\/li>\n
        • Performance<\/li>\n<\/ul>\n

          Some hosting providers have some extra features packed such as domain offering (eg: Namecheap), website builder (eg: GoDaddy), e-commerce options, etc.<\/p>\n

          Now, you\u2019ve probably noticed by now some websites using \u201cHTTP\u201d or \u201cHTTPS\u201d. What\u2019s up with those?<\/p>\n

          HTTP is the basis of the modern web. It connects the browsers and servers, and functions on a request-response basis. Now, the extra “s” means the connection to the website is encrypted and the data shared with the website is secure.<\/p>\n

          Let\u2019s say a user makes a payment on your website or logs into an account. The info the user will type in will be private. Safe from hacking. This is happening through the SSL technology, which stands for \u201cSecure Sockets Layer.\u201d For consumers, seeing \u201cHTTPS\u201d signals trust, because you can protect their data and privacy. This means that you\u2019ll need to acquire an SSL certificate.<\/p>\n

          Make sure your chosen plan includes this as well.<\/p>\n

          The moment you acquire your hosting plan, and you\u2019ve set up your login details, the only missing piece is going to be WordPress itself. Most of the hosting providers out there allow you to install WordPress from their dashboard\/wizard. It\u2019s all pretty intuitive.<\/p>\n

          How will you log in to your site? Easy peasy. Just type in the browser your website address and add to it \u201c\/wp-admin\u201d, as seen below.
          \n          <\/a><\/p>\n

          \"WP<\/p>\n

           <\/p>\n

          3. Get familiar with the WordPress interface<\/h2>\n

          The WordPress dashboard has 9 sections. Let\u2019s take a look at them.<\/p>\n

          WordPress settings<\/h3>\n

          \"WordPress<\/p>\n

          Inside this section, there are 7 more menu items. I\u2019ll describe briefly the most important things that need to be done here.<\/p>\n

            \n
          • Under \u201cGeneral<\/strong>\u201d you can set up the site title, tagline, URL, time zone, time & date format, and language.<\/li>\n
          • Under \u201cReading<\/strong>\u201d you\u2019ll \u201ctell\u201d WordPress which page serves as the homepage, and which one is your \u201cblog\u201d. This is an important step. You\u2019ll also choose how many blog posts can show up on a page or if you want your website indexed by Google.<\/li>\n
          • Under \u201cDiscussion<\/strong>\u201d you\u2019re going to do the blog comments setup.<\/li>\n
          • Inside \u201cMedia<\/strong>\u201d you can establish the maximum dimensions in pixels to use when adding an image to the Media Library.<\/li>\n
          • Inside \u2018Permalinks<\/strong>\u201d you\u2019ll set up the format of your URLs.<\/li>\n
          • You can define your privacy policy pages inside \u201cPrivacy<\/strong>\u201d.<\/li>\n<\/ul>\n

            The best way to approach the \u201cSettings\u201d panel is to enter all these items and fill in the missing info, just to make sure you don\u2019t skip anything important. Things are pretty straightforward, so don\u2019t get cold feet. All the setup can be done in less than 30 minutes.<\/p>\n

             <\/p>\n

            WordPress pages and posts<\/h3>\n

            What you need to know is that your content will go inside \u201cpages\u201d or \u201cposts\u201d. Here you\u2019ll spend 95% of your time.<\/p>\n

            The \u201cpages\u201d are static. You can have a \u201chomepage\u201d, \u201cservices\u201d page, \u201ccontact us\u201d page, you get the point. Under posts you can have your latest blog articles, maybe your portfolio. These are dynamic pages because they automatically place your newest website content at the top.<\/p>\n

            \"WordPress<\/p>\n

            When you select \u201cPosts\u201d from the dashboard, you will be able to create a post, visualize all posts, and manage tags and categories.<\/p>\n

            \"WordPress<\/p>\n

            You can create a new post if you select \u201cAdd New\u201d as seen above, or go to \u201cAll Posts\u201d and then select \u201cAdd New\u201d.<\/p>\n

            \"Add<\/p>\n

            The same works for pages.
            \nWhat you\u2019ll see in your \u201cAll Pages\u201d or \u201cAll Posts\u201d are some default pages and posts deployed by your theme.<\/p>\n

            \"Edit<\/p>\n

            Now, how can you edit a post or a page?<\/p>\n

            When you hover over your default pages and posts you will see some options: edit, quick edit, trash, view. In the screenshot above there\u2019s also \u201cEdit in Colibri\u201d. This is because we installed a plugin that allows you to customize pages using the Colibri WordPress builder (but we\u2019ll talk a bit later about this).<\/p>\n

             <\/p>\n

            WordPress media<\/h3>\n

            All your media goes in here: images and videos<\/a>. You can drag and drop them or upload them.<\/p>\n

            \"WordPress<\/p>\n

            You can also add media from your post\/page level. I\u2019ll show you more on the topic later.<\/p>\n

             <\/p>\n

            WordPress comments<\/h3>\n

            The 4th dashboard section is called \u201cComments\u201d. Here you can manage your posts\u2019 comments. You\u2019ll receive tons of spam comments that can be moved to spam or trash. You can approve the relevant ones.<\/p>\n

            \"WordPress<\/p>\n

             <\/p>\n

            The \u201cAppearance\u201d menu<\/h3>\n

            \"WordPress<\/p>\n

            At this level you can:<\/p>\n

              \n
            • Search for, install, and activate a theme (more details in the following chapter).<\/li>\n
            • Customize widgets to add blocks of content to your site’s sidebars, footers, and other areas.<\/li>\n
            • Define your WordPress website\u2019s menus<\/a>.<\/li>\n
            • Add a background image to your site.<\/li>\n
            • Edit the code of your theme inside \u201cTheme Editor\u201d (recommended only if you are a developer).<\/li>\n<\/ul>\n

              Now, the moment you activate certain plugins, you might see a few new menu items underneath \u201cAppearance\u201d. In this case, because we\u2019ve activated the Skyline theme, we see an option to set it up under \u201cSkylineWP Settings\u201d. Each theme can come with its own setup.<\/p>\n

              \"SkylineWP<\/p>\n

              \u201cInstall Plugins\u201d is the other extra menu item added by the Skyline theme. In here you\u2019ll see some plugin recommendations that work well with Skyline.<\/p>\n

              This leads us to our next menu item.<\/p>\n

               <\/p>\n

              Plugins<\/h3>\n

              There are lots of features that can\u2019t be managed by theme only, such as SEO optimization<\/a>, SEO audit<\/a>, website security<\/a> and back-up, tables, forms, e-commerce features, and more. Plugins are here to compensate for the lack of such options.<\/p>\n

              Here\u2019s a tiny tutorial on how to install, activate, and deactivate plugins. It\u2019s all intuitive and user-friendly.<\/p>\n