Reorder Files and Folders in Obsidian Publish

Feature archive
,
1

Use case or problem

In Obsidian publish, like in the obsidian app, the file explorer is organized alphabetically with no way of changing the order. People who come to the site will be confused which sections are more important than others and I cannot put my home page at the top (which drives me a little crazy haha)

Proposed solution

Allow manual reordering of files and folders in the obsidian publish file explorer

Current Workarounds

Currently the only way around this is numbering files and or folders, however because files are always above files there is no way to put a file above a folder or mix those together in any way.

Related feature requests

This post requested it in the obsidian app and in the comments obsidian publish was also mentioned as needing this feature.

10 Likes
2

I do get your point, personally I use a zettelkasten numbering approach for organizing the order of some notes in my obsidian publish

the part that I’m not sure how it could be addressed is what you said on putting files that are in folders above files in the main folder.

I think you are thinking in terms of how a website sidemenu works, but obsidian publish isn’t a customizable website maker, it’s more of a simple public foder of plaintext file with a cool style.

I say this mostly for some of the limitations to be kept in mind about publish.

however the arbitrary organization of files is interesting, not sure how it’d work, and it probably won’t be completly flexble, butg it’s an interesting idea.

perhaps if there was a way to determine numbers in the front matter of the note

---
order-number: 1

---

then obsidian could read tha data to sort it based on those numbers.

1 Like
3

+1 for this request… I’m in the middle of publishing a simple blog project (sociological analyses and commentary) and I understand that Publish is not, can not and will never be a fully fletched website editor but manual reordering should somehow be implemented. :sweat_smile:

1 Like
4

I would also like the ability to set a custom order on the left hand pane in obsidian Publish!

1 Like
5

Hello,

Just chiming in to say that I would also love to have this feature.

Currently I’ve been using a numbered prefix before each file name, which solves the page order, but is not idea in terms of looks or readability.

Boris

6

To put your home page on top, you can follow the example from this site: data-engineering-wiki/publish.js at baec1720c54ae21053d8e4306fc175928432c907 · data-engineering-community/data-engineering-wiki · GitHub

Copy/paste the JavaScript into your publish.js file and edit it for your site.

I got it to work. The trickiest part for me was because all of my Publish Obsidian files are in a folder titled wte.

So, for my site, I used:

const site = "https://willstrustsestates.pro/";

Then for navItem, I used:

navItem = navContainer.querySelector(`[data-path="wte/${item}.md"]`);
7

I’ve been experimenting with different presentation of the files and folders myself. One idea that I tested is having a very simple file/folder structure in the side menu and using transclusions do the rest of the work.

So, instead of this in the side menu …

Blog
  2022-08-28 ABC
  2022-08-29 DEF

… readers would only see this:

-Blog

-Blog is one Markdown file that uses transclusions, so the Markdown would be this:

![[2022-08-28 ABC]]
![[2022-08-29 DEF]]

If you want to test this approach, then you need to take these steps:

(1) create the Markdown file (-Blog) in the root folder for your blog. (For me, I created -Blog in the wte folder.)

(2) Hide the Blog folder and all of the blog posts in the side menu by add some CSS in publish.css. This worked for me:

.tree-item-self[data-path^='wte/Blog'] {
  display: none;
}

I liked my transclusions experiment so much … I think I went a little overboard, and now I’m mixing some visible folders in the side menu with things like -Blog.

Bonus tip! If you’re going to go nuts with transclusions, as I did, then you will probably want to remove the scroll bar in the inserted file, which can make it hard to scroll the entire page.

/* Remove scroll bar from transclusions */
.markdown-preview-view .markdown-embed-content {
    max-height: unset;
}
.markdown-preview-view .markdown-embed-content > .markdown-preview-view {
    max-height: unset;
    background-color: var(--theme-transclude-background);
}

And here is another bonus tip!!! Play around with format of the title of the inserted file by modifying the CSS. I like the titles, but I wanted them to wrap correctly (not go on forever and ever) and I wanted them aligned to the left. So, this is what I added:

.markdown-embed-title {
/*	display: none; */
	line-height: normal;
	text-align: left;
	word-wrap: break-word;
	white-space: normal;
}

Let me know what you think of this workaround and what you come up with!

8

Here is one more thing you can try: Reverse alphabetical sort of files in the side menu.

To use my earlier example, Obsidian Publish has this order as the default in the side menu:

Blog
  2022-08-28 ABC
  2022-08-29 DEF

But I think for a folder like this, it makes more sense to sort it this way:

Blog
  2022-08-29 DEF
  2022-08-28 ABC

So, just to be clear, Blog is a folder in Obsidian and everything below it is a Markdown file.

To reverse sort the side menu in Obsidian Publish, I added this CSS in publish.css:

.tree-item-self[data-path^='wte/Blog'] + .tree-item-children {
  display: flex;
  flex-direction: column-reverse;
}
9

Do you know if/how it is possible to change the publish.js file to also change the order of folders in the navigation bar rather than simply of notes?

10

Use case or problem

The current way in which files are ordered is folders first followed by files. The home page is therefore not at the top of the list and can be hard to find.

Proposed solution

give us an option to pin the home page at the top of the file navigation panel. This way all the site visitors exactly know where to go to when they want to start navigation from the start again.

Related feature requests (optional)

None

2 Likes
11

This aspect is actively being worked on

https://forum.obsidian.md/t/obsidian-publish-now-offers-more-for-less-a-lower-price-with-new-features-improved-seo-and-accessibility/58272

https://forum.obsidian.md/t/obsidian-release-v1-2-5-insider-build/58384

2 Likes
12

Thanks for this. It is just what I was looking for. Glad to see Obsidian solved this!

13

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.