# Any way to indicate anchors in the visual editor?

**URL:** <https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243>\
**Category:** Beginners\
**Created:** [February 13, 2022, 1:28pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243 "2022-02-13T13:28:11Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 13, 2022, 1:28pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/1 "2022-02-13T13:28:12Z")

</div>

Is there a way to show anchors in the visual editor (e.g., with a glyph)? Then I could look at the existing anchors to determine where there might be missing anchors. Otherwise, I have to look at the code to check everywhere for possible missing anchors.

Thanks,  
Don C.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 13, 2022, 8:26pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/2 "2022-02-13T20:26:16Z")

</div>

Hey @dculp,  
Not quite sure what you mean. Can you give a screenshot example?  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 13, 2022, 9:47pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/3 "2022-02-13T21:47:55Z")

</div>

RobM –

See the yellow anchor glyphs in front of “Cross references” and “Nomenclature”, corresponding to the  
 code. (This is from Dreamweaver CS6.) Then if any topic doesn’t have an anchor, it is easy to spot in the visual editor, rather than having to comb through the code.

 ![Dreamweaver_anchor_glyphs_1a](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/14244dc9ee4ae798814bc10b52cffd469c04a4e7.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 14, 2022, 10:42am UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/4 "2022-02-14T10:42:44Z")

</div>

Hi @dculp,  
There isn’t anything like that built into Pinegrow, but you can use the search box at the top of the Tree panel to find all of the links. Just enter `$a` into the box. You could then step through all of the search results to see if any need an anchor.

Alternatively, you could write some temporary styling that would add a before element to all of the links to show the glyph.

Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 17, 2022, 3:38am UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/5 "2022-02-17T03:38:44Z")

</div>

> [@RobM](#):
>
> Alternatively, you could write some temporary styling that would add a before element to all of the links to show the glyph.

Can you explain (perhaps show some short code).

To clarify – I only want to show existing anchors so that I can do a quick visual scan to find missing anchors that I know should be there (for example, topic headings that should correspond to a table of contents).

I wouldn’t want to manually add temporary styling since this would defeat the benefit of doing an easy quick scan. Also, this should be available on existing pages, not just new pages, so that these pages could also be checked, if desired. Therefore, I assume that this would have to be part of a style sheet. Perhaps there could be some kind of conditional statement that could be added to a page to enable/disable the temporary styling (default to disable).

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 17, 2022, 11:22am UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/6 "2022-02-17T11:22:55Z")

</div>

Hey @dculp,  
Hmmm, not sure there is an easy solution. The styling itself is minimal

```auto
a::before {
    content: "\2022";
    color: red;
}

```

Or something similar.  
The tough part is to make it conditional AND applied to multiple pages. You can use a script for the conditional part, but then that script would have to be added to every page you wanted to check.  
You could do it with a plugin that extends Pinegrow, but I can’t figure out another way.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 17, 2022, 12:12pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/7 "2022-02-17T12:12:31Z")

</div>

Hi Again @dculp,  
I’m an idiot!! I was thinking about ways to modify the page and forgot about other tools built into Pinegrow! If you go into the search box at the top of the Tree panel and type `$a` it will select all of the anchors on the page and highlight them both on page and in the Tree. That should make scanning fairly easy.  
Cheers,  
Bob

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 17, 2022, 1:14pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/8 "2022-02-17T13:14:39Z")

</div>

RobM –

These anchors are highlighted in the tree panel but I don’t see any difference in the page editor. For instance, look at “Overview” and “Interpretation”, both of which have anchors. Maybe there’s a switch or option?

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/b/b1ef6f25add3b81a0bd78313a5b52eb13577845b.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 17, 2022, 1:47pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/9 "2022-02-17T13:47:20Z")

</div>

Sorry - click on the square/circle icon just to the right of the search box.

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 17, 2022, 2:17pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/10 "2022-02-17T14:17:19Z")

</div>

The anchors are highlighted in the tree panel but still not seeing any change in the page editor –

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/6/600e4383e76618ac162b9d867ff7138bf390b6b2.png)

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 17, 2022, 3:20pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/11 "2022-02-17T15:20:41Z")

</div>

Do you have the visual helpers turned off? If not, then I would have to see a snippet of your actual HTML code to troubleshoot.

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 17, 2022, 5:19pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/12 "2022-02-17T17:19:20Z")

</div>

They show up after I turned on “Selected element border & controls”.

In the tree panel search, is there a way to exclude href links? For example –

```auto
<a class="_dict_link" title="" href="loss1_dict.html">loss</a>

```

This isn’t a major problem but it would be helpful for my particular purpose.

---

<div class="post-metadata">

**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\
**Post date:** [February 17, 2022, 7:06pm UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/13 "2022-02-17T19:06:42Z")

</div>

Hmmm… I don’t think so. The search is powered by jQuery, so you might be able to find what you need with Google. Basically you need elements with a “#” in the href, correct?

---

<div class="post-metadata">

**Author:** ![dculp](https://avatars.discourse-cdn.com/v4/letter/d/e47c2d/32.png) [@dculp](https://forum.pinegrow.com/u/dculp)\
**Post date:** [February 18, 2022, 12:04am UTC](https://forum.pinegrow.com/t/any-way-to-indicate-anchors-in-the-visual-editor/6243/14 "2022-02-18T00:04:11Z")

</div>

Yes, only highlighting either of the following example types. The second is more critical in order to check for missing topic anchors.

```auto
<a href="#overview">Overview</a>
<!-- typically in a table of contents -->

```

or

```auto
<a id="overview"></a>
<!-- 
typically from a topic heading as -
<h1><a id="overview"></a>Overview</h1>
 -->

```