Links to list items

  • Unknown's avatar

    I’m having a problem similar to here, but specifically with ids for list items (it may well occur for other tags, but I have not investigated further).

    If I add an id to one of the lis in the usual way, as
    <li id="foo">List item</li>, in the HTML view editor (since currently there seems to be no way to do this in the visual editor), it disappears whenever the list is edited (in any way, not just that changes the li tags).

    A minimal example is given on this page of my site: https://hardysxi.wordpress.com/test/

    Is there any way around this, or do I have to either include an a tag separately in the li, or just never edit lists with ids in the visual editor?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    it disappears whenever the list is edited

    That is, edited in the visual editor.

  • Hi there!

    I’m not sure I understand what exactly are you trying to achieve?
    We’re retiring the Classic Editor so, if what you’re looking for is adding Page Jumps, there’s an easy way to do that within the Block Editor, have a look:

    https://wordpress.com/support/splitting-content/page-jumps/

  • Unknown's avatar

    Hello, thank you for reply. My intention is to have links in the page that point to the individual items in a list (for a bibliography, for example). Normally when writing HTML, I do this by creating an id in the li tag itself, as described above.

    I have not used the Classic Editor for this, only the Block Editor. I have inserted the ids using the “Edit as HTML” option in the block dropdown: there doesn’t seem to be a way of doing this for individual list items with the Visual Editor, only for entire blocks (in this case, the ol tag).

    The problem is that any subsequent edit made to the list block using the Visual Editor deletes any ids added to the li tags.

    The page you link suggests both methods I mentioned in the original post, although the method for adding to the tag itself only gives the example of an entire p block, where it can be done using the Visual Editor too, and the “separate tag” method uses a <div id="foo"></div> to make the target.

  • Excellent, for that simply follow the steps at https://wordpress.com/support/splitting-content/page-jumps/

    You’ll need to add the ids via the HTML option though, yes.

    The items disappearing is a problem though. You might need to build this in a Custom HTML block instead: https://wordpress.com/support/wordpress-editor/blocks/custom-html-block/

  • Unknown's avatar

    Okay, thank you, that’s what I feared. It seems a shame to have to use Custom HTML blocks for something that is much easier to edit visually.

    Are there any plans to add this sort of anchor id functionality to list items, or other blocks that have substructures? Or failing that, to at least stop the visual editor purging added properties like this?

  • We’ll definitely add it to the list of things to consider, of course. :)

  • Unknown's avatar
  • The topic ‘Links to list items’ is closed to new replies.