Rendering the markdown in the query/search results

Let’s go to the topic directly.

The built-in query and research function is very powerful for text searching. However, the search results returned are just plain texts. And I think many people would prefer a result looks similar to the live preview mode. And I kept wondering why there is no such a core plugin or 3-rd party plugin that can do this.

Accidentally, I red this post and found that there is a plugin, but is experimental, that can do this job:

A very cool example of the use case is: you can now build a easy-to-read customized todo list collecting all the todos in every notes within your vault using the query command like :

(task-todo:/.*/)

And if you change the condition, it can do more, such as generate a readable summary or report dynamically, etc. That is really awesome.

You can also print this result if you remove the limit on the max query result window height by applying the css snippet:

.internal-query.search-result-container{
  max-height:none;
}

Moreover, after install this plugin, I found it not only enhances the query result, it also “upgrades” the built-in search function result to support the markdown rendering. It feels like buy one get one for free.

I see there is not so many discussion on this plugin, so I just put it here, so that more people who has similar requirement on search result rendering can have a try on this one.

For the open in the new window feature introduced in Obsidian 0.15.x and above, I found another css snippet very useful, which will eliminate the extra spaces in the query result in the new windows.

:is(.markdown-preview-view,.markdown-rendered) {
  height: fit-content;
}

.search-results-children.is-rendered .search-result-file-matches .markdown-preview-section {
  max-width: 100%;
  height: fit-content;
}
8 Likes

The following is an example of querying “callout” in the sandbox vault:
The rendering result is satisfying.

The following is an example of search result rendering, notice an extra button is added by the plugin:

1 Like

@GLight how did you enable the plugin? I’ve downloaded brat, enabled it. Also downloaded nothingislost/obsidian-embedded-query-control repo and enabled that.

Can’t get the extra button to show up in the search bar.

1 Like

I think you can try the following method to install this plugin via brat. I quote this instruction from the plugin’s github website:

Install the BRAT plugin via the Obsidian Plugin Browser and then add the beta repository “nothingislost/obsidian-embedded-query-control”

  1. press this button in the BART plugin setting pane

  2. paste the plugin name and press add plugin

  3. Let BRAT do the rest work.

If the plugin is installed successfully, you will see the configuration option of obsidian-query-control in the setting menu.

2 Likes