1. Include H2s to arrange ideas.

<script src="https://gist.github.com/zealot128/3f75046ea7efc4489f03e4b71244d0f8.js"></script>

1import {PortableTextComponents} from'@portabletext/react'
2import SyntaxHighlighter from'react-syntax-highlighter';
3import style from'react-syntax-highlighter/dist/cjs/styles/hljs/atom-one-dark';
4
5const Component= () => {
6  const codeString ='(num) => num + 1';
7  return (
8    <SyntaxHighlighter language="javascript" style={style}> 
9        {codeString}
10    </SyntaxHighlighter>
11   );
12};

Hello I'm h1

Im h2

I'm h3

When you begin typing your blog content, it’s important that you divide paragraphs into sections that make it easier for the reader to find what they need.

If you’re just starting out, then focus on the overarching H2s you want to talk about, and you’ll be able to branch off into subheaders and more naturally as you continue.

2. Center your images.

This is a simple practice that can help your content look more professional with little effort. Centering your images keeps the reader’s attention drawn to the subject — not searching for elsewhere.

Centering also looks better when translating from PC to mobile devices. As formatting transitions to small screens or windows, a centered image will remain the focal point.

3. Add alt text.

So those images you centered earlier, make sure you have descriptive alt text for them, too.

Image alt text allows search engines, like Google, to crawl and rank your blog post better than pages lacking the element. It also leads readers to your blog post if the keywords included are what they searched for in the first place.

Besides SERP features, image alt text is beneficial to readers by providing more accessibility. Image alt text allows people to better visualize images when they can’t see them, and with assistive technology, can be auditorially read aloud for people to enjoy.

4. Keep your sentences short and concise.

When you begin working on the body of your blog post, make sure readers can clearly understand what you’re trying to accomplish.

You shouldn’t feel pressure to elongate your post with unnecessary details, and chances are that if you keep it concise, readers will derive more value from your work.

5. Use media with a purpose.

Break up the monotony of your blog post with some multimedia content where seen fit.

Your reader will enjoy visiting a blog page with images, videos, polls, audio or slideshows as opposed to a page of black and white text.

It also makes it more interactive and improves your on-page search engine optimization (SEO).

Now, do you want some real examples of blog posts? See what your first blog post can look like based on the topic you choose and the audience you're targeting.

Test Quotes

This is second line Now, do you want some real examples of blog posts? See what your first blog post can look like based on the topic you choose and the audience you're targeting.

`

Hello there

`

# hell

1const components :PortableTextComponents = { 
2  types:  { image: ImageComponent },
3  block:  {
4    normal: ({ children }: any) => { 
5      if (children[0]?.props?.markKey?.includes('code')) { 
6        console.log(children)
7        return (
8          <>
9            <div className="bg-gray-500 p-2 rounded-md">
10              <div className="dot"></div>
11             <div className="dot"></div>
12             <div className="dot"></div>
13            </div>
14            <SyntaxHighlighter language="javascript" style={style}>
15              {children[0].props.text}
16            </SyntaxHighlighter>
17          </>
18        )
19      }
20  return <p>{children}</p>
21}

effwf