> ## Documentation Index
> Fetch the complete documentation index at: https://devs.surferseo.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Use the guidelines panel

> Understand what the Surfer panel inside WordPress, Google Docs, Contentful, or your own CMS shows and does, and what stays in the Surfer app.

Write in your own tool with Surfer's guidelines beside the text. The panel shows one Content Editor, the document Surfer builds around your target keywords, holding the guidelines and the Content Score. The guidelines are the terms, structure, and information Surfer recommends for the text. The Content Score, from 0 to 100, grades the text against them.

You meet the panel in the Google Docs side panel, in a Contentful entry's sidebar, in the WordPress post editor, and in a custom embed in your CMS. Each integration's page covers installing it, where the panel appears in that tool, and which plans include it. Start from [Set up WordPress](/integrations/wordpress/setup) or the [integrations overview](/integrations/overview).

## What the panel shows

A linked document gets two tabs, **Guidelines** and **Research & Outline**, under the Content Editor's keyword. A document without a Content Editor gets a dashboard to pick or create one.

WordPress shows the panel only on a post attached to a Content Editor. The plugin's own buttons attach, export, and unlink the post. See [Write in WordPress](/integrations/wordpress/write#write-with-the-guidelines).

### Guidelines tab

* **Content Score**: Surfer's score from 0 to 100 for how well the text is optimized for search and for visibility in AI search.
* **SEO**, subtitled **Entities to cover**: the terms drawn from the pages that rank for the keyword, and how your text covers them.
* **AI Search**, subtitled **Info to cover**: the information that AI answers cite for the topic, shown when the Content Editor has it.
* A structure strip stays pinned at the bottom. It shows your words, headings, paragraphs, images, and characters against what the competitors use.

### Research & Outline tab

Three sub-tabs:

* **Competitors** shows the outline. In the panel it is read-only. **Copy outline to clipboard** copies it for pasting into your tool. **Generate Outline** appears when the Content Editor has no outline yet.
* **Questions** shows the questions the text should answer. A button copies them.
* **Notes** shows the Content Editor's notes.

### The menu

The dots menu in the header holds two groups:

* **Export → Export guidelines as .txt**
* **Export → Export content as HTML**
* **More options → Learn how to use Content Editor**
* **More options → Get extension**, shown only while no Surfer extension is installed.

On a white-label domain the **More options** group is absent.

Icons sit next to the menu:

* The check circle (**Mark as done**) marks the Content Editor as done. It is always there.
* The broken link (**Disconnect Content Editor from this page**) unlinks the Content Editor. It appears when you are signed in with rights to customize the Content Editor.
* The gear (**Customize**) opens the Content Editor's settings in the app in a new tab. It appears when you are signed in with rights to customize the Content Editor.

In a narrow panel the broken link and the gear are entries in the dots menu instead; see [Narrow panels](#narrow-panels).

### Narrow panels

In a narrow sidebar the panel shortens its labels. It also moves two controls.

The WordPress sidebar is narrow in every editor. Google Docs' side panel is narrow when the browser window is under 1440 px wide. Some CMS sidebars are narrow by design.

* The second tab reads **Research**.
* Its **Competitors**, **Questions**, and **Notes** tabs show as icons.
* **Copy outline to clipboard** reads **Copy outline**.
* **Customize** and **Disconnect from this page** sit at the top of the dots menu instead of appearing as icons.
* **More options → Get extension** is not offered.
* The **Content Score** heading above the score is hidden; the score and the lists stay.

### The dashboard

When the document has no Content Editor yet and you are signed in, the panel lists your Content Editors instead. Its controls:

* The organization and workspace switcher. An organization is the Surfer account that holds the subscription. A workspace is a brand or site managed inside it.
* Folders.
* Sort and filter.
* **Search by keyword**.

Linking a Content Editor to a document replaces any document it was linked to before. A Content Editor whose analysis is still running cannot be picked until it finishes. Select a Content Editor to link it to the document, or create a new one. The create form is the same as in the app.

## Where your text lives

Your text stays in the tool you write in. The tool sends the panel the document's HTML. The panel scores it and returns the guidelines. Nothing is written to the Content Editor in Surfer.

WordPress is the exception, and only on request:

* **Optimize with Surfer** copies the post into a Content Editor.
* **Export** sends the post to the Content Editor again later. See [Write in WordPress](/integrations/wordpress/write).
* The app's export writes a Content Editor into a post. See [Export from Surfer](/integrations/wordpress/export).

The score follows your typing with a delay that depends on the tool:

| Tool | Delay after typing |
| - | - |
| Google Docs | About one second, and a little longer after an image finishes loading. |
| WordPress block editor and Classic Editor | Under a second. |
| WordPress Elementor | Four seconds. |
| Contentful | As you type. The app sends each change as it happens. |
| Custom embed | When your CMS sends the text. See the [embed quickstart](/integrations/embed/quickstart). |

## What stays in the Surfer app

The panel scores and guides. Editing the Content Editor's text, writing with AI, and sharing stay in the app. Creating a Content Editor and generating an outline work from the panel.

Not in the panel:

* The text of the Content Editor. The panel has no editing surface; it shows the two tabs and the dashboard.
* Writing an article with AI. That lives in the Content Editor's own editor in the app.
* **Insert outline**. The panel offers **Copy outline to clipboard** instead.
* **Highlight terms** and **Auto suggestions**. Both act on Surfer's own editor.
* **Share**. Share links are managed from the Content Editor in the app.
* The Content Editor's settings. The **Customize** gear opens them in the app in a new tab.

### The linked Content Editor in the app

In the app, a Content Editor linked to Google Docs or Contentful has its text covered by **Editing happens in** followed by the tool's name. The overlay says that changes are made in that tool and that you disconnect first to edit here. It offers:

* **Open in Google Docs**, which opens the document. Contentful entries have no such button.
* **Get the Surfer extension**, for Google Docs when the extension is not installed.
* **Disconnect**.

To edit in Surfer instead:

1. Select **Disconnect**.
2. Read the confirmation. Its title names the tool. It says that the editor reverts to the content it had before it was linked. Anything edited in the tool stays there and is not brought over.
3. Select **Disconnect**.

The page reloads with the Content Editor editable in Surfer. In the tool, the document no longer has a Content Editor. Its panel offers the dashboard again.

The Content Editor shows the text written in Surfer before the link. Linking or disconnecting a Google Doc, a Contentful entry, or a custom embed copies no text in either direction.

The Content Score in the app's list of Content Editors reflects the text Surfer scored most recently. After you link a document, the list can keep showing that document's score. Opening the Content Editor in Surfer recalculates the score from its own text.

Content Editors linked to WordPress posts or custom embeds remain editable in the app. WordPress provides **Disconnect** in its sidebar. See [Unlink a post](/integrations/wordpress/write#unlink-a-post).

## Credits

Creating a Content Editor spends one Content Editor credit. Linking, overwriting, or disconnecting one spends none. A Content Editor credit is a credit from your plan's balance.

| Action | Credits |
| - | - |
| Create a new Content Editor | One |
| Link an existing Content Editor to the document | None |
| Overwrite an existing Content Editor with a WordPress post | None |
| Disconnect | None |

## Sign in and cookies

The panel signs in with your Surfer session. How it reaches that session depends on whether the extension is present.

In Google Docs, the Chrome extension hands the session to the panel. You do not need to change cookie settings.

In Contentful, WordPress, and custom embeds the browser has to let Surfer use its cookies inside the other tool's page. Allow third-party cookies or grant storage access when the panel asks.

Google Docs needs the Surfer for Google Docs extension. The extension puts the panel on the page. Contentful, WordPress, and custom embeds show the panel without one.

What the panel shows depends on the document and on whether you are signed in:

| Situation | What you see |
| - | - |
| The document already has a Content Editor | The panel shows the guidelines, whether or not you are signed in. |
| Signed in, no Content Editor yet | The panel shows the dashboard, where you pick or create a Content Editor. |
| Signed out, no Content Editor yet | The panel shows the **Connect Content Editor to this document** screen. |

Linking, creating, disconnecting, and customizing need a signed-in Surfer account with access to the Content Editor.

### The connect screen

`Connect Content Editor to this document` opens with `Follow the steps below to connect existing, or create new Content Editor` and one of three sets of controls. All three end with **Completed?** and **Refresh page**, which reloads the panel.

| What the screen shows | Why |
| - | - |
| **Log in to Surfer** | You are signed out, and the browser lets Surfer use its cookies or Surfer for Google Docs 1.2.1 or newer is installed. |
| `Update your Chrome extension` with **Go to Extensions** | Surfer for Google Docs is older than 1.2.1, and the browser allows neither third-party cookies nor storage access. |
| `Grant access to third-party cookies for this integration` with **Grant access**, then `or`, then `Install Surfer Content Editor extension (Chrome browser only)` with **Add to Chrome** | The browser blocks third-party cookies, and Surfer for Google Docs is not installed. A browser without the Storage Access API shows only the extension option. |

For **Log in to Surfer**:

1. Select **Log in to Surfer**.
2. Sign in on the Surfer tab that opens.
3. Select **Refresh page** in the panel.

For `Update your Chrome extension`:

1. Select **Go to Extensions**. The Chrome Web Store listing opens.
2. Update or reinstall the extension. The steps are under [Troubleshooting on the setup page](/integrations/google-docs/setup#troubleshooting).
3. Select **Refresh page** in the panel.

For **Grant access** and **Add to Chrome**, either grant access:

1. Select **Grant access**.
2. Allow it in the browser's prompt. With a Surfer session in the browser, the panel signs in by itself.
3. If the connect screen stays, select **Refresh page**.
4. If the screen now shows **Log in to Surfer**, follow its steps above.

Or install the extension:

1. Select **Add to Chrome**.
2. Install the extension from the listing that opens. The steps are under [Install the extension](/integrations/google-docs/setup#install-the-extension).
3. Select **Refresh page** in the panel.
4. If the screen now shows **Log in to Surfer**, follow its steps above.

## Plans

The panel works with any Surfer account that includes Content Editors. In Google Docs and Contentful, a plan without that integration gets a message in place of the dashboard on an unlinked document:

* Google Docs: `Google Docs integration is not available on your plan`
* Contentful: `Contentful integration is not available on your plan`

The message refers to the organization selected in the dashboard, and that organization's owner also sees an upgrade button. A document that already has a Content Editor still shows its guidelines. WordPress and custom embeds get no such message from the panel. Each integration's own page states which plans include it.

When the subscription has lapsed, `Content Editor is not available` and `Please reactivate your subscription to restore access.` replace the panel. On a linked document, that is the subscription of the organization that owns the Content Editor. On an unlinked document, it is the subscription of the organization selected in the dashboard.

## Troubleshooting

These fixes cover cookies, document links, and delays in reading your text. For Google Docs extension problems, see the [setup page](/integrations/google-docs/setup#troubleshooting).

> **The panel asks me to log in although I am signed in to Surfer**
>
> In Contentful and custom embeds without an extension, the panel cannot read your Surfer session when the browser blocks third-party cookies on that page. Either grant access from the connect screen, following [The connect screen](#the-connect-screen), or allow the cookies in the browser:
>
> 1. Allow third-party cookies for the page you are writing in, in the browser's settings.
> 2. Select **Refresh page** in the panel.
>
> A private or Incognito window that blocks third-party cookies shows the same screen. Open the document in a normal window. In Google Docs, the extension supplies the session. If the panel still asks there, see [Troubleshooting on the setup page](/integrations/google-docs/setup#troubleshooting).

> **The panel says the document has no Content Editor**
>
> A signed-in panel shows the dashboard. Pick the Content Editor from the list, or create one for one Content Editor credit.
>
> The link belongs to the document, so a copy of a Google Doc starts without one. If a colleague linked the original document, open that document. If it was linked before and now shows the dashboard, someone disconnected it or linked its Content Editor to another document. Ask before linking it again.

> **The score does not change while I type**
>
> The panel re-reads the document on a timer, so the score trails your typing by the delay under [Where your text lives](#where-your-text-lives). The steps below are for Contentful and custom embeds. In Google Docs, follow [Troubleshooting on the setup page](/integrations/google-docs/setup#troubleshooting) instead. In WordPress, follow [The Content Score does not update as you type](/integrations/wordpress/troubleshooting#the-content-score-does-not-update-as-you-type).
>
> 1. Wait for that delay after you stop typing.
> 2. Check that the text is in the part of the page the panel reads.
> 3. If the score still does not follow, reload the page. The panel reads the document again.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.