Normal view

Before yesterdayMain stream

Color Accessibility 101: How Color Affects Readability on Your Website

13 February 2025 at 11:00

When designing a website, it’s easy (and fun!) to focus on layout and content. But one crucial element that often gets overlooked is color. Color plays a vital role in web accessibility, ensuring that all users—regardless of visual impairments or color vision deficiencies—can easily navigate and engage with your content. 

Proper color contrast is key to making text readable for those with low vision or color blindness. In this post, we’ll explore why color is so important for accessibility and how to create a color palette that ensures your website is inclusive and user-friendly for everyone.

Why color is important for accessibility 

Color, specifically color contrast, is central in ensuring web content is accessible, particularly for users with visual impairments, color blindness, or low vision. 

Someone with low vision may struggle to read text with poor contrast, such as light gray text on a white background. Users with color blindness may find it difficult to differentiate between certain colors, such as red and green, if the contrast is insufficient. High-contrast design helps bridge these gaps.

Not only that, accessibility isn’t just a best practice—it’s becoming a legal requirement in many parts of the world. The European Accessibility Act (EAA), taking effect in 2025, will require digital products and services, including some websites, to meet certain accessibility standards like sufficient color contrast, avoiding color-dependent information, and following Web Content Accessibility Guidelines (WCAG). Non-compliance could lead to fines, making accessibility an essential priority for businesses serving the EU market.

Beyond its impact on accessibility, proper color contrast also benefits all users, including those viewing content in challenging environments. Bright sunlight, low-quality monitors, or small screen sizes can make low-contrast elements harder to see for anyone. 

What makes a color palette accessible?

While color contrast is central to the accessibility of color, there are other things you can do to make the color on your site even more accessible. All of these elements come together to ensure optimal color accessibility:

  • Sufficient contrast: Colors must have enough contrast between the text and background to meet WCAG—more on contrast ratios below. 
  • Avoid relying on color alone: Information shouldn’t be conveyed through color alone. For example, add an underline to links or use icons to support color-coded elements.
  • Color blindness considerations: Choose combinations that are distinguishable for users with common types of color blindness, such as red-green or blue-yellow deficiencies.
  • Consistent use of color: Maintain consistency in how colors are used throughout your design. This helps users quickly understand an element’s meaning and function.
  • Testing across devices: Colors may appear differently on various screens and under different lighting conditions. Testing ensures accessibility in real-world scenarios.

By considering all these elements, you can create a site that is both functional and inclusive.

a screenshot of the WebAIM footer with several links under the headings 'From the Blog' and 'Popular Resources'
Example from WebAIM demonstrating the use of other elements, like underlines and icons, to support color-coded elements. 

What is a contrast ratio?

To better understand if your site’s color palette is accessible, it’s important to understand how color contrast is measured. 

Color contrast ratio is a numerical value that represents the difference in luminance (light intensity) between two colors, such as the text and its background. It is calculated as a ratio, with values ranging from 1:1 (no contrast, e.g., white text on a white background) to 21:1 (maximum contrast, e.g., black text on a white background). A higher ratio indicates greater contrast, making it easier for users to distinguish between the foreground and background elements.

The Web Content Accessibility Guidelines (WCAG) recommends a minimum contrast ratio of 4.5:1 for most text and images of text, and 3:1 for large text (at least 18 point or 14 point bold and above).

Example of a low contrast ratio

Take this example of a light green button with white text. It may look legible to you, but upon further inspection, using the Chrome Accessibility tools in the Chrome browser, the contrast ratio is quite low at 1.71:1. As such, the text on this button would be difficult for many users to read.

a green button with white text highlighted and the Chrome Accessibility Report shown
Here’s how a low contrast button appears flagged in the Chrome Accessibility tool, along with other accessibility details for the element.

How to test for accessible color combinations

Testing color combinations for accessibility is straightforward with the right tools. Here are some of our most trusted tools for testing colors:

  1. Chrome Accessibility Report: This tool is an easy-to-use resource built right into the Chrome browser when you want to quickly test a single page or element on your site. 
  2. Equalize Digital Accessibility Checker: This freemium WordPress plugin from Equalize Digital goes beyond just colors to ensure your site is accessible to a wide range of visitors. 
  3. WAVE Web Accessibility Evaluation Tool: A free tool you can use to scan any page on your site for accessibility issues. When you’re looking to improve colors, check for the “contrast errors” part of the report. 
  4. Deque University contrast checker: Use this free tool to check a color combination you’re unsure about. 

Many design programs, such as Adobe and Figma, include built-in accessibility tools or add-ons that allow you to analyze color contrast directly within your design files, allowing you to address accessibility considerations early in the design process—even before development begins.

The Color Contrast Analyzer from Deque University analyzing white and green

Some beautiful, accessible color combinations and themes

Finding accessible color combinations doesn’t mean sacrificing aesthetics. Here are some of our favorite high-contrast designs in the WordPress.com theme directory:

A screenshot of a WordPress.com theme with a dark header and a picture of a dog. There's white text and lighter sections below with dark red text
High contrast Koinonia theme from WordPress.com.

Koinonia

The Koinonia theme is ideal for building community-focused websites, such as nonprofits and churches. It features a clean, modern layout with a focus on readability and easy navigation. It adheres to accessibility standards, with features like proper color contrast, keyboard navigation support, and screen reader compatibility, which helps differently abled users access content effortlessly. 

a color palette showing three circles: one black, one pink, and one maroon
Darkest Black
#030203
Berry Sorbet
#FB6669
Dark Sangria
#560122
A screenshot of a WordPress.com theme with a dark green header and a picture of folks sitting in a conference room. There is black, white, and blue text.
High contrast Conference theme from WordPress.com.

Conference

The Conference theme is thoughtfully designed for event and conference planners, combining functionality with accessibility to create an inclusive experience for all users. Its design emphasizes clear, intuitive navigation and offers support for high-contrast color settings, ensuring content remains readable and usable for individuals with visual impairments. 

a color palette showing three circles: one blue, one green, and one black
Signal Blue
#345EFC
Emerald Glow
#49EF7C
Deep Black
#1E1D2C
A screenshot of a WordPress.com theme with a white, grey, and yellow color palette. The hero image shows a person walking on a deck of a modern white house
High contrast Fixmate theme from WordPress.com.

Fixmate

This theme from the WordPress.com team features clean, high-contrast text on light backgrounds, ensuring maximum readability for users with visual impairments. The theme adheres to accessibility best practices by using logical heading structures, keyboard-navigable menus, and link styling that avoids reliance on color alone for identification.

a color palette showing three circles: one yellow, one black, and one teal
Golden Marigold
#FDC62A
Midnight Cola
#0F0C0C
Tidepool Jade
#2D92A1

Want a more customized look? When you’re ready to build, WordPress.com makes it easy to define and implement an accessible color palette for your site on Premium plans and above. You can customize these themes with the colors of your choosing, but be sure to always verify your color contrast ratios and test them in different contexts, such as buttons, headers, and body text. 

A final word on accessible color

Accessible design is not just about meeting standards; it’s about creating experiences that welcome everyone. By prioritizing color accessibility, you’re taking a meaningful step toward a more inclusive web.

Want to learn more about building an inclusive WordPress site? Here are a few resources to get you started: 

How to Use Header Tags for SEO and Accessibility

5 February 2025 at 12:30

Header tags are one of the most fundamental elements of a well-structured blog post. They guide readers through your content, improve accessibility, and help search engines understand your content’s structure.

But using headings properly requires more than just adding a few bold titles to your text.

In this post, we’ll walk you through how to use header tags effectively and why it matters for your WordPress site.

What are header tags and how do they impact SEO?

A heading is a title or subtitle that introduces a section of content on a website post or page. In HTML, headings are defined by tags ranging from <h1> to <h6>, with <h1> being the most important and <h6> the least. 

a highlighted line of the H1 tag of this blog post

These tags indicate the hierarchy of your content, helping both readers and search engine robots understand how your ideas are organized. 

For example:

  • H1: The post or page title
  • H2: Main sections (this section of this very blog post uses an H2 header tag!)
  • H3: Subsections under H2
  • H4: Additional details under H3

Properly formatted headings dramatically improve the readability and scannability of your site as well, as they break up large sections of text.

How many H1s should you have?

One. A blog post should have exactly one <h1> tag, which serves as the main title of the page. Using multiple <h1> tags can confuse search engines about what the post or page is actually about and negatively impact your SEO. 

A good H1 should:

  • Be clear and descriptive, reflecting the search intent.
  • Contain your primary keyword.
  • Be unique to each post or page on your site.

For example, say you’re writing a post about a skillet flatbread recipe. A good H1 (using the guidelines above) might be “Easy Skillet Flatbread Recipe.”

“The Recipe I Make Every Week” is an example of an H1 that isn’t clear or descriptive and doesn’t contain our primary keyword (“skillet flatbread recipe”).

How to avoid keyword stuffing in headings

A big benefit of using headings properly is to maximize the SEO potential of your post. While it’s tempting to load your headings with keywords (aka “keyword stuffing”) to start ranking for a particular keyword, this can do more harm than good. 

Keyword stuffing is a spammy tactic that can make your content sound unnatural and lead to poor-quality content that will rank poorly in search results.

Instead, focus on writing headings that clearly describe the content of the section using natural language. Incorporate keywords sparingly and only when they fit organically.

For example, instead of a heading that says, “Best Dog Beds: Top Dog Beds for Large Dogs That Nap,” a better, more readable heading might be, “The Best Dog Beds for Large Breeds.”

This will ensure your headings are reader-friendly while still supporting your SEO goals. It’s a win-win! 

If you’re worried your post might be keyword-stuffed, run it through this helpful SEO checker from SEM Rush. It will magically calculate the keyword density for the body, headlines, and meta description of your post. 

How header tags impact accessibility

Headings play an important role in making your content accessible to all users, including those who rely on screen readers. Screen readers use headings to navigate content, allowing users to jump directly to the sections they’re interested in.

When writing headings for accessibility, consider the following tips:

  • Use headings to create a structure: Ensure your headings reflect the hierarchy of the post. For example, use H2s for main sections and H3s for subsections.
  • Avoid skipping levels: Don’t jump from an H2 to an H5. This can confuse screen readers and make your content harder to navigate. In the next section, we’ll talk more about how to properly nest headings. 
  • Keep headings descriptive: Avoid vague headings like “Conclusion” or “Details.” Instead, use headings that clearly describe the content, such as “Final thoughts on garden compost” or “Tips on how to make your own compost.”

You can learn more about the proper use of heading for accessibility on a WordPress site in this post, Improve Your Site’s Accessibility

Tools for testing heading accessibility 

Here are a few tools you can use as part of your publishing workflow to ensure your content is accessible:

  • Chrome Accessibility Report: The Chrome accessibility report is an easy-to-use resource built right into your Google Chrome browser when you want to quickly test a single page on your site. 
  • Equalize Digital Accessibility Checker: This freemium WordPress plugin from Equalize Digital goes beyond just headings to ensure your site is accessible to a wide range of visitors. 
  • WAVE Web Accessibility Evaluation Tool: A free tool you can use to scan any page on your site for accessibility issues. When you’re looking to improve headings, check for the ‘structural elements’ part of the report. 

How to properly nest your header tags

Proper nesting of headings is essential for maintaining a logical flow in your content. Think back to your school days and treat your headings as an outline:

  • H1: The main topic of your post or page
  • H2: Sections that support the main topic
  • H3: Subsections provide details or examples and are nested under an H2.
  • H4, H5, and H6: Additional layers of detail as needed.

Here’s an example of correct header tag nesting:

<h1>A beginner’s guide to beekeeping</h1>

  <h2>Why keep bees</h2>

    <h3>Environmental benefits</h3>

    <h3>Personal rewards</h3>

  <h2>Getting started with beekeeping</h2>

    <h3>Basic equipment</h3>

    <h3>Choosing a location</h3>

    <h3>City regulations and permitting</h3>

Once in a while, you may be tempted to incorrectly nest your headings as a way to apply a particular style. Try to avoid this. Incorrect nesting can disrupt the flow and confuse both readers and search engines.

You can always adjust your site CSS to change the styles of your headings site-wide.

How many headings are too many?

The number of header tags you use depends on the length and complexity of your blog post. A good rule of thumb is to include a heading for every 300–500 words. This helps break up your content into bite-sized pieces, making it easier for readers to follow along.

If you have a 1,000-word blog post it might include:

  • 1 <h1> tag as the title.
  • 3-5 <h2> tags for major sections.
  • A handful of <h3> tags for subsections, as needed.

Don’t overdo it, though. Too many headings can make your content look cluttered and overwhelming.

Additional tips for using headings effectively

When you’re asking yourself if and when you should add headings throughout your post or page content, follow these simple guidelines:

  1. Keep headings short: Aim for headings that are concise and to the point. While Google doesn’t have a limit on characters, keep it focused on the search query.
  2. Avoid overloading with styles: Headings should stand out visually, but don’t rely on excessive styling like all caps or bold text. Let the hierarchy and natural formatting do the work for you.
  3. Test your headings: Preview your posts and pages to make sure your headings create a logical structure. Check how they appear on different devices, especially mobile.
  4. Think about search intent: Use headings to address common questions your audience might have. This not only improves readability but also increases the likelihood of ranking in search engine results.
  5. Use headings to break up dense content: Long paragraphs can be exhausting to readers. Use headings to segment your content into manageable sections.

How to edit header tags on your WordPress posts and pages

There are multiple ways you can add header tags to your content with WordPress. Let’s look at a couple different methods.

Add a title

This first one requires no extra work on your end! Woo hoo! 

By adding a title to your post or page, you’re automatically adding the one and only <h1> tag you need. WordPress takes care of this for you.

Use the Heading block

You’ll need to insert all other headings manually. Remember that header tags should be nested naturally. You’ll use the Heading block to add all H2s, H3s, H4s, H5s, and H6s to your posts and pages.

To add the Heading block, click the + Block Inserter icon and search for “heading.” Click it to add the block to the post or page.

a screenshot of adding a Heading block to a WordPress page editor

You can also type /heading on a new line in the editor and press enter to quickly add a Heading block. You can also use markdown syntax by typing hashtags (#) in front of your heading text like this:

## Why I love this recipe

That will magically turn into an H2 heading because you used two hashtags! Use the appropriate number of hashtags to correspond to the header you’re wanting to use.

Be sure to explore our Heading block support article for even more information about the ways you can customize your post or page headings.

A final word on using header tags effectively

Headings are more than just decorative elements—they’re a tool for organizing your content, improving accessibility, and enhancing SEO. Keep in mind that the goal is simply to make your content as easy to navigate as possible. 

Whether your readers are skimming for key points or diving deep into the details, properly used headings will guide them every step of the way. 

How to Increase Blog Traffic: 21 Tactics You Can Use Instantly

30 January 2025 at 15:15

Why should you invest time in learning how to increase blog traffic?

Well, imagine this: you toiled away for months to start your blog. You agonized over the name, carefully picked a theme, wrote your best copy, and launched it with all the giddiness of a high schooler asking their crush to prom. And then—crickets.

Your blog is a ghost town. Tumbleweeds would roll down your homepage if they could. Not a single soul seems interested in your content.

In a panic, you try your best to fix the situation. You ask your friends and family to search for your blog’s name and click it to let Google know it exists. You even consider printing business cards with its URL and handing them out on the street. Maybe a different theme would help?

Doubts creep in. Perhaps blogging simply isn’t for you after all. Perhaps you were kidding yourself, and maybe what you have to share isn’t that interesting after all. And you start to consider giving up.

This is the last situation we want you to find yourself in. That’s why, in this blog post, we have put together a list of proven tactics and tips you can use to generate traffic to your blog. You can start implementing them right now, and doing even just a few of them can make a big difference. 

Ready to give it a go? Then let’s not wait any longer.

How to get more blog traffic from SEO

Search engine optimization, or SEO, is the basis of traffic generation for most blogs. That’s because it’s mostly free to implement and pretty much “set it and forget it.” Once you have a good foundation, it works with relatively little maintenance. But how do you get it right in the first place?

1. Conduct keyword research

The Ubersuggest keyword research results for the term 'increase blog traffic'

If you’re reading this article, you want to generate more traffic with your blog. Blogs that receive a lot of visitors are ones that are full of helpful content about topics that people search for and want to read.

A blog post can be the best-formatted, wittiest, and most thoroughly-researched piece of writing ever, but if the topic isn’t something that others are interested in, it likely won’t deliver the traffic returns on it.

Keyword research helps you avoid that by ensuring you pick subjects your audience is actually interested in. That way, you don’t end up figuratively yelling into a vacuum. It also helps you discover new blog post ideas.

Numerous keyword research tools exist, such as Ahrefs, Semrush, Google Keyword Planner, Keywordtool.io, or Ubersuggest. However, finding keywords is a lengthier process we could write a separate article about, so we’ll refer you to this primer on Ahrefs for now.

2. Cover evergreen topics

Evergreen content consists of blog posts that remain perpetually relevant and can drive traffic year-round. They contain information that doesn’t change or changes very slowly.

For example, “weight loss” is an evergreen topic. People are always looking for ways to slim down, and the principles (diet and exercise) stay mostly the same.

A Google Trends graph for the term 'weight loss'

On the other hand, the results of the 2024 Olympic games are probably not a popular search topic beyond a certain point in time.

There’s also seasonal content. It can be evergreen for the same period every year, but it likely won’t bring in lots of traffic outside of a particular timeframe.

a Google trends graph for 'maria carey all I want for christmas is you'
The perfect example for a seasonal search term.

In conclusion, make sure that at least part of your content strategy includes evergreen content. MailChimp has a guide on this topic with additional details.

3. Follow Google’s E-E-A-T guidelines

The acronym E-E-A-T stands for Experience, Expertise, Authoritativeness, and Trustworthiness. It’s not a direct ranking factor (i.e. something that formally impacts your content’s ability to rank) but a concept Google introduced to gauge the quality of web pages that appear in its search results. Therefore, if you want to increase traffic, you’d do best to demonstrate these aspects on your blog.

Here’s how you can do so:

  • Experience: Show that you have firsthand experience in your subject. For instance, if you’re talking about a product, actually use it. If you’re recommending a hotel or location, visit it.
  • Expertise: Create high-quality, in-depth content and link to reputable studies, data, or industry leaders to back up your claims. Highlight relevant credentials or qualifications on your About page or author bio.
  • Authoritativeness: Consistently publish top-notch articles to build authority in your industry, attract backlinks and mentions, and grow your reputation.
  • Trustworthiness: Ensure your website is trustworthy through security, transparency, and being ethical. For example, disclose affiliations or sponsorships clearly and provide easy ways to get in contact.

For additional information, check out Google’s official guidelines.

4. Optimize images for SEO

The TinyPNG homepage with a panda and the headline 'Smart AVIF, WebP, PNG and JPEG Compression for Faster Websites'

Images are prominent page elements that contribute to the SEO of your site. To ensure their impact is positive:

  • Use relevant images that add to the content you’re making.
  • Avoid using too many stock photos—visitors are very good at filtering them out.
  • Give your images meaningful file names (like pesto-pasta-with-tomatoes.jpg versus img-452.jpg).
  • Use fast-loading image formats like WebP or Avif.
  • Compress images before uploading. 
  • Save your images to a reasonable size so that the file size is smaller and your images look crisp. 
  • Include alt text and captions that describe the image and possibly contain your keyword.

Yoast has more details and additional tips for making sure your images are optimized for search engines and users.

5. Publish posts on a consistent basis

Content is the heart and soul of blogging. As a blogger, we probably don’t need to tell you that you should publish blog posts regularly.

But what does “regularly” mean? Orbit Media recommends publishing at least bi-weekly to achieve strong results.

Orbit Media's graph of blogging frequency and content performance
Source: 2024 Blogging Statistics: 11 years of Trends and Insights from 1000+ Bloggers from Orbit Media Studios

This isn’t a hard-and-fast rule though. In the end, your blogging frequency depends on your goals, the length and type of your content, and the time you can invest.

To get on the right schedule for yourself:

  • Ask your audience.
  • Experiment with different posting frequencies.
  • Find a cadence you can sustain.
  • Focus on quality over quantity.

6. Avoid duplicate content

Duplicate content means two pages that contain exactly the same or almost identical material. This can confuse search engines about which of your pages to rank for a particular keyword.

Here’s how to avoid it:

  • If you reuse the same content somewhere else, include a canonical tag to the original so that search engines know which is the most representative of the topic.
  • Add descriptions to your category pages. It will distinguish them from other archive pages that might contain the same blog posts.
  • Switch off irrelevant archives, like tags, to decrease the likelihood of several archive pages displaying the same content.
  • Don’t paginate your blog comments. Pagination creates additional versions of your blog posts with the same content except for the comment section.
  • Use tools like Siteliner and Copyscape to find duplicate content so you can fix it.

We have an entire article on this topic if you want to learn more.

7. Add internal links

Internal links (or links to your other content from your own content) serve numerous purposes:

  • They allow visitors to discover more relevant pages and keep them engaged.
  • They establish relationships between your pages, helping search engines understand their context and how they fit together.
  • They distribute SEO value from incoming links across your site.

Therefore, when you create content, it’s recommended that you always link to related, relevant pages and posts on your blog. In addition, make sure to use clear anchor text, meaning the text that appears as the link on the page. Visitors should easily be able to understand what page they’ll land on when they click.

For detailed guidance on internal linking, check out this post on Yoast.

8. Use an SEO plugin

SEO plugins are helpful because they support you in optimizing your blog to increase organic search traffic. They give you lots of control over how your content appears in search results and often implement improvements automatically.

One of the most important features of these plugins is the ability to customize SEO titles and meta descriptions for your web pages.

A blue box and arrow highlighting the SEO title/description Jetpack settings in the WordPress editor

Take advantage of this possibility for every post and page to make sure your titles and descriptions grab reader attention in search results and aren’t too long.

In addition, SEO plugins often come with content analysis options. Input your page’s main keyword, and they will tell you if you’re using it often enough, in the right places, and other ways to optimize the page.

Popular WordPress SEO plugins are Yoast, Jetpack, Rank Math, and All in One SEO. On WordPress.com, you can install plugins like these on the Business plan and above.

9. Gain backlinks

Links to your blog from other sources, called backlinks, are one of the main signals search engines use to determine where to rank your content. However, it’s not about the raw numbers; the quality of backlinks, meaning if they come from relevant and trustworthy websites, makes a huge impact (so don’t start buying backlinks).

The truth is, intentionally building backlinks isn’t easy. Here are a few practical ideas you can try:

  • Create linkable assets: Make your content so good that people naturally feel inclined to link to it.
  • Do outreach: Contact influencers and blogs in your niche or industry, and let them know about content they might find useful.
  • Guest post: Write posts on popular websites that let you link to your own site. This also exposes you to a new audience.
  • Do interviews: Interview well-known bloggers or industry leaders. They will likely link back to the interview once it’s published.

For more details, check out our article on backlinks.

10. Update your old blog posts

Up-to-date information is a sign of quality content. That’s why blog posts tend to drop off in search rankings over time. The antidote? Refresh your content regularly.

Here’s how to improve older content on your blog:

  • Tailor posts more strongly to search intent, meaning make sure you’re answering the purpose of a reader’s search fully.
  • Update information to reflect the latest data.
  • Include new keywords.
  • Improve the writing to make it more helpful.
  • Add new links, both internal and external.
  • Improve formatting and readability.

The Blogsmith has a great write-up on this topic.

11. Make sure your blog loads quickly

Website speed is a major factor in user experience, so much so that Google has adopted it as a ranking factor. Therefore, if you want to do well in search results, make sure your blog loads fast.

If you host your blog on WordPress.com, you already have a leg up on this. Optimized and scalable servers, built-in caching, fast themes, and a content delivery network are included with every plan. These features ensure your website is blazing fast.

However, there are also speed factors you need to take care of on your end, such as:

  • Optimizing images.
  • Keeping the number of plugins on your site to a minimum.
  • Reducing third-party scripts.

For more details, check out our post on how to speed up your blog.

12. Add structured data to your blog posts

Structured data is what you see in search results when content displays images, ratings, prep time, and other additional information, known as rich snippets.

Google Search result for 'vegan tacos' with rich snippets like images, ratings, and time

While using structured data won’t automatically make your content rank higher, it can help because search engines can better understand your site content with it. It’s also an effective way to increase click-through rates, which are a positive signal for search engines as well. It shows that your content is relevant to their users’ search intent.

Structured data exists for different types of content, from recipes to reviews, and can add different features to your content. One example are the handy, styled recipe cards you often see in food blog posts. 

You can hard-code structured data, but the easiest way to incorporate it into your content is to use one of the many plugin solutions for structured data.

a screenshot of the Schema - All in One Schema Rich Snippets plugin on WordPress.com

Most SEO plugins also include options to assign structured data to your content. Once you have set up the markup on your site, use Google’s Rich Results Test to make sure it works correctly.

Increase blog traffic using email marketing

Email remains a marketing channel with one of the highest ROIs.

a graph of marketing channel ROIs with website/blog/seo being the highest
Source: Email Marketing vs. SEO: What You Need to Know for 2024 (New Research) from HubSpot

It makes sense, as most people guard their personal email address fiercely. Therefore, if they like your content enough to hand over their address for your newsletter, you’ve found someone who is likely to return.

In addition, your email list belongs to you. It can’t be taken away, and nobody can limit your reach the way a social media algorithm upgrade can.

For that reason, building an email list you can use to increase blog traffic should be an absolute priority.

13. Add email subscription options to your blog

The first step in building a newsletter audience is to equip your website with a way for people to sign up. On WordPress.com, you have that ability out of the box.

All you need to do is go to Settings > Newsletter (or Jetpack > Settings > Newsletter on plugin-eligible plans) and enable ways for people to sign up.

the newsletter settings area on WordPress.com

You can also manually add sign-up options with the Subscribe block. Once you have subscribers, you have the possibility to automatically send new content to them.

The Newsletter menu lets you customize the look of your emails, set up a paid newsletter, and compose a welcome message. You can have unlimited email subscribers, import them from other platforms, monitor open and click rates, and much more.

Ready to sign up with WordPress.com? Start your website journey here.

14. Encourage email subscribers to share your posts

Your email subscribers are already engaged with your content, making them ideal advocates for your blog. You can leverage that to increase blog traffic by encouraging them to share your posts, like so:

  • Make it easy to spread the word: Add links that allow subscribers to share your posts on social platforms.
  • Encourage subscribers to forward your emails: Use friendly language like, “Know someone who’d love this? Forward it to them!”
  • Offer incentives: Provide free resources, discounts, or entries into a giveaway for each share.
  • Feature your most engaging or useful posts: Highlight these in your newsletter and ask readers to share their favorites.

Every little bit helps. When you notice someone sharing, be sure to express your gratitude.

15. Reach out to other bloggers

Collaborating with other bloggers who have an established audience can help boost your blog traffic. It exposes your content to more people already interested in your niche.

Here’s how to pull it off:

  • Identify relevant bloggers in your niche or complementary niches with active email newsletters.
  • Build rapport by commenting on their blog posts, sharing their articles on social media, or mentioning them on your own blog.
  • Craft a personalized pitch, mentioning specifically how your content can add value to their audience.
  • Highlight mutual benefits, such as featuring their work on your blog, promoting their newsletter, or providing content their readers would appreciate.
  • Share your most polished and valuable posts for consideration that resonates with their audience and aligns with their standards.
  • Alternatively, ask them to write a blog post on your blog (with a backlink) or interview them and then ask to share the interview with their audience.

Get blog traffic from social media

Social media is an established and important marketing channel. Here are ways to use it to increase the traffic to your blog.

16. Regularly share your posts on social networks

You probably don’t need an introduction to how sharing on social media platforms works. Any blog promotion plan should include regularly publishing your content there.

An important question is which platform(s) you should choose. This depends on a number of factors. For example, if your content includes stunning visuals, like a travel blog, a platform like Pinterest or Instagram might be a good option.

Pinterest search results for the term 'travel' with many pictures of planes and landscapes

For written content that you can break down into bite-sized facts, LinkedIn and similar platforms come to mind.

One that deserves special mention is Bluesky. It’s particularly friendly to bloggers since it doesn’t suppress links, and you can customize your Bluesky handle with a custom domain from WordPress.com. Other popular networks like Facebook and X try to keep users on their own site, making it more difficult to use them for traffic generation.

Take the time to learn each platform’s rules and conventions, and focus on a maximum of two or three at first. You can always branch out later.

By the way, in WordPress.com, you can auto-post your content via Jetpack Social. Just go to Tools > Marketing > Connections and connect your blog to your accounts.

A blue box and arrow highlighting the Connections under Marketing on WordPress.com

After that, you can choose to automatically share posts when you publish them.

a blue box and arrow highlighting the 'share this post' option on WordPress.com

17. Add social sharing buttons/blocks to your blog

Including social sharing options in your content allows visitors to easily post it on social media. They are also easy to set up and configure on your WordPress.com blog.

If you’re using a legacy theme, go to Tools > Marketing > Sharing Buttons. Determine where buttons should appear and what the buttons should look like.

the Sharing Buttons settings page under Marketing and Integrations on WordPress.com

If you’re using a block theme, you can take advantage of the Sharing Buttons block instead. It allows you to display buttons wherever you want with many ways to customize them to your needs.

A blue box and arrow highlighting the Sharing Buttons block on WordPress.com

18. Create a link-in-bio page

A link-in-bio page is where you consolidate links to all of your web presences and most important pages.

It’s a great place to include your blog in order to direct social visitors there. In addition, it’s easy to create, thanks to w.link, which fully integrates with WordPress.com and is customizable.

The w.link landing page with the headline 'All the links. One page.' and an example of a page

We have a detailed tutorial on how to use it.

Other traffic generation tips for blogs

Finally, here are a few more tips on increasing blog traffic that didn’t fit in the other categories:

19. Use analytics to inform your content strategy

Analytics tools help you understand what resonates with your audience. By identifying content that performs well, you can create more of what attracts your readers.

You can connect your WordPress.com blog to Google Analytics and/or use the built-in Jetpack Stats.

a screenshot of Jetpack stats on WordPress.com

Here’s how to use the information they provide:

  • Identify which topics receive the most views, likes, and comments to create more content on similar themes or expand on related subtopics.
  • Check the search terms people use to find your blog to reveal what information your audience is actively seeking.
  • See which sources refer traffic to you to focus on platforms that drive the most visitors.
  • Look at which formats (e.g., listicles, how-to guides, case studies) generate the most engagement and create similar content.

20. Minimize clutter on your blog design 

A clean and streamlined blog design helps readers focus on your content. Cluttered designs can be distracting and hurt user experience, making you lose visitors.

While all WordPress.com blog themes feature clean and well-optimized designs, here are additional tips:

  • Choose a simple theme.
  • Ensure your blog has enough spacing between elements.
  • Simplify navigation by grouping similar pages or posts under clear headings.
  • Use pop-ups sparingly and strategically.

21. Leverage the WordPress.com Reader

The Reader allows WordPress.com users to find content based on their interests from all the sites they follow, including yours.

A screenshot of the WordPress.com Reader discover tab

To make the most of it:

  • Use relevant tags and categories to increase the visibility of your posts.
  • Interact with other bloggers by liking, commenting on, and following their posts.
  • Publish regularly to stay visible to potential readers.
  • Feature your best-performing posts to attract new readers who explore your blog through the Reader.

For more information on using the Reader, check out the documentation.

Get your blog the traffic it deserves

More blog traffic means a wider reach, a bigger impact, more possibilities, and an increase in the ability to earn money from your blog. If your traffic could be better, don’t panic—there are many things you can do to improve the situation. Pick strategies from above that resonate most with your goals and abilities and build from there.

How to Make a Website: The Complete, No-Code Beginner’s Guide

29 January 2025 at 14:15

It looks like you’re here because you want to learn how to create a website, and maybe you find the task ahead a bit scary, overwhelming, and unsettling.

That’s understandable. Making a website can seem like a big undertaking, especially if you’ve been told that you need special skills for it, like knowing how to write code.

We are here to tell you that that’s not true. You can have your own, professional-looking website without any programming skills. In fact, all you need is to know how to use your computer mouse and write on your keyboard.

Sound hard to believe?

Seeing is believing, so in this article, we go over the process of creating your own website using WordPress. We’ll break it down into small, easy steps, so you can follow along even as a beginner. 

After reading this article, you’ll know how to:

  1. Determine your website goals
  2. Choose the type of website you will build
  3. Pick your hosting provider and website builder platform
    1. What types of hosting providers exist?
    2. Meet WordPress—The heart of your new website
  4. Select a domain name
    1. How to pick a domain for your website
    2. Why consider a WordPress.com domain?
  5. Pick your WordPress.com theme
    1. What kinds of themes exist?
    2. How to install and apply themes
  6. Determine the branding and colors you’ll use on your site
    1. Give your website a voice
    2. Establish a basic color scheme
  7. Put together the visual elements for your site
  8. Choose which pages your website needs
  9. Create your website content
    1. Learn how to create pages in WordPress
    2. Outline your page content
    3. Add written material
    4. Include images and other visuals
    5. Consider using videos
  10. Set up your homepage
  11. Add your pages to a menu
  12. Customize your header and footer
  13. Add functionality with plugins
    1. How to install and activate plugins
    2. Popular plugin options
  14. Optimize your site for search engines
    1. Write title tags for each page
    2. Add meta descriptions
    3. Use a search-friendly URL structure
    4. Include relevant keywords
  15. Set up analytics
    1. Google Search Console
    2. Google Analytics
    3. Jetpack Stats
  16. Test, publish, and promote your website
  17. Maintain your website
  18. Frequently Asked Quetions
    1. Do I need to learn how to code?
    2. How long should it take to build my website?
    3. How much should I pay for a website?
    4. Why is WordPress.com the best choice for my hosting/website builder?
  19. Create your website with WordPress today

Let’s make a website, shall we?

Determine your website goals

Knowing what you want to achieve with your site keeps you focused and helps you make the right choices as you’re setting up your site. 

What motivated you to want to create a site? What do you want to achieve by creating a site? Some common website goals are:

  • Attracting customers to your brick-and-mortar business
  • Selling products with an online store
  • Sharing your thoughts with a blog or magazine-style publication
  • Building a portfolio for creative work
  • Generating new subscribers for a newsletter

If you are unsure what the purpose of your site is, doing some competitor analysis is often helpful. You can learn a lot from analyzing other websites in your industry, market, or niche, such as:

  • The types of pages they include
  • Which calls to action they show on their website
  • Content types they publish
  • Images or design elements they feature

If you discover anything interesting or noteworthy, document it so you can borrow inspiration later on.

Choose the type of website you will build

a pink and black website screenshot and a blue and white university website screenshot side-by-side
Very different types of websites.

There are many different types of websites and they all come with their own goals, requirements, and differences. Some common kinds of websites include:

  • Business websites: These sites provide information about a company and its services or products. Sites of this kind usually have an objective such as selling goods or services, lead generation, or newsletter signups.
  • Personal websites: A personal website lets you establish a profile for potential employers, build your personal brand, consolidate your web presence, or find clients. It comes in many different varieties, from static brochure sites over portfolios to one-page websites.
  • Blogs: Starting a blog is an excellent way to attract more users to your website (hey, you are here, aren’t you?), show off your expertise, and help your audience. You can also start one to simply practice writing or pursue a hobby. Plus, it can be standalone or part of another type of website (like wordpress.com/blog is the blog for WordPress.com, our WordPress hosting company).
  • Online stores: The goal of an online store is selling products, goods, or services. This, too, can take many different forms. For example, a shop selling digital products is usually very different from one that deals in real-life merchandise. That’s because you normally don’t need as many product images for digital wares, they typically don’t come in many variations, and they don’t require shipping—all factors that simplify the experience of digital-only online stores.
  • Newsletter websites: The purpose of a newsletter site is mainly to collect subscribers for an email newsletter. You can grow your email list through popups or subscription forms.
  • Podcast sites: Another example of a type of site you can build is a podcast website. It can serve as home to your podcast episodes as well as provide additional information around them and you. You can even collect payments for exclusive content and earn money.

Naturally, it’s also possible to combine several website types. For example, you can sell products on your personal blog and send your latest posts via a newsletter. In fact, most websites use a hybrid approach like that. The important thing is to clarify this for yourself so that you work towards the right direction.

Pick your hosting provider and website builder platform

A hosting provider rents out server space where you can place your website files so that others can see your site. A website builder is the software that powers your site. Both influence its management and the end result.

What types of hosting providers exist?

a photo of a dark room with blue servers on either side and lights on the ceiling

There are different kinds of hosting, but the most common forms are:

  • Shared hosting: With shared hosting, your website is on the same server as many others, and they all have to share the same resources (hence the name).
  • VPS hosting: This acronym stands for “Virtual Private Server.” VPS hosting still places your website on the same machine as other sites but everyone gets their own dedicated resources they can’t exceed.
  • Dedicated server: You may choose to rent and manage your own server solely for your website.
  • Managed hosting: Like the name suggests, managed hosting providers take many of the day-to-day tasks of keeping a website running off your hands. WordPress.com is a managed hosting provider.

While shared hosting is probably the most common type, the divided server resources can become a speed bottleneck if one or more websites on the shared server start hogging all the processing power. Therefore, it is usually only sufficient for simple sites with little traffic.

VPS and dedicated hosting don’t have this problem; however, they come with additional responsibility. That’s because you only rent the server space; everything else related to site management is up to you. In particular, that means security, speed optimization, backups, infrastructure decisions, and other, similar tasks.

Managed hosting offers the most hands-off approach. For example, when you create a website hosted on WordPress.com, besides making sure your site is fast, secure, and backed up, we also keep it updated, offer top-notch support, and provide an optimized environment.

the WordPress.com help center popup with a weclome message over a support page on a WordPress.com/me page

This arrangement eliminates a lot of busywork for website owners like you. As a result, it allows you to fully focus on the parts of running a website that have the biggest impact on its success and reaching your goals. Examples include content creation, marketing, outreach, and product development.

Meet WordPress—The heart of your new website

As mentioned, in this tutorial we’ll show you how to set up your website using WordPress. It’s an open source content management system (CMS) and website builder, which means you can use it to create and manage websites and web content.

In the past, you would have to hand-code HTML and CSS files and upload them to servers to build your site. With WordPress, you can set up a website, change settings, create content, and do everything else from an easy-to-use interface instead.

the blog home edit page on a WordPress site called The Shore

That’s why it is our website builder of choice here at WordPress.com. Whatever hosting plan you choose (including our free plan), WordPress is automatically included in your account and set up for you. You always land directly on the platform’s user interface—no need to install anything by hand.

WordPress is both powerful and beginner-friendly (as you will see), which is why we, along with more than 43% of all websites on the internet, prefer it. Plus, WordPress is open source, meaning software built and maintained by volunteers and paid contributors who support it for the good of all.

Ready to sign up with WordPress.com? Start your website journey here.

Select a domain name

A domain name is the address you type into your browser to access a website. Google.com is a domain name as are wordpress.com and wikipedia.org.

a URL structure with labels for protocol, subdomain, SLD, TLD, subdirectory, URL, and domain name

At WordPress.com, we offer many domain extensions for purchase, including .com, .blog, and .org. In addition, with our free hosting plan, you can have a website running on a free subdomain like example.wordpress.com.

a screenshot of a logged-in view of the WordPress site, yourwebsite.wordpress.com

While sufficient for getting your feet wet in the website-building game, subdomains like this are not suitable for any professional purposes. It’s like using a Gmail address for your business email; it isn’t as professional or polished as a custom email address is. Thus, if your website is meant to be more than a hobby, you need your own domain name, especially for a business.

How to pick a domain for your website

Your domain name should be relevant to your site or brand. For example, if you’re building a company site, you may simply want a domain using the company name. It’s where people will naturally assume they can find you.

The National Geographic homepage with a blue box and arrow highlighting the URL in a Firefox browser

However, a domain name can also be topical, like gluten-free-gutenberg.com for a food blog with gluten free recipes.

What’s most important is that your address is easy to remember and distinct. While you are at it, it’s also worth checking if the respective social media handles are available to ensure brand consistency.

As for domain endings, due to how common and memorable they are, you can usually go with the .com extension unless you have a good reason not to. One example would be if you operate in a specific area or country. Then, a local domain ending like .de for Germany or .co.uk for the United Kingdom may make the most sense for your intended audience. Specific extensions for certain industries and types of business, like .org, .app, or .ai, also exist.

For more information, check our article on how to choose a domain name.

A second important step is to make sure your desired domain is even available. For that, input it into a domain search tool. It will tell you if you are able to purchase the domain, how much it costs, and alternative ideas if your initial idea is already taken.

The WordPress.com domain search tool with a headline saying 'A Domain Name for Every Idea' and a field for finding a domain

Why consider a WordPress.com domain?

If you are looking for a domain, here a few good reasons to register it through WordPress.com:

  1. Affordable pricing: Standard domain endings are just $12 to $14 per year with hundreds of other options and frequent deals on chosen domains. Most importantly, if you decide to host your website with WordPress.com, you actually get a free domain included for the first year.
  2. Reliability: We’ve been in the domain business for over ten years. Our domains come with free privacy protection, SSL certificates, and a fast and secure DNS infrastructure.
  3. Great customer support: You can reach our domain experts via email and live chat for advice on everything from transferring domains to managing multiple at once.

Finally, having your website and domain hosted with the same provider offers you simplicity. You can manage your domain and site from one dashboard and don’t have to deal with connecting your domain to your hosting account manually.

Pick your WordPress.com theme

WordPress uses “themes” to control the design of your website. They include colors, fonts, layouts, and more—all of the elements that shape the look and feel of a website. You can change themes at will and, as a result, modify your website’s look in literal seconds.

Another benefit is that WordPress themes allow you to affect the appearance of your website without code. You can customize almost any aspect of your theme through an interface without needing to use  HTML or CSS.

Two websites side-by-side showing content about productivity with two different themes
Same website, same content, but different themes.

What kinds of themes exist?

The good thing about using WordPress as your website builder is that it has themes for pretty much any purpose. No matter what kind of website you want to create, there is likely a suitable theme already out there, complete with specific design elements for the type of site they are created for.

a screenshot of a blue and white website for a coffee shop

For example, here at WordPress.com, you can find themes for the following website categories:

  • Blog: These are perfect if you are planning to start blogging. They contain page templates that allow you to easily display and showcase your content. We also have themes for topical categories like travel & lifestyle.
  • Portfolio: Are you an artist, photographer, or painter? Then, portfolio themes are the perfect tools to show off your work. They are focused on drawing attention to photos, illustrations, and other creative works.
  • Business: Our business themes aim to help you set up your business site in the easiest way possible. You can also choose from different industries like restaurant websites, real estate, health & wellness, and more.
  • Store: If you are going the e-commerce route, these themes will give you a leg up in creating your store, offering your products, and attracting customers.
The WordPress.com theme directory showcasing recommended themes

It’s important to note that there are free and premium WordPress themes and that you can find them in a variety of places, including directories on WordPress.org and here on WordPress.com. Note that you need to have a WordPress.com site with a Business plan or above to install third-party themes.

How to install and apply themes

Changing your theme and website design is very easy. You will find the option under Appearance > Themes in the WordPress user interface.

a blue arrow pointing to the Appearance > Themes section in the WordPress.com dashboard

You can filter the list of themes by category at the top or search for specific keywords or theme names. If you see something you like, click on it for additional information.

The theme overview page for the Bain Marie theme on WordPress.com

Try out the style variations and read the theme description. Click Preview & Customize to try out your site in the new design with the option to customize and activate it.

The Preview and Customize theme page on WordPress.com

Alternatively, activate your theme from its own page via the Activate this design button. Some themes will automatically change your homepage content, so you have to confirm that you understand that. When you do and look at your site afterward, you can see it in its new look.

A WordPress.com website with the Bain Marie theme activated. It shows tan, white, and maroon sections and the title "The Website Builder" and a headline saying 'Tasty food, made simple, for everyone.'

Determine the branding and colors you’ll use on your site

Next, it’s time to set guidelines for the content that will populate your pages.

Give your website a voice

Your website content should sound like an extension of yourself or your company.  To achieve that, it helps to establish a basic voice for it.

You can do this quickly by following a simple “We are [BLANK], but not [BLANK]” exercise. Here are some examples:

  • We are lighthearted, but not goofy.
  • We are funny, but not offensive.
  • We are helpful, but not bossy.

Of course, if you run your website alone, you can also do this exercise with “I” and “am.” This exercise will help your website sound the way you want it to.

Establish a basic color scheme

If your company already has a visual identity, the website you create should match it. It should be immediately identifiable as your business or brand. 

For vertical color stripes–blue, green, yellow, and red
Did you recognize the Google color scheme right away?

Without an established color scheme, you have to create one from scratch.

Don’t have a graphic design background?

No worries, there are only a few things you need to understand here:

An example of a blue, grey, and teal color scheme from Coolors

Once you’ve grasped the basics, you can use what you’ve learned about color psychology and hex codes to establish color schemes for other parts of your business.

Put together the visual elements for your site

Food photos on Unsplash

Common examples of visual elements websites use:

  • Hero spots and banner images: These will go at the top of your website pages.
  • Photography: This includes product images, photos of your business, and staff headshots.
  • Designed images: Think charts, graphs, and infographics. 

It’s a good idea to figure out any graphics your site may require before you start building. Some assets you might already have on hand, and others you may need to create.

If your website will need photos (such as images of your business, a portrait of yourself, or maybe a quick snap of your dog), then gather them together now. You can also find more generic images on stock photo sites like Unsplash, Pixabay, Pexels, or Openverse. Just be sure that the image you want to use is copyright-free if you’re getting it from another source.

Should you need designed images (logos, charts, graphs, and so forth), basic design services like Canva, Stencil, or Snappa can help. They make image design easy, especially for featured images, graphs and charts, infographics, etc. Other options include Infogram, Piktochart, and Venngage.

Choose which pages your website needs

Here are some examples of basic pages that most websites need:

  • Home Page: The page that visitors land on when they enter your domain into a browser. It can have all types of content, including a blog feed or links to other important pages on your site. Anyone who lands on the homepage should immediately get a good understanding of what your site is about.
  • About Page: Visitors are usually keen to learn more about the company or people behind sites they like. Consequently, the About page is often one of the most frequented pages on a website, so make sure it’s impactful and clearly communicates who you are.
  • Contact page: This page is often the next step for visitors after the about page. Your contact page should clearly list all the ways visitors can get in touch or even come with a contact form.
  • Product and services page: Naturally, if you offer any services or products to purchase on your site, you need pages where visitors can take advantage of that.
  • Blog: Unless your homepage itself is a blog, you are going to need a separate page to show off your writing. The blog page usually lists articles in chronologically-descending order and also has extra information such as the most popular content and categories. When building a site on WordPress, your blog (like wordpress.com/blog) will be a Page but the individual articles that make up your blog are called Posts
  • Legal pages: These days, pretty much all websites need at least a privacy policy. You might also need a Terms & Conditions page and meet other legal requirements.

Consider this list to be a simple starting point. As before, the details depend on the type of website you want to make.

Great ways to determine which pages you’ll need are building a simple sitemap and planning your site structure. A simple spreadsheet or diagram is often enough for that.

a rudimentary example of a site diagram with sections pointing to others in a pyramid shape

Create your website content

When it comes to creating content, the two main questions are the “how” and “what.” You can either write your page content in a separate document and copy it over to your site or create the content right inside WordPress.

Learn how to create pages in WordPress

To make a new page in WordPress, go to Pages > Add New Page in the dashboard.

blue arrows showing where to click to add a new page in the WordPress.com dashboard

WordPress.com will automatically propose pre-defined layouts for different kinds of pages that you can choose from.

the Add a Page module on WordPress

However, it’s also possible to start with a blank canvas by clicking the Blank page button.

Either way, once you make your selection, you end up in the WordPress block editor.

The WordPress page editor on WordPress.com

To start creating your page, enter a title at the top and add your content (like text and photos) below. Page content is created in the form of Blocks, which can be anything from paragraphs and headings to layout elements like columns and even forms and widgets.

Paragraphs are the most simple; they appear as you write and insert line breaks. You can see every other available block when you click the big plus button in the upper left corner or in the editor itself.

A blue arrow pointing to the block inserter button in WordPress

Click on any of the block names to add them to the page. Then format and configure them through the settings bar and options in the sidebar.

Blue arrows showing how to insert and edit blocks in the WordPress page editor

You can also add more blocks by typing a slash forward (“/”) and searching for the name of a block.

The block inserter shown via typing a slash (/) in the WordPress page editor

When you publish (by clicking the Publish button in the top-right) or preview (by clicking the computer icon in the top-right) a page, the blocks you added appear as they would for readers of your website.

The frontend of a new WordPress website with a heading saying 'About My Food Blog' with a photo of some pesto bowtie pasta

Check out our documentation for more tips and tricks on building pages on your WordPress site.

Outline your page content

Before you start writing, determine what information you want to include on your pages. You can do this by drafting simple outlines right inside the WordPress editor.

a blue box and arrow highlighting headings in a WordPress blog post

Each outline should have:

  • A header or page title.
  • Subheadings for each page (you can create these using the heading block).
  • A description of the information each section should include.

Keep it clear and simple. You’ll have time to refine and polish your website copy later on.

Add written material

Unless you have a photography website or similar, your main content is likely going to be words. There are three areas to particularly pay attention to:

  • Titles
  • Body copy
  • Calls to action

Your title matters because it not only appears on your own website but also in search engines.

A blue box and arrow pointing to a search engine result for a post called 'Streamline Your Web Design Process'

It’s one of the main elements people use to decide whether or not to click on a link or check out a page. It has to be both informative and alluring, which can be a difficult balance to strike if you haven’t taken the time to plan out your content.

As you might have guessed, body copy appears in the body of the page and contains the main information of each page. This can be a list of your services, your about page, or a blog post.

A blue box and arrow calling out blog content with headings like 'Why I start Cooking' and 'The Early Days'

Here are a few basic writing guidelines that aid in readability:

  • Keep sentences under 25 words.
  • Use no more than three sentences per paragraph.
  • Remember your unique voice.
  • Write enough copy to cover the needs of each page.

Finally, some pages on your website will have a call to action, which gives your readers an obvious next step. A product page tries to sell, a blog post might encourage readers to comment or join an email list, and a contact page invites visitors to write you a message.

Clearly tell visitors what you would like them to do. You can do it in the form of a heading, button, or simple text. Your pages can also have more than one CTA, the important thing is that they are present and clear.

a blue arrow pointing to a 'sign up' call to action on the top of a website homepage

We have even more tips if you really want to make sure that your calls to action are as effective as possible.

If you’re struggling to come up with your written content, you can get assistance from the Jetpack AI Assistant on WordPress.com sites. It can craft content for you, propose headlines, check spelling and grammar, adjust the tone, translate content, and more. Check it out! (See, that was a call to action.)

Include images and other visuals

Visual elements help clarify or emphasize points you are making in your writing. They also break up the monotony of large text blocks and generally make online content more pleasant to consume. If you’ve been following along, you should already have your visuals ready.

The most common way to add them to content in WordPress is the WordPress image block. However, you have other options depending on the look you’re after, such as gallery, slideshow, or cover.

The settings of a gallery image block on WordPress with a gallery of five images shown in the editor

You can also include images from the aforementioned Pexels and Openverse right inside the WordPress.com editor. While you create your website pages, click on the block inserter again and then go to the Media tab. Search images by keyword and click them to add them to the editor, complete with the correct attribution.

arrows showing adding an images from Openverse to the WordPress.com editor

Consider using videos

Videos are undeniably one of the most popular forms of online content. With WordPress, you can easily embed in your website content. For example, when you copy and paste a YouTube video URL into the editor, WordPress automatically embeds the video where you put the link using the YouTube block.

a blue box around the YouTube embed block in the WordPress editor

Automatic embeds like this exist for many other services, including for social media posts.

The WordPress editor also has a number of blocks that allow the use of video, such as a moving background in certain blocks. Finally, you have the option to post animated GIFs (or short videos in image form) as either uploaded images or embedded from somewhere else.

A blue arrow pointing to a gif inserter in the WordPress editor

Set up your homepage

To make one of your newly created pages your homepage, go to Settings > Reading in the WordPress.com admin dashboard. At the top, you’ll see two drop-down menus that allow you to define which page serves as your homepage and which one displays your blog posts.

A blue box and arrow pointing to homepage displays and reading settings in WordPress

Select your desired (published) page under Your homepage displays and save the settings. That’s it, your homepage is now live!

Add your pages to a menu

Besides your homepage, you want visitors to be able to access the rest of your most important pages. The most common way to do so is with a navigation menu. You can create and modify one under Appearance > Editor in the Site Editor.

Blue box and arrow pointing to the Appearance > Editor page in the WordPress dashboard

The screen you land on looks similar to the block editor used for pages; however, instead of a single page, you can make changes to the entire site layout.

a screenshot of the Blog Home template page on WordPress.com for a food blog

The block that is responsible for navigation menus is itself called Navigation, and you usually already find it in the top section of your theme. Use the Document Overview (it’s a black button with three horizontal lines in the top toolbar) to find it.

Blue arrows and boxes highlighting the Document Overview button in the WordPress editor

Here, you can easily add or subtract menu items, change their order, or modify the entire look of the navigation across all of the pages on your site. All of that happens with the help of the settings bar and menu in the sidebar.

Blue arrows and boxes highlighting the settings menu for a navigation block

Customize your header and footer

While here, you might as well make changes to your header and footer (if necessary). They are the top and bottom elements of your website, respectively.

a blue arrow and box highlighting the footer template in WordPress

You’ve probably already encountered the header element while working on your navigation menu. Besides the menu, it usually contains things like the logo or a search field. Its main functionality is branding and helping people get around your site.

The footer is meant to invite people to stick around longer and explore more options when they reach the end of a page. For that, it commonly includes elements like the copyright notice, extra menus, or your business address.

Your WordPress theme likely already has a header and footer. However, you can try out different options by simply clicking on either element. When you do, additional design options show up in the sidebar.

Blue boxes and arrows highlighting the footer template designs in the WordPress editor

Click on any of them to insert the block into the editor.

a blue box and arrow highlighting a new footer design in a WordPress editor

You can also customize them like any other page element. Add layout elements like columns and rows, fill them with menus, social icons, or text. You can also change background and font colors, sizes, and more in the sidebar menu.

Check out our post on how to customize your header for more ideas.

Add functionality with plugins

WordPress plugins are programs that you can install on your website to add specific features and functionality. They are part of what makes WordPress so customizable; instead of filling the platform with loads of functionality not everyone needs, you can add site features according to your individual requirements.

You can think of them like apps on your phone. Not everyone needs the same banking app that you do, but you can download it to your phone to add that necessary functionality for you.

Plugins can add small tweaks, like the ability to change usernames, or big features, like online store capabilities or entire page builders.

The WooCommerce plugin page on WordPress.com

Additionally, there are literally tens of thousands of plugins available. Created by individual developers as well as companies, you can find many of them in the plugin repositories on WordPress.com and WordPress.org, but also third-party stores and  on websites of individual developers. Like themes, there are free and paid plugins.

On WordPress.com, you need a site on a Business plan or higher to be able to install plugins. However, all websites on WordPress.com come with two important plugins by default:

  • Jetpack: Jetpack has features for many important parts of website management like speed, security, and growth.
  • Akismet: Our anti-spam plugin. It uses artificial intelligence and machine learning to sort the spam comments your site receives from the real deal.

Learn more about what WordPress plugins are and how they work.

How to install and activate plugins

Go to the Plugins menu. Use the search bar to look for what you need by name or keyword, or go through the categories.

The WordPress plugin menu on WordPress.com

When you see something you are interested in, click on it to learn more and then on Install and activate (or Purchase and activate if it’s a paid plugin) to add it to your site.

The Install and activate page for the Yoast SEO plugin on WordPress.com

The plugin will automatically download and become active on your site so you can start using it. You can manage all the plugins on your site as well as deactivate and delete them under Plugins > Installed Plugins.

The Installed Plugins page on WordPress.com

Popular plugin options

If you don’t know which plugins you should install while you create your website, here are a few popular examples:

  • Yoast: The most popular WordPress SEO plugin. It allows you to add important information for search engines, such as SEO titles and descriptions. It also has an analysis module where it tells you what you need to do to optimize your pages and much more.
  • Crowdsignal Forms: This is a plugin that comes pre-installed on WordPress.com sites to help you create contact forms where visitors can get in touch with you. Alternatively, consider using the Form block.
  • ShortPixel Adaptive Images: Images can be an obstacle to website speed because of their size and longer download time. This plugin helps by converting your visuals to file types with a smaller footprint, compressing them, adding lazy loading, and much more.
  • MonsterInsights: Easily connect Google Analytics to your website (more on that below) and display website data in your WordPress dashboard. Alternatively, you can enable Google Analytics tracking on WordPress.com without installing a plugin on eligible plans.

For more input and ideas, read our article on must-have plugin recommendations.

Optimize your site for search engines

In order to attract visitors from search engines, you need to make sure your site is configured in a way that search providers will be able to understand its topic correctly.

With your site running on WordPress, it is automatically search engine-friendly. The CMS is configured in a way by default that makes you content readable and well-structured. Yet, there are still a few things that you can and should do to give your site the last bit of SEO polish.

Write title tags for each page

It’s possible to customize your page titles just for search engines so they are short enough to not be cut off in search results but descriptive enough to entice new visitors to your site.

On WordPress.com, you have the ability to do so via the Jetpack plugin. Go to Jetpack > Settings > Traffic and find the Search engine optimization panel. Here, you can define default title structures for different types of content as well as preview and customize your front page’s appearance in search results and social media.

Jetpack SEO options including front page, posts, pages, tags, and archives

You can also enable an option to do the same for individual posts and pages.

A blue box and arrow highlighting the SEO title/description Jetpack settings in the WordPress editor

SEO plugins, like the aforementioned Yoast SEO, also add this and other abilities to your website. For example, both Jetpack and Yoast will automatically create a sitemap for you.

Add meta descriptions

A meta description is another piece of information that appears in search results. It’s the text that you see below the links and URL.

a blue box and arrow highlighting a meta description in a Google search result

You can configure this with the aforementioned tools, and in general, meta descriptions should be no longer than 160 characters. If no meta description is set, Google will either use the beginning of the post/page or a random passage that it deems relevant.

In fact, it will often do the latter, even if you have included a meta description. However, writing a custom description allows you to control its content for those cases when it does show up. 

Use a search-friendly URL structure

The URL is another element that search engines look at when figuring out the topic and ranking of your website. You can configure different link structures for your site in WordPress under Settings > Permalinks.

The WordPress permalink settings

The most important part is that you show the post name at the end of the URL (also known as the slug). That way, you can include your topic and keywords there. Luckily, WordPress is automatically configured to do so.

You also have the option to display categories in the URL structure. This makes sense if you’re creating a website with an online shop, where grouping products is imperative.

a blue box highlighting an ecommerce URL structure

However, it can also be a good idea for content-based sites. It helps further clarify broad topics.

Finally, you have the possibility to include a date in the URL so that people can see when a particular post was first published. This makes the most sense for websites where the date is important to the article context, like news websites.

It’s important to note that unless you have a completely new site, you shouldn’t change your URL structure randomly! It can make you lose search traffic by breaking the links already indexed by Google. This kind of thing needs careful consideration and planning to not ruin your hard work.

Include relevant keywords

Keywords are terms your target audience might use when searching for content like yours. For example, a reader may look up “gluten free pasta salad” to find a new recipe. If you want your pasta salad recipe to rank for that search term, you’ll need to make sure that term (otherwise known as a keyword) appears within your content. 

It’s important to put keywords in the title, URL, and meta description. Besides that, you should also include them in your written text, the file names of your images, and their alt text. You can configure the last part in the editor sidebar when you click on any image block.

a blue box and arrow highlighting how you can add alt text to images in WordPress

The information here is used by search spiders and screen readers of people who are visually impaired to figure out the content of an image without being able to see it. Therefore, it is very important for accessibility, not just SEO. It should be a description of what the image is about.

If you are unsure about your use of keywords, many SEO plugins let you enter the keyword you are targeting into the analysis module and give you a checklist if you have used it enough and in the right places. 

blue boxes and arrows showing on-page SEO analysis with the Yoast plugin on WordPress

Generally, you don’t want to overdo keyword usage in your posts or pages, as that can be rather unpleasant to read as a site visitor. Instead, be mindful of the term you’re trying to rank for and use it and variations of it throughout your content in a natural way.

Set up analytics

Web analytics allow you to track website metrics so that you know if you are achieving your goals. They also help you figure out what’s working on your site, if there are technical problems, and which content is popular. Three common tools for this are Google Search Console, Google Analytics, and Jetpack Stats.

Google Search Console

Search Console is what Google calls its webmaster tools. It’s free to use, and you can connect your site to it to find out how your content is performing in search results. It tells you what search queries your content is ranking for, the number of impressions, clicks, and your click-through rate.

search result performance for a site on Google Search Console

This information helps you determine your best-performing pages, find related keywords, and see the countries your content is most popular in. You can also find out what queries individual pages rank for and take action if the performance starts to decrease.

Besides that, Search Console tells you if there are technical problems on your website, and you can find out your indexing status, page experience, Core Web Vitals, and more. This helps you make sure your search performance is not hurt by a technical glitch. You can also submit a sitemap to help Google discover your content.

Google Analytics

Google Analytics is another free Google tool that you can connect to your site. Instead of ranking in search, it reports on traffic from all sources and helps you better understand how visitors interact with your site once they’re there.

a screenshot of google analytics 4 dashboard

The tool shows how many people are on your site, where they come from (both the medium and locality), what content they look at, how they move through your site, where they drop off, how long they stick around, and a lot more. It also lets you track conversions for custom events and shopping activity.

This tool helps website owners understand what pages and content are most popular and how you can improve the experience on your site in order to move visitors towards desired calls to action and pages.

Jetpack Stats

Jetpack Stats is present by default on any website you create on WordPress.com, and you find it in the Stats menu.

a screenshot of Jetpack stats on WordPress.com

The analytics tells you the number of visitors, page views, likes, and comments. You can filter it by different timeframes, see your most popular posts and pages, who refers visitors to you, where they come from in the world, search terms, most clicked links, and a lot more.

Depending on your WordPress.com plan, you may also see the Insights tab that gives you a yearly overview of how much you posted, your visitors per day, the most popular posts, and more.

Jetpack stats insights showing a 2024 year in review

Finally, there is also information about your WordPress.com subscribers.

Test, publish, and promote your website

Once you have finished all of the above, the final step is to publish your site. But there’s one that comes before it: testing.

Go through every part of your website and make sure it’s the way you want it to be. Test all functionality, proofread content, check your pages on different devices, and run them through a speed tool like the WordPress.com Speed Test.

Once satisfied, publishing your site usually means switching it from private to public in Settings > General. Make sure to disable the setting that discourages search engines from indexing your site.

A blue box and arrow pointing to the privacy settings on WordPress.com

After that, it’s publicly available and ready to welcome visitors. However, you have to take an active role in bringing them to your site. Here’s how:

  • SEO: We have already covered how to optimize content to rank well in search. To let search engines know that your site exists, make sure to submit your sitemap to webmaster tools like Google Search Console. That way, they can index your pages and show them in search results.
  • Social: Use social media to promote your website and potential blog posts. Write updates, use appropriate hashtags, and interact with others in your industry.
  • Email: Starting an email newsletter is an effective way to build a loyal following. You can email them about new content and other news.

Jetpack, which comes with every WordPress.com website, has a number of useful features for this. For example, under Tools > Marketing you can connect to your social accounts and have the plugin automatically post new site content to them.

A blue box and arrow highlighting the Connections under Marketing on WordPress.com

Likewise, under Settings > Newsletter (or Jetpack > Settings > Newsletter on eligible plans), you can add email newsletter functionality to your site and configure where sign-up boxes appear.

Blue boxes and arrows pointing to the Newsletter setting in the Jetpack plugin on WordPress.com

Plus, you can use the Subscribe block to add more options manually. Once set up, you have the ability to automatically send new posts to anyone who signs up to your newsletter.

Maintain your website

Running a website means playing the long game, and it takes consistent effort to make it successful. Two of the most important matters to keep in mind are backups and content updates.

Without a backup solution in place for your website, you could lose everything you worked so hard to create. In addition, if you let your content go stale, it can lead to loss of search rankings and a bad user experience.

If your site is hosted at WordPress.com, the first part is taken care of for you. All sites on Business plans and above are automatically backed up at least once a day and give you the ability to restore them to any previous point in time.

blue boxes and arrow pointing to the Backup setting on WordPress.com under Jetpack

That’s the beautiful part about managed hosting; it leaves you time and space for non-admin work. Time that you should invest in keeping your content updated. At least once a month, make sure to look over your most important pages to see if the information is still current, especially crucial information like your business hours or address.

Besides that, if you are running a blog, you should also regularly update your articles. Google Search Console and other SEO tools can tell you if your rankings start worsening. If you see rankings start to go down, that’s definitely a cue that your content might need an update.

Frequently Asked Quetions

Finally, let’s go over some FAQs about creating a website.

Do I need to learn how to code?

No, absolutely not. WordPress is set up as a beginner-friendly, no-code solution. Thanks to its powerful block editor, you can make almost any change you want through its visual interface.

If you do know how to code, you do have the ability to use it on your site. However, it is never a requirement.

How long should it take to build my website?

There is no cut-and-dry answer to this. It will depend on the type of website you’d like to build, your level of expertise, how much time you are able to commit to it, and more.

Generally speaking, you can start a basic website with WordPress.com in a weekend. As you have seen above, it’s enough to simply slap on a design, create pages and content, and put it out there. If you need something more elaborate, it will, of course, take longer.

How much should I pay for a website?

Just like time invested, website costs are variable and depend on your needs. Two of the most basic costs are your domain and your hosting plan. These are easy to figure out.

However, there are other costs involved with building and running a website, such as from buying premium themes, plugins, or tools. Yet, as mentioned, a lot of that is optional, and you can forgo some of the bells and whistles to make the process more affordable.

It’s important to note that with a WordPress.com plan, you get a lot of value for your money. They include many features you often would have to pay a separate service or plugin for, especially when it comes to website speed and security.

Why is WordPress.com the best choice for my hosting/website builder?

Here’s what you benefit from by choosing WordPress.com as the home for your website:

  • Customer support: Access to 24/7 expert support, ensuring you get help whenever you need it.
  • Security: Automatic updates, daily backups, and built-in security measures protect your site from malware and hacking attempts.
  • Built-in Jetpack features: Essential tools like site stats, social sharing, downtime monitoring, and basic SEO are built-in, improving your site’s performance and reach.
  • Speed: WordPress.com’s global Content Delivery Network (CDN) and optimized infrastructure ensure fast load times for visitors worldwide.
  • No limits on traffic: We handle any amount of traffic without you needing to worry about bandwidth limits, extra costs, or a decrease in site performance.
  • Open source-driven: Because WordPress.com is hosting made for the open source WordPress software, you have the flexibility and freedom to customize your site (unlike other proprietary solutions).
  • Themes and plugins (on the Business plan and above): Unlock thousands of premium themes and plugins for advanced customization and added functionality to match your unique needs.

Create your website with WordPress today

Lack of development and technical skills shouldn’t keep you from setting up your own website. Even as a beginner, you can follow the steps above to create your presence on the internet.

While it might be a bit outside of your comfort zone, it’s absolutely doable. All it takes is a willingness to try, learn, and persevere. With that, you too can create a website for yourself. Know what you want to achieve, then set out to do it one step at a time.

We’d be honored to be along for the ride. Sign up to WordPress.com today and take advantage of the convenience of WordPress-optimized managed hosting, powerful tools, and expert support. Whether you’re starting a personal blog, launching a business site, or opening an online store, everything you need is within reach.

How to Start a Successful Blog: A 12-Step Guide for Beginners

21 January 2025 at 09:00

So, you want to start a blog, huh? First of all, that’s a pretty dope idea. In my opinion, it’s one of the most fun and rewarding things you can do.

Blogging allows you to dive deeply into topics that really interest you, improve as a writer, and learn a ton along the way. In addition, starting your own blog has never been easier. The required pieces are readily available. You just have to know how to use them, which is what this post will show you.

We’ll cover the step-by-step process on how you can start a blog basically today. From if and why you should do it, over preparation, getting a website address, setting up and designing your blog, to writing your first blog post and making it ready for publishing.

But wait, isn’t blogging dead?

If blogging had really died as often as people said it did, it would have signed a DNR by now.

But, the truth is, blogging has never really gone away. It has changed over time, for sure, but is still a valid way to attract an audience, drive traffic to your website, and even build a business around.

Need proof?

In Orbit Media Studio’s annual blogger survey, out of 1,000 professional bloggers:

  • 77% of participants say they see results from blogging, 20% even say strong results
  • 65% use it as a tool to drive SEO traffic to their websites
Chart illustrating the percentage of bloggers who consider themselves successful.

Yes, they also say it takes more effort to craft blog posts. Participants see the best results when they spend 4-6+ hours per in-depth blog post. But blogging is alive and well.

Okay, so why should you start a blog?

Starting a blog lets you write about and explore anything you want. Whatever your interest or passion, it’s an outlet to curate your knowledge and ideas.

Example of a blog sharing knowledge and expertise.

In addition, it’s great writing practice and great thinking practice too. It forces you to properly structure your ideas. Plus, it really helps with learning because, in order to explain something to others, you first need to understand it yourself.

In addition, being creative is simply fun and meaningful. Sharing what you know with others in the hopes of helping, inspiring, and educating them is rewarding.

What’s more, it can actually be a vehicle to build an audience, establish authority in your industry, and position yourself as an expert. And who knows, over time, your  blog might turn into a side or even main business. You wouldn’t be the first blogger to start earning money from sharing your knowledge.

Example of a blog's home page.

Most importantly, a blog is your own presence on the web where you can decide what happens and how. And, especially if you create it with a system like WordPress, you fully own it.

That’s different from, say, a presence on social media, where you can:

  • Get banned for violating the terms and conditions, even accidentally
  • Lose your reach due to an algorithm change
  • Be forced to migrate because you don’t support the new ownership

When you don’t own your outlet, you are at the mercy of those who do.

Ready to sign up with WordPress.com? Start your blogging journey here.

How to start a blog with WordPress.com in 12 steps

Feel motivated yet? Good, then let’s put that energy to good use.

1. Choose a niche and determine what you’ll write about

When considering your blog topic and niche, there are three fundamental factors to think about:

  • Your interest – It’s hard to start a successful blog and stay motivated to write about something day in and day out that you aren’t really into, even if it’s a popular topic. So, choose something you actually care about, it will also show in your writing.
  • The audience – Is there enough general interest in your topic that you are able to attract an audience? You can use tools like Google Trends, Google Keyword Planner, Similarweb, or the Ubersuggest Chrome extension to research this.
  • Monetization – Some niches are more suitable for building a business around than others. If that’s your goal, it helps to do some research beforehand. For example, you may check if there are affiliate programs you could sign up for. A simple Google search like “[your topic] affiliate program” is often enough. Other ways to monetize a blog are Patreon and Ko-fi. On WordPress.com you can also accept donations and run ads on your blog.

It’s also important to niche down. Start with broader topics like personal finance, cooking, or travel. From there, dig further, for example:

  • Investing for millennials
  • High-protein meal prep ideas
  • Solo travel for women

You can always broaden your topic later but for the beginning, going small helps you focus.

2. Brainstorm a name for your blog and secure your domain

In naming your blog, you can go different routes. For example, you could use your own name like author James Clear.

Screenshot of James Clear's blog.

This emphasizes who is behind the writing even if it doesn’t give away the blog’s topic yet. You can also use a business name instead of your personal name.

Another choice is to give the blog a title that conveys its topic, similar to Nerd Fitness.

Screenshot of the Nerd Fitness blog.

A third option is to do a mix. For example, Chris Guillebeau uses his own name for the domain but his blog is called “The Art of Non-Conformity”

Screenshot of the Art of Non Conformity blog.

Generally, your blog name should be clear, easy to remember, and unique. This also matters for your choice of domain name. You want to use one that’s the same as the blog name or at least intimately tied to it.

To find out if your desired domain is available, use WordPress.com’s domain search tool.

Screenshot of WordPress.com's domain name search tool.

Input your desired name and the tool will tell you if it’s available, what it costs, and alternatives.

Screenshot of the choosing a domain step.

You can also purchase it right then and there. More tips for choosing a domain name.

3. Pick a hosting plan

Hosting allows you to make your blog available for people surfing the Internet. With WordPress, you are free to choose where to host your blog.

Using a managed hosting provider like WordPress.com allows you to outsource many of the more technical tasks of starting a blog, like:

  • Installation – You can skip uploading the files to a server, creating a database, or running the installation yourself.
  • Speed optimization – WordPress.com’s servers are optimized for WordPress and offer other speed features.
  • Security – You get daily security scans, automatic backups, brute-force protection, downtime monitoring, encryption, firewalls, DDoS protection, automatic software updates, and more with every plan. Don’t worry if you don’t know what half of this means. The bottom line is simply that your blog is super secure from being hacked.

All of the above allows you to fully concentrate on content creation and growing your blog. Simply choose a WordPress.com plan to get started.

Screenshot of pricing page, where users can choose a hosting plan.

Each plan comes with unlimited visitors, posts, and pages. You can even start with the Free plan and upgrade later, such as when you want to extend your blog’s functionality with plugins on the Business plan. Plus, if you go for the yearly option, every plan also includes a free domain for one year.

4. Select a WordPress blog theme

Themes control the design of a WordPress blog. Switching from one theme to another can make a huge difference in the look and feel of your blog. There are plenty of blog themes with design and layout elements specifically for blogging, making it easy to start. They even exist for different subjects like food, travel, etc.

A pair of WordPress blogs, with themes made for blogging.

To install one, log in to your WordPress blog, go to Appearance > Themes, and click the Blog category at the top.

Where to change your blog's theme.

Click on any theme you like for additional information and also to try out any style variations it comes with.

Example of a blog theme detail page.

You can apply it to your blog right then and there by clicking Activate this design. Alternatively, click Preview & Customize to view your current website in the new skin and make adjustments before activating it.

Example of Preview & Customize screen.

5. Add pages

At this point, you might want to jump straight into customizing your theme design and we’ll get to that. But, in order to do so, it helps to first get familiar with the basic workflow of how to edit content in WordPress.

A good way to ease yourself into it is to create pages. It uses a lot of the same principles but is less complex and, therefore, a good starting point.

You create a new page by going to Pages > Add New Page in your WordPress admin interface. The first thing you’ll see is a prompt with block patterns for different types of pages. They can work as a starting point and you can insert them with a click.

Add a page to your WordPress blog.

Alternatively, you can also start with a blank page.

Example of a blank page.

Insert page elements

In WordPress, basic design elements are called “blocks”. For example, the editor automatically creates a paragraph block when you write something and press the enter key.

You find a list of all available blocks when you click the big “+” button in the top left corner.

Options to add page elements.

They range from text elements and buttons to layout elements like columns and beyond. A click on any of them inserts it into the editor.

More detailed page elements.

You also have access to more pre-designed collections of blocks in the Patterns tab. Inserting them works the same way.

Where to find the Patterns tab.

You can also add blocks by clicking the small “+” button that appears when you place your cursor within the editor. Alternatively, type a forward slash (“/”) in any empty line followed by the block name.

Where to find the + button.

Every element in the editor is customizable. Click it and you’ll find an options bar at the top and additional customization options in the Settings sidebar.

Where to find the Settings sidebar.

Use the editor to create must-have pages for your blog, such as:

  • About page
  • Contact page
  • Legal pages like a privacy policy

6. Add a menu

Including your new pages in a navigation menu allows your visitors to reach them easily. Sitewide changes like this happen in the Site Editor. Enter it via Appearance > Editor.

Example of the Site Editor in WordPress.

You’ll quickly notice that it works the same way as the Page Editor, only that there are more site elements you can work on. For example, your theme likely already has a navigation menu. In this example, it appears as part of the header.

There are different ways to customize it. One is via the Navigation menu. Another is through Patterns and Header. Thirdly, you can also click the header element in the main editing window and then choose Edit.

Choose Edit.

In all cases, the element you want to edit is the Navigation block. Opening the Document Overview menu helps you find it more easily. Once active, it lets you add and subtract menu items and other elements, rename them, and more.

Where to find the Document Overview.

Note: In some themes you control menus in the Site Customizer instead. Find information about that here.

7. Customize theme design

While already in the Site Editor, you can also start to change the appearance of other parts of your blog.

Change global styles

Changing global design options like fonts, colors, etc. happens in the Styles menu on the right side of the screen.

Screenshot of the Styles menu.

Among other things, it lets you change:

  • Style presets – Switch between style variations your theme ships with.
  • Typography – Make changes to the font family, size, appearance and more for all text on your blog, from body copy to links and headings.
  • Colors – Define custom colors, try out existing palettes, and change the color of text, backgrounds, links, and beyond.
  • Layout – Define content width, global padding, and spacing.

For example, if you go to Colors > Background, you can change the background color of your blog with a few clicks.

Screenshot of where to change background colors.

Customize page templates

Page templates work like blueprints for certain content types. If you modify a template, the changes apply to all pieces of content of that kind.

You can access them via the Templates menu when you click on the WordPress logo in the Site Editor.

Where to find Templates settings.

One of the most decisive customizations you can make here is to determine how your posts appear on your blog page. Your theme most likely has a template called Blog Home for that.

Example of selecting an existing template.

Click to start editing it. Find the Query Loop block (again, use the Document Overview) and choose Replace.

Where to find the Query Loop block.

This will show you available patterns for displaying the main blog.

Where to find Available Patterns.

Click whichever you like to see it on the page.

Place the block where desired.

Customize it as needed. If you save now, your blog will adopt the new design.

8. Add blog categories

You should now have enough knowledge to customize the look of your blog. From here, it’s time to talk about how to create content, starting with categories.

Categories bring order to your blog posts and also clarify the topics of your blog to search engines. You manage them in Posts > Categories. Click the blue button to add a new category.

Where to add new blog categories.

Provide a name and, optionally, a description that can show up in category archive pages. You’re also able to create sub-categories this way.

Naming a new blog category.

Think of categories as broad topics that your blog is about. For example, a food blog would have categories like Recipes, Cooking Tips, and Product Reviews and from there subcategories like Breakfast, Meal Prep, and Cookbooks.

Start with 3-5 categories. If you have more than that, your blog topic might lack focus.

Later, you assign categories in the Post Editor sidebar.

Assigning a blog category to a post.

9. Develop a basic content strategy

In writing blog content, it helps to be strategic and develop a plan that will keep you on track.

The first step is to decide how often you want to publish a new post. This depends a lot on how much time you have available to invest. In the beginning, it’s more important to be consistent than to post often. Once a week or every other week is an okay goal to start with.

As for what to write about, you probably already have a few ideas for blog topics. Spend 10 minutes jotting down as many as you can.

Example list of blog topics.

After that, take another 10 minutes to score those ideas with numbers 1-3, the highest number being the best. Take your 3s and input them into tools like Google Keyword Planner, Semrush, or Ubersuggest. This will help you validate demand and also refine your exact key phrases.

Then add all those left over to your calendar.

10. Write your first blog post

If you’ve made it this far, it’s finally time–you are going to start creating your first blog post. This can be a bit overwhelming at first, so let’s break it down into manageable steps.

Create an outline

A blog post outline gives you an overview of the general content and structure of your blog post. Here’s an example:

A sample of an outline.

It helps you determine the topic, angle, and main points. You can actually create it right in your WordPress blog. Go to the WordPress Post Editor (Posts > Add New Post) and open the Outline feature in the document overview.

Screenshot of the WordPress outline feature.

This shows the heading structure of your future post. Use h2 headings to determine main sections, then h3 headings to further divide them, and so forth. You can also create a list of points you want to make in each section if you already know them.

Start researching

The research phase is where you collect all the raw information you will mention in your blog post and bring it into the right order.

Filling in an outline with research.

This usually involves a lot of googling and reading the material that’s already out there. But you can also use books, your own expertise, or other sources.

You don’t need to write complete sentences here. Incomplete sentences and key phrases are enough.

Write a first draft

The main objective of your first draft is to turn your research notes into a cohesive text. This won’t be the final version and nobody else is going to see it, so shoot for volume rather than conciseness and speed over precision.

Seriously, you just want to vomit enough text onto the page that you have something to work with, so avoid sweating over specific sentences or editing while writing.

Edit and format

The editing phase is the most important part of the process. This is where you polish your draft, clarify your points, make sure the post progresses logically, and refine your writing. Besides research, this is where most of your effort should go and it often helps to do several rounds of editing.

Part of editing is formatting to ensure readability. Here are a few suggestions and best practices for that:

  • Include no more than 25 words per sentence
  • Use around three sentences per paragraph
  • Try to express one idea per paragraph
  • Keep sections short (under 300 words)
  • Use numbered and unnumbered lists

A great help is to input your content into the Hemingway App. On the Business plan and above, you can also install plugins like Yoast SEO and Rank Math that have a readability analysis.

Checking readability of a blog post in Yoast.

Add visuals

Visual content breaks up text, makes it more interesting, and clarifies and emphasizes your points. It can take many different forms, such as:

Note that you can directly embed images from Openverse and Pexels via the Block Inserter’s Media tab.

Where to find the Media tab.

Just search for a keyword and click when you find an image that you like to insert it.

Refine your headline

More people read your headline than will read the rest of your post, it can really make or break your article. To make sure it is the best it can be and get some practice, challenge yourself to write 25 of them.

If you are drawing a blank, feel free to plug it into your favorite AI tool for some input.

Using AI to generate ideas for headlines.

For example, Jetpack AI can also help you create a headline for your post.

Generating a blog post title with Jetpack AI.

In addition, you can use a free headline tool like Easy Peasy AI to further refine your ideas.

Screenshot of Easy Peasy Headline Analyzer.

11. Optimize your post for SEO

The aforementioned SEO plugins also help you optimize your blog post for search engines. For one, they allow you to set custom page titles and meta descriptions.

Editing Yoast meta data for SEO.

These show up prominently in search results.

Example of a title tag and meta description in a search result.

Customizing them makes sure they are engaging, inspire clicks, and don’t get cut off. You can also use Jetpack for this purpose.

SEO plugins additionally often come with content analysis models. When you input your main keyword, they tell you how well-optimized your post is.

Screenshot of an SEO analysis from Yoast.

An Important part that they will alert you to is using your keyword in your post slug, meaning the end of its URL.

Example of a blog post slug.

It’s best if you make it concise, no more than 3-5 words. Ideally, it should just be the main key phrase.

You can also further customize the entire URL structure of your blog under Settings > Permalinks.

Where to find settings to edit permalink structure.

Including categories can help further clarify your blog topics to search engines but it’s not a must. Just be sure not to change the permalink structure of an established blog because it will neutralize established links in search engines and lead to 404 errors.

Finally, make sure to include internal links in your blog post to related blog articles and other relevant pages. It will help visitors discover more information and also helps spread SEO value throughout your entire site.

Good starting points to learn more about SEO are Positionly’s blog SEO best practices and Moz’s Beginner’s Guide. You’ll also want to learn about image SEO.

12. Promote your blog posts

Besides SEO, additional promotion channels like social media and building an email list help you get your blog writing in front of more people.

All WordPress.com plans come with Jetpack, which you can find under Tools > Marketing > Connections. It allows you to automatically publish new blog content to selected social accounts.

Where to find the setting to add Connections.

You can also easily add social sharing buttons to your content using the Sharing Buttons block to make it easy for your readers to further spread the word. 

Example of social media sharing buttons on a WordPress blog.

In addition, WordPress.com has native functionality to build a newsletter. It allows you to collect subscribers, automatically send out new posts via email, schedule them ahead of time, and even monetize your newsletter.

You find options for that under Settings > Newsletter. It lets you offer different subscription options throughout your site and content. You can also set them up manually with the Subscribe block.

How to adjust newsletter settings in WordPress.com.

In addition, you customize the content and features of your emails as well as set up a welcome message to new subscribers. Detailed instructions in the documentation.

Make This the Year When You Start Your Blog!

Creating a blog, whether as a hobby, to build a personal brand, or to grow a business, is a rewarding experience. It allows you to share your passions with the world and claim your own spot on the web.

The process may seem overwhelming at first, but if you take it step by step, it’s both accessible and achievable for anyone willing to put in the effort. So, why wait? Bring your ideas to life, and start building something meaningful today. Launch your blog in just a few clicks on WordPress.com.

How to Create an Editorial Calendar and Be a More Successful Blogger

10 January 2025 at 12:14

Want to make your blogging life easier with just one tool? Start using an editorial calendar. Let us show you how to create one.

It takes discipline to run a successful blog. Without something to organize your publishing schedule, it’s easy to waste time wondering what you should write about, and hard to hold yourself accountable for meeting deadlines. With a well-designed content calendar, you can burn less mental energy thinking about your blog, and focus more clearly on your writing. 

The end result? You produce better content with less effort. It’s win-win.

Editorial calendars are easy to set up too, so there’s no excuse not to use one. In this post, we’ll cover the following (and more):

  • How to build one in under five minutes using a simple spreadsheet (with a free template you can copy).
  • How to establish a sustainable posting schedule for your blog.
  • How to generate tons of blog post ideas to keep your calendar full.

Plus, we’ll even get into some advanced tools and tactics you can use to level up your calendar and content planning game. A better blogging future awaits you.

Start your “someday” project today. Build your blog with WordPress.com now.

What’s the purpose of an editorial calendar?

An editorial calendar is a visual schedule of the content you will publish on your blog (or other channels). They document the topics you will cover, when you’ll publish each piece, and other important information. Typically, they are created using spreadsheets or dedicated software.

Bloggers and marketers have borrowed the concept of an editorial calendar from the journalism world, where writers and editors have been using calendars to keep organized for decades. No matter what type of content creator you are, you can benefit from using such a calendar too.

Why should you really use an editorial calendar?

The obvious reason to use a calendar is to get organized. But why does getting organized matter and how does that translate into being a more successful blogger? Here are a few ways that getting more organized is directly connected to better blogging results.

Destress your blogging life

Developing a consistent writing practice is challenging. Knowing what you will work on, before you sit down to write, can help you spend less time wondering what to write so you can focus on the words. If writing is less stressful and more satisfying, you’ll be more likely to stick with it. 

Produce writing that you’re proud to publish

You’re more likely to produce writing you’re happy with if you aren’t mentally overwhelmed. Anything you can do to get control over your blog (whether by planning ahead, writing clear outlines, or anything else that helps you get organized) will help make you more successful.

Get better results from your blogging efforts

It’s easy to think that becoming a successful blogger is all about creativity. While creativity is important, the real foundation for success might actually be having strong processes in place. An editorial calendar can form the foundation for your blogging workflow, helping you plan what you will publish in advance, so you can flex your creativity without worrying about distractions. 

How to create an editorial calendar in five minutes

There are many different tools you can use to create your calendar. Let’s start by building one with Google Sheets (though you can use any spreadsheet or similar tool you’d like, such as Airtable, Clickup, or Excel). 

Create a new spreadsheet and add your top row

First, create a new spreadsheet, and add a top row with the following labels:

  1. Date
  2. Topic
  3. Category (these should match your blog categories)
  4. Status
  5. Author (if your blog will have more than one author)
  6. Published Link

It should look something like this:

Adding headings to the editorial calendar.

Add rows for months under column A

Next, add some placeholder dates and columns for future months. This will help keep your calendar organized as the year progresses:

Add rows for months to the editorial calendar.

Add a dropdown selector under the Status column

If you’re using Google Sheets, click Insert, then click Dropdown. This is how we’ll add status selector options that will make it easy to see the progress you’re making on each post:

Adding a publishing status dropdown selector to the editorial calendar.

Add basic labels that outline your writing process. At a minimum, include Not Started, In Progress, and Published. You could also consider adding steps for Editing, Graphic Design (if you’ll be creating visual assets for your posts), or any other steps that may be specific to your workflow. Use the color selectors to color-code each status too:

Adding status labels to the editorial calendar.

Then, click the blue circle on the lower right corner of the cell, and drag it down to add the dropdown to each cell. Copy and paste works as well:

Click and drag to add the status selector to more cells.

Start adding some ideas

Now you’re ready to start adding topics to your calendar. Here’s how things might look once you have a handful of post ideas lined up:

Adding ideas to the editorial calendar.

Or you can download this template

You can also use the button below to find a finished version of this editorial calendar template. Click the button, then click File > Make a Copy to create your own version:

Screenshot of our free editorial calendar template.

Leveling up your calendar

Creating your calendar with a spreadsheet is the easiest way to get started. They are simple to set up and can be customized to suit your needs.

However, there are many more options for editorial calendar tools you can choose from. Let’s look at some options you can consider when you’re ready to upgrade from your spreadsheet.

Trello

Trello is a simple Kanban board-style project management tool. They offer a free plan and a couple different editorial calendar templates that can help you get set up in a few clicks. It’s used by publications like Wired and offers a lot of task management capabilities that you aren’t going to get with a spreadsheet. 

Screenshot of using Trello as an editorial calendar.
Source: Trello

Asana

Similar to Trello, Asana is another projectment management tool that can be used to create an editorial calendar. It’s a bit more robust than Trello but with a slightly higher learning curve. Their free plan offers all the capabilities that bloggers should need to manage your calendar and tasks.

Screenshot of using Asana as an editorial calendar.
Source: Asana

Edit Flow

Edit Flow is a long-running WordPress plugin for managing your editorial calendar and workflow directly within WordPress. It’s free, full-featured, and easy to use. As a WordPress.com user, you’ll need to choose a plugin-enabled plan to install it (Business and above):

Screenshot of using Edit Flow as an editorial calendar.
Source: Edit Flow

Editorial Calendar

Here is another WordPress plugin option, appropriately titled Editorial Calendar. This plugin is actively maintained and free to use. If you’re on a plugin-enabled WordPress.com plan, you can install it now here:

CoSchedule

CoSchedule’s Content Calendar offers a beautiful editorial calendar option that’s packed with powerful automation features so you can schedule all your blog publishing and social promotion in one tool. They also have a WordPress plugin available. Their free and lower-tier plans are suitable for bloggers, while their more advanced packages are built for marketing teams. 

Screenshot of using CoSchedule as an editorial calendar.

Establishing your publishing cadence

There is no right answer to how often you should post on your blog. With that said, sticking to a schedule will help you publish regularly, build discipline, and be a more successful blogger.

Determine how often you’ll publish

If there is a recommendation we can offer for determining how often to post, it’s this: you should publish as often as you have something worth sharing on your blog.

That’s not a very specific recommendation though. If you’re looking for some structure to follow, set a goal to publish one article in your first month. Continue adding another post each week, until you’re publishing something at least once a week. 

There’s no science behind this. When you’re trying something new, starting small and working your way up can be a good way to build endurance, without immediately burning out.

Example of a basic blog publishing schedule
Month 1Publish one post by the end of the month.
Month 2Publish one post every two weeks.
Month 3Publish one post every week and a half.
Month 4Publish one post every week.

Determine what days you’ll publish on

From a technical standpoint, there are no specific days that are best for publishing blog posts. 

With that said, publishing on specific days can help you develop discipline and hold yourself accountable. It can also help set expectations for readers, who may wonder when they should expect new content from you, especially if they subscribe to your blog via email.  

Here are some general guidelines to help you choose which days to publish:

  • Web traffic is generally highest early in the week. It starts to decline on Fridays, and is lower on weekends. This is supported by Wise Owl Marketing; the author of this post has been blogging weekly since 2007. 
  • If you have email subscribers to your blog, consider publishing in the morning, so you can start the day at the top of your reader’s inbox.
  • Consider your own schedule and when it’s easiest for you to regularly write and publish.

How to keep your editorial calendar full, all year long

No matter which tool you use to build your calendar, you’ll need content ideas to keep it full. Let’s look at some reliable methods and processes you can follow to make sure you never run out of things to write about. 

Write what you’re most passionate about 

If you’re starting a blog, it’s likely you have something to say. Are there any burning issues you can’t wait to write about? Ideas that you’re desperate to share with the world? Stories that can’t wait to be told? Add them to your calendar and turn them into reality.

Brainstorm a month of blog post ideas in 30 minutes

Whenever I’m asked about blog post ideation, I always recommend this process. It’s one I picked up from a previous employer, and it’s time-tested because it works. Follow these steps:

  1. Spend 10 minutes writing down as many ideas as you can. Don’t think about them too hard. Just get them written down, either in a doc, or on Post It notes.
  2. Spend 10 minutes scoring each idea a 3, 2, or 1. 3’s are your best ideas, 2’s are ideas that need some work, and 1’s are duds. You will have ideas in all three buckets.
  3. Spend 10 minutes sorting through your 3’s and add them to your calendar. These are your very best ideas, that you feel most strongly about.

Now, in just half an hour, you should have enough ideas to write about for at least a month. 

See what people are talking about on Reddit

Find relevant sub-Reddits to the topics you write about and gather ideas. This guide from Better Web Movement has some tips on how to find subreddits that are relevant to your niche. Even better, be an active participant in Reddit communities that are relevant to the things you write about (though you’re probably doing this anyway if you’re passionate about what you cover).

Use an RSS reader to follow other blogs and publications

It’s safe to assume you follow publications and other blogs that are relevant to you on social media. If you’re not using an RSS feed to keep up with your industry or community too though, you might miss out on important stories or articles that could spark your own inspiration. RSS is great because it’s less noisy than social media; you just see the latest articles, without distractions.

Here are some options for RSS and news reader apps you can try:

  • Feedly: A popular option for a basic RSS feed reader.
  • Inoreader: Another great option for a basic RSS feed reader.
  • Flipboard: Magazine-style news reader app.
  • WordPress Reader: Built into your WordPress.com website. It follows all WordPress.com blogs and self-hosted WordPress sites that use Jetpack.
Screenshot of the WordPress Reader.

Use SparkToro to learn about your audience’s interests

SparkToro is an advanced tool used by marketers to conduct audience research. Even if you’re not a marketer, and can only afford their free account, it’s still useful for gathering insight about where your audience spends time online and what they might want to read about.

Screenshot of Sparktoro.

Conduct keyword research to uncover popular search topics

Google processes over eight billion searches per day. At least a few of those clicks should go to your site, right? If you blog about evergreen topics (meaning topics that are always relevant and not time-sensitive), then paying attention to SEO and keyword research is essential. 

Here are a few basic keyword research tools you can use that will help you find the terms people search when they’re looking for information about the topics you cover:

Google Keyword Planner

Google’s free keyword research tool shows how often keywords trigger ads to appear in search results. It can be useful for SEO too, helping you understand how often potential readers search for specific information:

Screenshot of Google's keyword planner.

Ahrefs Free Keyword Generator

Ahrefs is a professional SEO tool that’s built primarily for marketers. Their free Keyword Generator tool is useful for bloggers to gather a quick list of basic ideas:

Screenshot of Ahrefs' free keyword generator tool.

Answer the Public

Answer The Public makes it easy to enter a keyword or two, and then generate a large list of questions people ask related to that topic. It’s a quick way to turn one idea into dozens or hundreds of ideas:

Screenshot from Answer the Public.

Some common questions people ask about editorial calendars

Before we go, let’s go over a few final questions you might still have (or didn’t know to ask). 

Is there a difference between an editorial calendar and a content calendar?

The short answer is no. The longer answer is that people sometimes use these terms in very slightly different contexts. When people say “editorial calendar” they’re often referring to blogging or news publishing, while the term “content calendar” is sometimes meant to include social media, video, and other content formats. Functionally though? They’re the same thing.

Is an editorial calendar the same thing as a content strategy?

An editorial calendar documents what content you will publish. A content strategy is much more complex and encompasses an overarching plan for the who, what, why, and where of all things content on a given website. An editorial calendar might visualize the execution of your strategy, but it’s not a strategy by itself.

How far in advance should you plan your calendar?

This is another area where there are no rules. Having at least three months worth of ideas will ensure you’re never wondering what you should write about. If you can reach a point where you have two to six weeks worth of content written and scheduled in advance, you’re in great shape. 

If you can’t reach that level though, that doesn’t mean you’re doing it wrong. In fact, if your blog is focused on covering news or events as they happen (such as a sports blog or local news site), then planning too far ahead might not be possible or even desirable. This is a good reminder that not all blogging advice applies to everyone equally (not even the advice in this post). So, if something sounds like it’s not applicable to you, don’t worry about it.

Your blog + an editorial calendar = success

You now have the knowledge and tools to plan and organize your blog content like an expert editor. Your stress-free future of blogging success awaits!

Host your blog on the best managed WordPress hosting service available. Start a new blog with WordPress.com today.

How to Create a Personal Website: A Detailed, Step-by-Step Guide

2 January 2025 at 14:52

So, you are considering creating a personal website. Congratulations! In my opinion, that’s one of the smartest decisions you can make.

Building a website for yourself allows you to claim your own little part of the Internet. A space you fully control and that nobody can take away from you. Where you make the rules, determine the look and feel, and express yourself in any way you want.

If that sounds worth pursuing, this post covers everything you need to know. It will talk about the nature and benefits of a personal website, then give you step-by-step instructions on how to build one using WordPress. From picking a website address and basic design to creating pages, adjusting design elements like fonts and colors, and adding extra functionality—it’s all here.

Ready to build your online home today? Get started with WordPress.com here.

What exactly is a personal website?

A personal website is pretty much what it sounds like. It’s a website that belongs to you and allows you to represent who you are and what you do in whatever way you want.

Example of a popular personal website.

You can control the design, content, functionality, and everything else about it.

Why would you want to build something like that for yourself?

Let’s talk about that for a minute.

Benefits of building your own website

Yes, there are other ways you can build a brand or profile online. For example, many people use social media as their main outlet. But, putting all your eggs into that particular basket is also risky.

Example of a social media profile.

There’s always a chance you can get banned or hit with an algorithm change that cuts your reach. Anybody who is old enough to remember when you could build an audience for your Facebook page without spending money on ads can tell you that much.

Or, just imagine, your favorite outlet gets bought by a person or company you don’t like and don’t want to support, so you feel compelled to start over on another platform. Sounds far-fetched, I know, but it could mean all your hard work is gone from one day to the next.

This can happen because you don’t actually own your social media account. The platform you are on does, including all the content you publish. And what’s not yours can be taken away from you.

In contrast to that, creating your own personal website, especially if you do it with a system like WordPress, means building something permanent. You fully own it and can take it with you wherever you want.

Plus, it allows you to do things that you can’t always do on social media, like:

  • Change the design
  • Publish detailed, long-form content
  • Sell goods and services
  • Tell people more about yourself
  • Get inbound traffic from search engines
  • Show off your portfolio
  • Build a central hub to consolidate all your online outlets

And much more…

Types of personal websites

So far, the definition of a personal website has been relatively broad. The reason for that is that it can take many forms depending on your purpose:

  • About Me website – Simply introduce yourself and who you are. It can work as an online resume, business card, or just a fun project.
  • Blog – If you are going the blogging route, you can dive deeply into a topic that interests you, grow a following, build expertise, and maybe even create a business.
  • Newsletter – You can also use a personal website to build a newsletter. This works well when combined with a blog. You can use content to attract an audience and then get them on the newsletter to stay in contact easily.
  • Portfolio – If you are an artist or any type of creative professional, a personal website is where you can show off your portfolio (also works for developers). It gives people an impression of what you can do and also allows them to get in touch with you directly, e.g. via a contact form.

Thankfully, as you will see below, the process of creating a personal website is also very flexible, so it can accommodate whatever you have in mind.

How to make a personal website

I’ve been building websites for more than ten years. If I were in your position and wanted to create a website for myself for the first time, here’s how I would do it.

1. Choose your hosting plan

Hosting basically means renting space on a computer that’s connected to the Internet. That’s where you save your website files so that others can access them with their browser.

With WordPress, you are free to choose your hosting provider since it runs on almost any server setup. WordPress.com is a great option because it’s managed hosting.

That means it takes care of a lot of the more technical parts of running a personal website, namely:

  • Installation – The website is automatically created for you. There’s no need to upload files to a server, create a database, or run an installation.
  • Ease of Use – Everything that has to do with managing the website happens in the same, beginner-friendly interface. You don’t need to switch back and forth between the hosting provider panel and the website; it’s all in the same place.
  • Speed – Performance is a very important topic for user experience. WordPress.com’s servers get the most out of the CMS and store copies of your website across 28+ data centers for super fast delivery.
  • Security Jetpack is included on every WordPress.com site and provides daily security scans, automatic backups, brute-force protection, downtime monitoring, and more. Plus, you get encryption, firewalls, activity monitoring, DDoS protection, and automatic software updates with every plan.

While you can also implement the above manually, by choosing managed hosting, you can fully focus on the important parts of creating a personal website instead: its design, content, and growth.

If that sounds like the right choice for you, all you need to do is pick a WordPress.com plan.

Plan options from WordPress.com.

The Personal and Premium plans are most suitable for simpler websites with fewer pages and for writing a blog. If you want to add extra functionality via plugins or even sell things on your personal site, Business or Commerce might be more your speed.

Each plan comes with unlimited visitors, posts, and pages. If you go for a yearly plan, you also get a free domain for one year. That brings us to the next point.

2. Pick a domain name

The domain name is what your visitors will type into their browser bar to reach your personal website.

Illustration of a URL and all its components.

An important aspect to pay attention to here is the domain ending or top-level domain (TLD). You know, the .com, .org, or .net  part.

For example, if your site is for a particular country and language, it can make sense to use a country-specific domain ending like .de (for Germany) or .co.uk for the United Kingdom. Another example is that as a writer or artist, you could also use a .blog or .portfolio.

The main part of your domain, the name, is also important to think about. It should be easy to remember and convey trust. You can find more tips in this post and the video below.

Domains are also available at WordPress.com.

Domain search bar on WordPress.com.

Simply search for your desired name and hit enter. The tool will tell you if it’s available, the cost, and alternatives.

Choosing from a list of available domain names.

Select your choice and go through the purchasing process. As mentioned, if you host your website at WordPress.com, you get a free domain with an annual plan that can be automatically assigned to your site.

But don’t worry if you can’t make up your mind right now. You can skip this step in the beginning and settle on your domain name at a later time. Your website will live at a temporary address until then.

3. Select a theme

In WordPress, themes are what control the basic design. They are website blueprints that contain colors, fonts, layouts, and other design elements. As a consequence, you can alter your WordPress website’s look and feel—quite dramatically—by simply activating another theme.

Same website, different themes.

Another benefit is that there are themes specialized in building particular types of websites like restaurant sites, travel blogs, photography sites, and more. They come with features, layouts, and design elements specifically for these use cases, making getting started much easier.

In addition, themes are just starting points, not destinations. You can also still customize them completely later on as you’ll soon see.

Applying a theme to your personal website is super easy. You can check what’s available by going to the theme directory or Appearance > Themes in your WordPress.com admin interface.

Theme selection settings in the WordPress.com admin.

Use the controls on top to search for a particular theme or filter by topics and plan. Click on any of them to learn more about it.

Example of a WordPress theme detail page.

You’ll find a description and list of features as well as a preview on the right. Many themes come with style variations that apply different color schemes and fonts. You can try them out directly on this page.

Control settings for style variations within a WordPress theme.

In addition, you can see what your current website would look like with the new theme by clicking the Preview & Customize button. The editor that appears allows you to customize it further, e.g., try out style variations on your site.

Example of theme preview and customization options.

You can save your changes and activate the theme immediately with a click on the button in the lower-left corner. Alternatively, do it from inside the theme menu.

4. Add a homepage and customize it

With the basic website in place, it’s time to learn how to create and customize pages, starting with your homepage.

Set up a new page

Navigate to Pages > Add New Page in your WordPress.com admin interface.

Where to add a new page.

This will open the WordPress Page Editor. When creating a fresh page, you’ll be prompted with a collection of pre-defined layouts you can use to quickly populate it.

Example of the WordPress Page Editor.

These layouts include categories such as About, Services, Contact, Blog, and more. If you find something you like, simply click it to insert the layout into the editor. Alternatively, you can start with a blank page and completely customize it yourself.

Adjusting homepage layout.

Add page elements

The WordPress Page Editor works with blocks, which are singular content elements of different types. For example, a paragraph block is automatically created when you write and press the Enter key. Other examples for blocks are:

  • Headings
  • Lists
  • Buttons
  • Images
  • Tables
  • Columns
  • Grids

You find a full list of available blocks when you click the big blue “+” button in the top left corner.

Full list of available blocks.

They are ordered by category, and you can also search for specific blocks. Clicking on any of them inserts it into the editor at the current position of your cursor.

Example of the Block inserter.

In addition to individual blocks, the Patterns tab offers pre-designed collections of blocks, such as contact forms, galleries, team member sections, newsletter sign-ups, and more. These patterns can help you quickly create layouts without having to build everything from scratch. You insert them the same way.

Example of available patterns.

Another method to add blocks is by clicking the small “+” button that appears when you place your cursor within the editor. It lets you search for a block by name and click it to insert.

Search and insert blocks.

Even easier, type a forward slash (“/”) in any empty line, start typing the block name, and select it using your mouse or keyboard.

Typing forward-slash to use Inserter.

To understand and manage the structure of your page, use the Document Overview tool in the top left corner.

Using the Document Overview tab.

Customize blocks

Clicking on a block brings up an options bar at the top and additional customization settings in the sidebar.

Customizing a block.

The options vary depending on the block type. For instance:

  • A paragraph block lets you adjust font size, color, text alignment, and more.
  • A button block allows you to customize alignment, style, color, dimensions, and shadows.

It takes some trying out to know what you can change for which type of block.

Be aware that these settings apply only to the specific block on the current page. For global design changes—like applying a new font to all headings—you’ll need to use the global Styles settings, covered later.

Once you’ve designed your homepage to your liking, save your changes and publish the page.

Set it as your front page

To make your newly created page your homepage, go to Settings > Reading in the WordPress.com admin dashboard. At the top, you’ll see two drop-down menus that allow you to define which page serves as your homepage and which one displays your blog posts.

Select your new page under Your homepage displays and save the settings.

Browsing homepage display options.

Your homepage is now live! For more information about pages in general, check the documentation.

5. Add more pages and a menu

You can use the same workflow as above to create additional must-have pages for your personal website, such as:

  • About page
  • Contact page
  • Services

After that, you’ll likely want to include them in a navigation menu so that your visitors can reach them easily.

Sitewide changes like this happen in the Site Editor. You can access it via Appearance > Editor. The Site Editor works similarly to the Page Editor but allows you to edit additional parts of your website.

Accessing the Site Editor.

In many cases, your theme already includes a navigation menu. In our example, it appears as part of the header.  One way to edit it is to click Patterns and Header, though you might need to know the name of your header pattern to pick the right one.

Finding and controlling settings for navigation menu, within a theme that includes one in the header.

Alternatively, click the header element in the main editing window and then choose Edit.

Click into header element to edit it.

Either gets you to the editor below.

Editing a header template part.

Here, select the Navigation block (again, Document Overview is your friend).

Finding the Navigation block.

You can then add and subtract menu items and other elements, rename them, and also change some design options in the sidebar.

Editing, adding, and subtracting menu items.

Make adjustments as needed, then save to make them appear on your website.

Example of a finalized menu design.

You can also use this workflow to make other adjustments to your header like adding a search block. It also works for changing your footer.

Note: In some themes you control menus in the Site Customizer instead. You can find more information here.

6. Customize fonts and colors

The Site Editor is also where you can make global design changes for your website. You’ll find these options in the Styles menu in the top right corner of the editor.

Where to find the Styles menu.

Here’s what you can change:

  • Browse styles – Switch between style variations, color palettes, and font combinations your theme ships with.
  • Typography – Make changes to the font family, size, appearance, line height, letter spacing, and more for body text, links, headings, buttons, and other text elements on your site. You can also change font size presets here.
  • Colors – Add colors and gradients to use in the editor, try out existing color palettes, and customize colors for text, backgrounds, links, buttons, headings, and more.
  • Background – Give your website a background image.
  • Shadows – Set up presets for drop shadows to use them in the editor.
  • Layout – Define basic layout settings such as content width, global padding, and block spacing.
  • Blocks – Make design changes to particular block types that apply sitewide.

A cool feature to preview changes in real-time, is the Style Book option in the Styles menu. It provides an overview of how your site’s design elements will look.

Using the Style Book option.

Let’s go over some use cases to help you understand all of this information

Change heading fonts

You change the font of your headings under Typography and then Headings. To make things easier, open the Text tab in the Style book to see all headings at once.

Where and how to change heading fonts.

Pick which heading type to customize, then apply your changes. For example, if you want to prevent your H1 headings from turning into all caps, choose the “H1” option, then set Letter Case to None.

Example of how to adjust letter casing.

You can consult the documentation to learn more about custom fonts.

Set a website background color

To change the background color of your website, go to Colors and then click Background.

Where to find Background Colors.

Pick from the theme palette (you can choose a different one at top) or define a custom hue. That’s it.

Choosing colors from the theme palette.

Modify button shadow

To make changes to a single block, click Blocks.

Select Blocks.

Either scroll to the button block in the list or use the search functionality to find it. Click it.

Where to find Button Block controls.

Find the Border & Shadow option at the bottom. A click on Drop shadow allows you to apply different kinds of shadow effects to all of your buttons.

Example of using border and shadow options.

7. Edit page templates

Templates define the design and layout for certain content types across your website. To access them while in the Site Editor, click on the WordPress logo and then Templates.

Where to find Page Templates.

You’ll see a list of all existing templates on your site such as single posts, pages, and archives. For example, you might want to adjust the layout of your blog posts. For that, click the Single Posts template, to start editing it.

Example of Single Posts template being edited.

Let’s say your goal is to switch the position of the post meta to appear under the title.

Switching the placement of post meta.

For that, simply choose the post-meta block and move it up.

Select the post meta block and move it.

When you now save, the changes apply to all blog posts on your website.

Save to apply all changes.

You can do the same for all other types of content. More information about templates here.

8. Install plugins

Plugins let you change and enhance the functionality of your personal website. If you are on a Business or Commerce plan, you can install them in the Plugins menu.

Where to add new plugins.

Plugins cover a wide range of features that they can contribute to your website, such as:

  • Improve search engine optimization (SEO)
  • Add an Instagram feed
  • Limit login attempts
  • Accept payments with different providers
  • Connect your website to Google Analytics

You can find plugins by using the search functionality at the top or browsing through categories. To learn more about a plugin, click on it. If you like what you see, click the big Install and Activate button.

Where to find plugin installation button.

Once the installation is finished, you can start using the plugin’s functionality right away.

Example of successfully installed theme.

For inspiration on what plugins to install, check the most popular ones. You can also find help on this topic in the documentation.

It’s time to build your online home

Your personal website is your own piece of online real estate. It’s yours to do with as you please and, unlike other online profiles, can’t be taken from you.

Follow the step-by-step instructions above to create your personal site and start building your presence online today.

Why Alt Text Matters: Boost Accessibility and SEO with Every Image

23 December 2024 at 06:00

The internet is a treasure trove of visuals, overflowing with inspiration and information. Images are what draw us in, keep us engaged, and help us learn, and create. But imagine the internet without those visual cues—navigating it would be a real challenge.  

Luckily, for people with visual impairments, those dealing with slower internet connections, and even the robots powering search engines, there’s a simple yet powerful solution: alt text (short for alternative text). This unsung hero of the digital world ensures that everyone can access and benefit from the images we often take for granted.

What is alt text?

Alt text is exactly what it sounds like—a description of an image that appears on the page. Simple, right? But there’s more to it than that. To write truly effective alt text, it’s important to understand why it matters, when an image needs an alt attribute (spoiler alert: not every image does!), and the best tools to help you make sure your images are covered. Let’s dive in and make your alt text work smarter, not harder!

Why alt text is important

Alt text isn’t just a box to check—it’s a powerful attribute that serves two important purposes: making your content inclusive and helping search engines understand your images.

Accessibility

Alt text provides a written description of an image for those who rely on screen readers or encounter issues loading images. It’s there to ensure that no matter the barrier—be it visual impairments or low-bandwidth connections—your content remains accessible and meaningful to all users.

Without proper alt text, you risk not only making your site inaccessible to visitors but also potentially violating accessibility laws like the Americans with Disabilities Act (ADA), which could result in fines or other legal consequences. Similar laws are found throughout the European Union, Canada, the Republic of Korea, and Australia—just to name a few. If you’re trying to make the case for an equitable online experience for your team, this is a great place to start.  

Want to learn more about building an inclusive online community? Here are a few resources to get you started: 

Search engine optimization (SEO)

Search engine crawlers pull several key details from an image, including its file name, captions, title, and alt text. Among these, alt text is the most important for helping search engines understand the image’s subject within the page’s overall content. This information works alongside the other content on the page to enhance search engine algorithms, boost your rankings, and drive more traffic to your site.

When writing alt text, aim for clear, meaningful descriptions that fit naturally with the page’s content. Incorporate keywords thoughtfully, and most definitely resist the urge to overdo it—keyword stuffing not only disrupts the user experience but can also result in search engines penalizing your site as spam. 

Not familiar with keyword stuffing? Keyword stuffing is all about cramming in as many keywords as possible in an attempt to boost rankings on search engine results pages. This doesn’t work and often backfires. Here’s an example:

An example of an image with specified alt text.
Photo by Tuqa Nabi on Unsplash.

Keyword stuffed alt text: 

alt=”Cute kitten playing with a ball of yarn, adorable kitten, fluffy kitten, playful kitten, cute kitten image, kitten for sale, kitten pictures.”

Well-written alt text can both enhances accessibility and support your SEO strategy. Use your commonsense and keep your (human) site visitors top of mind. 

How to know which images need alt text and how to write it

After all that, you may be surprised to learn that not all images require alt text. In fact, it becomes an exhausting experience for some users with screenreaders to endure fluffy alt text applied to images that don’t provide any value. Luckily for us, the W3 has categorized web images and offered some tips about how to treat images within each category.  

Here’s how to write the right kind of alt text depending on what your image is for:  

Informative images: These are the most common images found on sites and include pictures, photos, or illustrations that represent concepts or information. Your alt text should give a short description that conveys the essential meaning of the image. 

Another example of an image with specified alt text to help users understand the content and context of an image.

For example, this image illustrates all of the integrations available with Automattic’s P2, but those integrations are not named in the accompanying content. It’s important here that the alt text provides that information for visitors that may not be able to see or load the image. It should look something like this: 

alt="Logos for available P2 integrations: Crowdsignal, Figma, Twitter, GitHub, YouTube, Vimeo, Google Calendar, and Loom"

Decorative images: If an image is just there to look nice and doesn’t add any important info, use a null alt attribute (alt=””). This tells assistive technologies to skip it.  

Functional images: If an image works as a button or link, the alt text should explain what it does—not what it looks like. 

For example, the alt text for a video icon might say “Watch this video about hibernating bees on Vimeo.”  

Images of text: If the image contains readable text (like a graphic with a quote or a logo), the alt text should include the same words.

Complex images: Charts, graphs, or diagrams need more detailed alt text to describe the data or information they present. You might even link to a longer description.  

Groups of images: If multiple images work together to convey one idea, the alt text for one of the images should cover the whole message. A good example of this would be process shots for a recipe or other how-to tutorial that includes steps. 

Image maps: For images with clickable areas, provide alt text that explains the overall purpose of the image, and include alt text for each clickable section describing where it leads. 

Not sure how to categorize an image? Check out the W3 Images Tutorial for help. 

While there are no official length guidelines, it’s generally recommended to keep alt text under 140 characters. Longer descriptions can become tedious when read by screen readers. Be descriptive, but stay concise—this is not the place for creative flourishes.

Tools to ensure your images include alt text

Chrome Accessbility Report

The Chrome accessibility report is an easy-to-use resource built right into your browser, when you want to quickly test a single page on your site. 

Alt Text Tools

The Alt Text Tools from the NerdPress team is a free, light-weight plugin that generates a CSV file of the images used in your content, along with their alt attributes.

Once the scan is complete (it’s very fast!), you can open the CSV file in the spreadsheet application of your choice. There you can quickly identify images that have missing alt attributes and scan for any that may need some improvement. The file also includes links to edit the posts where the images appear, making it quick and easy to update their alt attributes.

Equalize Digital Accessibility Checker

This freemium WordPress plugin from Equalize Digital goes beyond alt text to ensure your site is accessible to a wide range of visitors. If you and your team are committed to making your content accessible, this is a great resource. 

Equalize Digital also runs a Facebook Group and hosts a monthly virtual meet up for WordPress  developers, designers, and users interested in learning more about creating accessible websites that can be used by people of all abilities.

Alt text may seem like a small detail, but it plays a big role in making the internet more inclusive and user-friendly. By writing thoughtful, descriptive alt text, you’re not just improving accessibility—you’re also optimizing your content for search engines and enhancing the overall user experience. With the right approach and tools, adding alt text can be an easy step toward a more accessible and SEO-friendly site.

Start a blog on WordPress.com

Start optimizing your content with a blog hosted on WordPress.com.

Choose the plan that works best for your business, and let us manage the rest. With any WordPress.com plan, you get all the benefits of fast, secure managed WordPress hosting.

Using WordPress as a Data-Entry Site to Power a Central API

17 December 2024 at 09:00

One of the areas where WordPress shines is content management. This is also corroborated by the fact that it is the world’s leading Content Management System, or CMS, by numbers.

The most popular way of displaying the content hosted by WordPress is through a frontend, like through blog posts and pages. That is wonderful for human visitors but there are other ways of consuming that content –– for example, web APIs. 

In this article, we’ll explore how we can leverage WordPress in order to power a central API for projects like phone apps, browser extensions, or the frontends of other WordPress sites!

Following along

All the steps described in this article were made in WordPress Playground. If you want to see the end result and maybe sometimes skip ahead as we go, download this ZIP file, and perform these steps:

What is a web API?

API stands for Application Programming Interface and it’s a way for software applications to communicate with each other in a standardized fashion. A web API is simply one that is accessed through “the internet” –– for example, by entering a certain URL in your web browser.

There are multiple types of web APIs, and one common way to group them is the protocol they use. In this article, we’ll be implementing two APIs, one based on the REST protocol, and another based on the GraphQL protocol. Other protocols you might have heard of include SOAP, RPC, or gRPC. 

WordPress actually includes a built-in REST API which powers the Gutenberg Block Editor. As of October 2024, the popular WPGraphQL plugin has become a canonical plugin paving the road for an official GraphQL API as well.

What data we’ll be modeling

By the end of this article, we’ll have built a WordPress site that allows users to login in order to add/update/delete data entries which will be queryable both via REST routes and a GraphQL endpoint. 

The data entries will collectively represent a company’s organizational chart –– things like employees, teams, and offices. While a little bland, the concepts can be applied to absolutely anything else.

Optional: Trimming down the frontend

While an optional step, it makes a lot of sense to do this if your site won’t be serving any content via pages but exclusively through APIs.

Once you have a hosted WordPress website, you can start by installing a minimalist WordPress theme like Blank Canvas and deleting every single demo post and page on your site. Continue by using the site editor to include information on the homepage for visitors who find it unintentionally. 

For example, add your business’ name and logo, and tell them that they probably landed there in error. You can also include a button linking to the admin area for maintainers of the content. Something along the lines of:

One way to prevent your site from being found in search engine results is by checking the Discourage search engines from indexing this site in your site’s settings.

If you would rather fully lock down the frontend and not even have the homepage described above, you can add the following code snippet either to a plugin like Code Snippets or to your child theme’s functions.php file:

/**
 * Disables the frontend for non-logged-in users.
 */
add_action(
	'template_redirect',
	static function (): void {
		$authorization_required_code = \WP_Http::UNAUTHORIZED; // 401

		if ( ! is_user_logged_in() ) {
			\status_header( $authorization_required_code );
			die( \get_status_header_desc( $authorization_required_code ) ); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
		}
	}

Custom post types and taxonomies

Now it’s time to focus on the website’s admin area and the data modeling part of this tutorial. The most straightforward way of compartmentalizing your data is by using WordPress’ built-in functionality of custom post types and custom taxonomies.

While there are many ways to do this, for the purposes of this tutorial, we’ll organize our data like this:

  • An employee custom post type
  • A team custom taxonomy
  • An office custom post type

In order to create these custom data types, you can either add custom code to your site, or use a plugin (like in this video). A very popular plugin for creating custom post types and taxonomies using the admin interface is Custom Post Type UI – and that is what we’ll be using in this tutorial.

Here is the JSON configuration for importing the data into your installation:

  • For custom post types 
{"employee":{"name":"employee","label":"Employees","singular_label":"Employee","description":"","public":"false","publicly_queryable":"false","show_ui":"true","show_in_nav_menus":"false","delete_with_user":"false","show_in_rest":"false","rest_base":"","rest_controller_class":"","rest_namespace":"","has_archive":"false","has_archive_string":"","exclude_from_search":"true","capability_type":"post","hierarchical":"false","can_export":"true","rewrite":"false","rewrite_slug":"","rewrite_withfront":"true","query_var":"false","query_var_slug":"","menu_position":"","show_in_menu":"true","show_in_menu_string":"","menu_icon":"dashicons-id","register_meta_box_cb":null,"supports":["title","thumbnail","excerpt","revisions"],"taxonomies":[],"labels":{"menu_name":"Employees","all_items":"All Employees","add_new":"Add new","add_new_item":"Add new Employee","edit_item":"Edit Employee","new_item":"New Employee","view_item":"View Employee","view_items":"View Employees","search_items":"Search Employees","not_found":"No Employees found","not_found_in_trash":"No Employees found in trash","parent":"Parent Employee:","featured_image":"Profile image for this Employee","set_featured_image":"Set profile image for this Employee","remove_featured_image":"Remove profile image for this Employee","use_featured_image":"Use as profile image for this Employee","archives":"Employee archives","insert_into_item":"Insert into Employee","uploaded_to_this_item":"Upload to this Employee","filter_items_list":"Filter Employees list","items_list_navigation":"Employees list navigation","items_list":"Employees list","attributes":"Employees attributes","name_admin_bar":"Employee","item_published":"Employee published","item_published_privately":"Employee published privately.","item_reverted_to_draft":"Employee reverted to draft.","item_trashed":"Employee trashed.","item_scheduled":"Employee scheduled","item_updated":"Employee updated.","parent_item_colon":"Parent Employee:"},"custom_supports":"","enter_title_here":"First and Last Names","show_in_graphql":"1","graphql_single_name":"Employee","graphql_plural_name":"Employees"},"office":{"name":"office","label":"Offices","singular_label":"Office","description":"","public":"false","publicly_queryable":"false","show_ui":"true","show_in_nav_menus":"false","delete_with_user":"false","show_in_rest":"false","rest_base":"","rest_controller_class":"","rest_namespace":"","has_archive":"false","has_archive_string":"","exclude_from_search":"true","capability_type":"post","hierarchical":"false","can_export":"false","rewrite":"false","rewrite_slug":"","rewrite_withfront":"true","query_var":"true","query_var_slug":"","menu_position":"","show_in_menu":"true","show_in_menu_string":"","menu_icon":"dashicons-admin-home","register_meta_box_cb":null,"supports":["title","thumbnail","revisions"],"taxonomies":[],"labels":{"menu_name":"Offices","all_items":"All Offices","add_new":"Add new","add_new_item":"Add new Office","edit_item":"Edit Office","new_item":"New Office","view_item":"View Office","view_items":"View Offices","search_items":"Search Offices","not_found":"No Offices found","not_found_in_trash":"No Offices found in trash","parent":"Parent Office:","featured_image":"Featured image for this Office","set_featured_image":"Set featured image for this Office","remove_featured_image":"Remove featured image for this Office","use_featured_image":"Use as featured image for this Office","archives":"Office archives","insert_into_item":"Insert into Office","uploaded_to_this_item":"Upload to this Office","filter_items_list":"Filter Offices list","items_list_navigation":"Offices list navigation","items_list":"Offices list","attributes":"Offices attributes","name_admin_bar":"Office","item_published":"Office published","item_published_privately":"Office published privately.","item_reverted_to_draft":"Office reverted to draft.","item_trashed":"Office trashed.","item_scheduled":"Office scheduled","item_updated":"Office updated.","parent_item_colon":"Parent Office:"},"custom_supports":"","enter_title_here":"Add Office","show_in_graphql":"1","graphql_single_name":"Office","graphql_plural_name":"Offices"}}
  • For custom taxonomies
{"team":{"name":"team","label":"Teams","singular_label":"Team","description":"","public":"false","publicly_queryable":"false","hierarchical":"false","show_ui":"true","show_in_menu":"true","show_in_nav_menus":"false","query_var":"false","query_var_slug":"","rewrite":"false","rewrite_slug":"","rewrite_withfront":"0","rewrite_hierarchical":"0","show_admin_column":"true","show_in_rest":"false","show_tagcloud":"false","sort":"false","show_in_quick_edit":"","rest_base":"","rest_controller_class":"","rest_namespace":"","labels":{"menu_name":"Teams","all_items":"All Teams","edit_item":"Edit Team","view_item":"View Team","update_item":"Update Team name","add_new_item":"Add new Team","new_item_name":"New Team name","parent_item":"Parent Team","parent_item_colon":"Parent Team:","search_items":"Search Teams","popular_items":"Popular Teams","separate_items_with_commas":"Separate Teams with commas","add_or_remove_items":"Add or remove Teams","choose_from_most_used":"Choose from the most used Teams","not_found":"No Teams found","no_terms":"No Teams","items_list_navigation":"Teams list navigation","items_list":"Teams list","back_to_items":"Back to Teams","name_field_description":"The name is how it appears on your site.","parent_field_description":"Assign a parent term to create a hierarchy. The term Jazz, for example, would be the parent of Bebop and Big Band.","slug_field_description":"The slug is the URL-friendly version of the name. It is usually all lowercase and contains only letters, numbers, and hyphens.","desc_field_description":"The description is not prominent by default; however, some themes may show it."},"meta_box_cb":"","default_term":"","object_types":["employee"],"show_in_graphql":"1","graphql_single_name":"Team","graphql_plural_name":"Teams"}}

At this point, your WordPress admin interface might look something like this:

To Gutenberg or not to Gutenberg

The Gutenberg block editor is functional, adaptable, and easy to use, and you should be using it to edit your traditional WordPress posts and pages. However, when it comes to CPTs without a frontend, there might not be any content to warrant the use of a performant editor like Gutenberg.

If you are positive that all of the information you need is not HTML-based, then it might make sense to disable Gutenberg for these CPTs and default back to the classic post editor that was the standard before WordPress 5.0.

The simplest way to disable Gutenberg support for a CPT is to set the show_in_rest argument to false when registering it (as we’ve done above). 

Alternatively, if you want to keep the built-in REST routes that WordPress provides for every CPT, you can add this code to your child theme:

/**
 * Disables the block editor for certain CPTs.
 */
add_filter(
    'use_block_editor_for_post_type',
    static function( bool $use_block_editor, string $post_type ): bool {
	if ( in_array( $post_type, array( 'employee', 'office' ), true ) ) {
		$use_block_editor = false;
       }
  
	return $use_block_editor;
    },
    10,
    2
);

Custom Fields

Now that we have our basic data types in place, we need to start populating them with entries. Before we do that, we need to ensure that we can record all the necessary data on each entry, and for that we will need to build custom fields.

The easiest way to add custom fields to your custom post types is to register them with custom-fields support. When you then edit a post, it will include a metabox like this:

While this type of “key-value” interface can be enough, you might want to build a more user-friendly interface with fields like checkboxes, dropdowns, media selectors, and so on.

A popular way to add those types of custom fields is the Meta Box plugin, which, as mentioned above, is what we’ll be using in this tutorial. Using their online custom fields generator, we got the PHP code needed to register the fields we wanted and then added them to Code Snippets.

Using a fake data generator, we populated the custom post types with a bit of seed data:

Other UI customizations

While we won’t explore any further UI customization options in this tutorial, we wanted to note that it’s possible to use various WordPress filters to tweak things like:

  • The default Add title placeholder on new posts (e.g., to First and Last Names)
  • The columns hidden or visible by default on the CPT list table view
  • Various other labels and messages throughout the admin interface

Access control

Before we start looking into making the data available via API, it’s time to think about who should have access to it. 

The custom post types and taxonomies mentioned above were registered in such a way that any logged-in user with the ability to edit regular WordPress blog posts will also have the ability to edit these. However, it’s possible to make that much more granular.

You can create custom user roles with custom capabilities in order to ensure that the UI is as clean-as-possible in order to promote focused-work for the users doing the data maintenance. This is particularly important if you anticipate a very high number of entries, especially on an ongoing basis. 

While it is possible to control this entirely with custom code, a way to maintain a simpler overview of access management is provided by Access Policies implemented by the Advanced Access Manager plugin

For example, you can create a separate access policy for each CPT you create. Then you may assign the policy either to a role or to individual users in order to maintain full control over who may add new Employee entries or even just edit existing ones. Deleting entries can be a capability reserved only for administrators.

Here is an example of how a policy named Employees CPT – Full Control and assigned only to Administrator users can look like:

{
    "Version": "1.0.0",
    "Dependency": {
        "wordpress": ">=6.6.2",
        "advanced-access-manager": ">=6.9.42"
    },
    "Statement": [
        {
            "Effect": "allow",
            "Resource": [
                "Capability:edit_employees",
                "Capability:edit_others_employees",
                "Capability:edit_private_employees",
                "Capability:edit_published_employees",
                "Capability:read_private_employees",
                "Capability:publish_employees",
                "Capability:delete_employees",
                "Capability:delete_private_employees",
                "Capability:delete_published_employees",
                "Capability:delete_others_employees"
            ]
        }
    ]
}

Here is an example of what the admin interface can look like for a dummy operator user that has the Data Entry Operator user roles (cloned from the Subscriber role) with two AAM Access Policies attached – one for each custom CPT:

Notice how the lack of most menu items makes it easier to focus solely on the data-entry aspect. The policies can be made more granular, for example, to also restrict who may delete an entry or create new ones.

Custom REST routes

While WordPress will automatically create REST routes for every CPT as long as it is registered with the show_in_rest argument set to true, you can also create your own custom rest routes that are better suited for serving the CPT content in a way that makes more sense to your use-case.

The easiest and most standard way to achieve this is by extending one of the REST API controller classes. For maximum control over the output, you may want to extend the base WP_REST_Controller class itself.

You can choose to have your routes publicly accessible if the permission_callback argument is set to the __return_true function or you can choose to lock down calls using any permission scheme you want. 

The recommended way of locking down access is behind a capability check, i.e. a call to current_user_can. You can use the AAM Access Policies mentioned above to grant or withdraw permission from individual roles or users, and you can use WordPress’ application passwords to authenticate API requests.

Hint: even if you decide that GET (read) requests should/can be publicly available, we still recommend that any POST // PUT // DELETE (create, update, delete) requests always be guarded by a current_user_can check.

Here is a REST controller that we added to Code Snippets in order to be able to list the employees on the site and fetch them by ID:

add_action(
	'rest_api_init',
	function() {
		if ( ! class_exists( 'WP_REST_Controller' ) ) { 
			return;
		}
	
		class Employees_Controller extends WP_REST_Controller {
			protected $namespace = 'custom/v1';
			protected $rest_base = 'employees';

			public function register_routes(): void {
				register_rest_route(
					$this->namespace,
					"/$this->rest_base",
					array(
						array(
							'methods'             => WP_REST_Server::READABLE,
							'permission_callback' => array( $this, 'get_items_permissions_check' ),
							'callback'            => array( $this, 'get_items' ),
							'args'                => $this->get_collection_params(),
						),
						'schema' => array( $this, 'get_public_item_schema' ),
					)
				);
				
				register_rest_route(
					$this->namespace,
					"/$this->rest_base/(?P<employee_id>[\d]+)",
					array(
						'args'        => array(
							'employee_id' => array(
								'description' => __( 'Unique identifier for the employee.', 'psapi-features' ),
								'type'        => 'integer',
							),
						),
						array(
							'methods'             => WP_REST_Server::READABLE,
							'permission_callback' => array( $this, 'get_item_permissions_check' ),
							'callback'            => array( $this, 'get_item' ),
						),
						'schema'      => array( $this, 'get_public_item_schema' ),
					)
				);
			}

			public function get_items_permissions_check( $request ): WP_Error|bool {
				return true; // This information is public. You probably want to do a `current_user_can` check.
			}
			
			public function get_item_permissions_check( $request ): WP_Error|bool {
				return $this->get_items_permissions_check( $request ); // Same as for listing all. Can be different.
			}

			public function get_items( $request ): WP_Error|WP_REST_Response {
				$response = array();

				$employees = new WP_Query( $this->prepare_posts_query_args( $request ) );
				foreach ( $employees->posts as $employee ) {
					$data       = $this->prepare_item_for_response( $employee, $request );
					$response[] = $this->prepare_response_for_collection( $data );
				}

				$response = rest_ensure_response( $response );

				$response->header( 'X-WP-Total', $employees->found_posts );
				$response->header( 'X-WP-TotalPages', $employees->max_num_pages );
				foreach ( $this->prepare_link_headers( $request, $employees->max_num_pages ) as $key => $value ) {
					$response->link_header( $key, $value );
				}

				return $response;
			}
			
			public function get_item( $request ): WP_Error|WP_REST_Response {
				$employee = get_post( $request['employee_id'] );
				if ( ! $employee ) {
					return new WP_Error( 'rest_not_found', __( 'No employee found for the given identifier.', 'wpcom-demo' ), array( 'status' => 404 ) );
				}
				
				$response = $this->prepare_item_for_response( $employee, $request );
				return rest_ensure_response( $response );
			}

			public function prepare_item_for_response( $item, $request ): WP_Error|WP_REST_Response {
				$fields = $this->get_fields_for_response( $request );
				$data   = array();

				if ( rest_is_field_included( 'id', $fields ) ) {
					$data['id'] = $item->ID;
				}
				if ( rest_is_field_included( 'name', $fields ) ) {
					$data['name'] = $item->post_title;
				}
				if ( rest_is_field_included( 'picture', $fields ) ) {
					$picture = get_the_post_thumbnail_url( $item, 'full' );
					$data['picture'] = empty( $picture ) ? null : $picture;
				}

				$data     = rest_sanitize_value_from_schema( $data, $this->get_item_schema() );
				$response = rest_ensure_response( $data );
				if ( rest_is_field_included( '_links', $fields ) ) {
					$response->add_links( $this->prepare_links( $item, $request ) );
				}

				return $response;
			}

			public function get_item_schema(): array {
				if ( $this->schema ) {
					return $this->add_additional_fields_schema( $this->schema );
				}

				$this->schema = array(
					'$schema'    => 'http://json-schema.org/draft-04/schema#',
					'title'      => 'employee',
					'type'       => 'object',
					'properties' => array(
						'id'           => array(
							'description' => __( 'Unique identifier for the employee.', 'wpcom-demo' ),
							'type'        => 'integer',
							'readonly'    => true,
						),
						'name'         => array(
							'description' => __( 'The name of the employee.', 'wpcom-demo' ),
							'type'        => 'string',
							'required'    => true,
						),
						'picture'      => array(
							'description' => __( 'URL to the employee profile picture.', 'wpcom-demo' ),
							'type'        => array( 'string', 'null' ),
							'format'      => 'uri',
							'required'    => true,
						),
					)
				);

				return $this->add_additional_fields_schema( $this->schema );
			}
			
			protected function prepare_posts_query_args( WP_REST_Request $request ): array {
				return array(
					'post_type'      => 'employee',
					'post_status'    => 'publish',
					'order'          => $request['order'],
					'orderby'        => $request['orderby'],
					'posts_per_page' => $request['per_page'],
					'paged'          => $request['page'],
					's'              => $request['search'] ?? '',
					'tax_query'      => $this->prepare_posts_taxonomy_query_args( $request ), // phpcs:ignore WordPress.DB.SlowDBQuery
				);
			}
			protected function prepare_posts_taxonomy_query_args( WP_REST_Request $request ): array {
				$tax_query = array();

				if ( $request['team'] ?? false ) {
					$tax_query[] = array(
						'taxonomy' => 'team',
						'field'    => 'slug',
						'terms'    => array( $request['team'] ),
					);
				}

				return $tax_query;
			}
			
			protected function prepare_link_headers( WP_REST_Request $request, int $max_pages ): array {
				$link_headers = array();

				$base = add_query_arg(
					urlencode_deep( $request->get_query_params() ),
					rest_url( $request->get_route() )
				);

				$next_page = $request['page'] < $max_pages ? ( $request['page'] + 1 ) : null;
				if ( $next_page ) {
					$link_headers['next'] = add_query_arg( 'page', $next_page, $base );
				}

				$prev_page = $request['page'] > 1 ? ( $request['page'] - 1 ) : null;
				if ( $prev_page ) {
					$link_headers['prev'] = add_query_arg( 'page', $prev_page, $base );
				}

				return $link_headers;
			}
			
			protected function prepare_links( WP_Post $employee, WP_REST_Request $request ): array {
				$links = array();
				
				if ( ! isset( $request['employee_id'] ) ) {
					$links['self'] = array(
						array(
							'href' => rest_url( "$this->namespace/$this->rest_base/{$employee->ID}" ),
						),
					);
				} else {
					$links['collection'] = array(
						array(
							'href' => rest_url( "$this->namespace/$this->rest_base" ),
						),
					);
				}
				
				return $links;
			}
		}
		
		( new Employees_Controller() )->register_routes();
	}
);

Testing your REST routes

Your custom REST routes will be available under <your-domain>/wp-json/<route_namespace>/<route>. For example, the path for retrieving the list of employees could look like this:

<your-domain>/wp-json/custom/v1/employees?team=marketing

Hint: the team query added there will be parsed by WordPress and made available in the controller; you can then choose to either ignore it or filter the results by it – anything you want!

The easiest way to test your endpoints, especially if they will require an application password to access, is to use a tool like Postman which lets you test APIs in a very user-friendly manner. Publicly available GET requests can also be tested by simply visiting the URL endpoint in your browser!

Querying via GraphQL

Now that we are able to fetch the data via REST routes, let’s explore how we might be able to fetch it using GraphQL as well.

If you’re unfamiliar with GraphQL, what you need to know is that it’s actually a querying language just like SQL but for APIs. You can read more about it on the official website over at https://graphql.org/

The simplest way to add GraphQL support to our site is by installing the newly-canonical plugin WPGraphQL. It also has a documentation page where you can learn more about what it provides out-of-the-box, and also examples of how to handle much more complex scenarios.  

If you’ve been paying attention to the JSON configuration of the custom post types shared above, you might’ve already noticed a key named show_in_graphql set to 1 (true/active). That is all we need in order to allow the custom post types we added to be queries using GraphQL.

Here is an example of a GraphQL query that can be used to list Employees which you can test in the built-in GraphQL IDE bundled with the plugin:

query GetEmployeesEdges {
  employees {
    edges {
      node {
        id
        name: title
        image: featuredImage {
          node {
            sourceUrl
          }
        }
      }
    }
  }
}

Building your own

If this sounds like something you want to build for your own business, you can work on it on your own computer using Studio by WordPress.com. You can even share your work with colleagues (for free!) using a demo site, and when you’re ready, any WordPress.com Business plan or higher will be able to host and manage your site.

❌
❌