Anker setzen

[Cameron]

Hi, gefühlt ein altes Problem. Ich habe eine Deutschlandkarte erstellt und eine Liste mit Orten als <ol>. Die Orte sind nach Himmelsrichtungen sortiert und ich möchte, dass beim Klick auf die Grafik der erste Ort der Himmelsrichtung angezeigt wird. (hoffentlich verständlich erklärt)

<img src="http://.../wp-content/uploads/2018/06/kartei_deutschland.jpg" usemap="#image-map" />

<map name="image-map">
  <area title="" alt="" coords="106,438,52" shape="circle" href="#mitte" target="" />
  <area title="" alt="" coords="252,551,86" shape="circle" href="#sued" target="" />
  <area title="" alt="" coords="85,309,52" shape="circle" href="#west" target="" />
  <area title="" alt="" coords="386,235,78" shape="circle" href="#ost" target="" />
  <area title="" alt="" coords="203,157,56" shape="circle" href="#nord" target="" />
</map>
<ol>
 	<li><a href="http://.../2018/04/28/kiel/" name="#nord">Kiel</a></li>
</ol>

Die ganze Sache funktioniert aber nicht. Zudem muss ich dazu sagen, dass ich das Ganze in WordPress mache, aber eben nicht via Plugin, sondern händisch. Aber was mache ich falsch?

Vielen Dank für Eure Hilfe!

(Edit: HTML formatiert / Rolf B)