Title can be identified by outline when there is a bulleted list

Use case or problem

  1. I often use bulleted lists to make notes easier to read,but title can not be identified by outline when there is a bulleted list.

Proposed solution

I hope that the text behind the # symbol can be identified as the title by Outline, regardless of the # symbol is located anywhere in one line.And if there is a list of items in the title, can also be identified as title by Outline.

Current workaround (optional)

Related feature requests (optional)

1 Like

I’m afraid that is a markdown syntax issue. Please search the forum, this has been asked before.

In my opinion, the functionality of the outline is not only to show the structure of the notes, but a greater role is a quick jump link, you can quickly jump to the place you want to add content.So an excellent and powerful outline is an indispensable part of a note software.

I search for the Obsidian Forum and found that many people want this feature.

I am not particularly sure how obsidian’s outline plugin is implemented, but I think the outline function can be implemented by retrieving note, just search for the # symbol in the note and display the text after the # symbol in the outline plugin, if so, there will be no problem that markdown is not supported.

There is a very good way to achieve outline effect in Joplin. Place a CSS code in the style file, then enter [TOC] in front of each note, so you can get the same outline view like the following image, and it can identify those titles with item list symbols. I used the same method in Obsidian, but it didn’t seem to work, so I think Obsian support is not particularly good for CSS support in note.
Outline effect

/*TOC*/
nav.table-of-contents ul {
	list-style-type: none;
	margin-top: 0px;
	margin-bottom: 0px;
}

nav.table-of-contents>ul {

	top: 5px;
	right: 0px;
	z-index: 99;
	
	font-size: 12px;
	position: fixed;
	padding: 15px;
	
	border-radius: 10px 0px 0px 10px;
	margin: 0px;
	
	overflow: hidden;
	height: 90%;
	width: 5px;
	transition: .2s;
}

nav.table-of-contents::after {
	content: "[TOC - move your cursor to the right edge]";
	color: black;
}

nav.table-of-contents>ul:hover {
	background: #F8F8F8;
	box-shadow: -5px 0px 10px 0px rgba(0,0,0,0.15);

	width: 30%;
	color: none;
	overflow: scroll;
}

nav.table-of-contents>ul:hover::before {
	content: "TABLE OF CONTENTS"
}

nav.table-of-contents>ul:hover li {
	display: list-item;
}

nav.table-of-contents li {
	display: none;
	white-space: nowrap;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
}
	#rendered-md {
	width: 100%;
	}
nav.table-of-contents a {
    text-decoration: none;
}