Edit mode switch

by Mara-Li
5
4
3
2
1
Score: 61/100

Description

Category: Customization & UI

The Edit mode switch plugin adds a convenient button to the file header in Obsidian's edit mode, enabling users to toggle seamlessly between source mode and live-preview mode. It also supports a 'three-mode toggle' feature that allows switching between read mode, source mode, and live-preview mode in a specified order. This functionality replaces the default Obsidian button and offers a streamlined experience for managing editing and viewing preferences. Users should note potential visual 'blinks' when switching modes, particularly with live-preview.

Reviews

No reviews yet.

Stats

9
stars
7,269
downloads
0
forks
770
days
138
days
138
days
1
total PRs
0
open PRs
0
closed PRs
1
merged PRs
8
total issues
0
open issues
8
closed issues
24
commits

Latest Version

5 months ago

Changelog

0.0.10 (2026-06-11)

0.0.9 (2026-05-13)

README file from

Github

Edit mode switch

Add a button to the file header in edit mode to switch between Source and Live Preview.

Doesn't work if Live Preview or the file header is disabled.

There are three settings:

  • Reverse button icons — Display the next mode button instead of the current one. For example, if you are in Live Preview, it will display the Source icon instead of the Live Preview icon.
  • Include reading mode — Include Reading mode in the switch. One button will cycle through a configurable order.
  • "All button" mode — Each mode (Source, Live Preview, and Reading) is separated. This mode is not compatible with the two other options.

All button mode

All icons will be displayed for each mode in the file header, like this: Obsidian file header with the default theme displaying the three icons for each mode

The active mode will be highlighted, and the highlight will move when switching modes: Obsidian file header in Live Preview mode, displaying the three icons where the active mode is highlighted with the is-active class. Obsidian file header in Source mode, displaying the three icons where the active mode is highlighted with the is-active class. Obsidian file header in Reading mode, displaying the three icons where the active mode is highlighted with the is-active class.

[!note] The Reading button is the default button. Its icon will change when switching to one of the edit modes.

Styling

The plugin uses the following CSS classes:

  • .edit-mode-button: Button added in the file header
  • .edit-mode-hide: Class used to hide the Reading button
  • .edit-mode-default-button: Reading button in the three-mode behavior

Buttons in the three-mode layout will get the is-active class when necessary.

📥 Installation

  • From Obsidian's community plugins
  • Using BRAT with https://github.com/Mara-Li/obsidian-shortcuts-LP_Source
  • From the release page:
    • Download the latest release
    • Unzip shortcuts-edit-mode.zip into the .obsidian/plugins/ path
    • In Obsidian settings, reload the plugin
    • Enable the plugin

Similar Plugins

info
• Similar plugins are suggested based on the common tags between the plugins.
BlindFold
3 years ago by my99n
blindfold hides away the unwants
Dynamic Text Concealer
3 years ago by Matt Cole Anderson
Obsidian.md Plugin to conceal or replace user configured text patterns in Live Preview and Read Mode.
Livecodes Playground
3 years ago by @gapmiss
Open-source client-side code editor plugin for Obsidian.md - powered by LiveCodes.io
Heading Toggler
2 years ago by Lord Turmoil
Toggle heading levels in Obsidian
Mode manager
2 years ago by dk949
Better management of reading/editing modes in obsidian
YAML Table
a year ago by dainakai
Custom Theme Studio
a year ago by @gapmiss
An Obsidian.md plugin to create and tweak custom themes with live CSS editing, element styling, and instant previews. All without leaving Obsidian.
Adapt to Current View
a year ago by greetclammy
Obsidian plugin to set different accent colors for Reading view, Live Preview and Source view.
Better Link Clicker
9 months ago by Eniverz
An Obsidian plugin that modifies the default link click event.
Negative Heading
7 months ago by Ashan Devine
Plugin for Adding Discord Style Negative Headings to Obsidian
Hide Folders
5 months ago by jonasdoesthings
Toggle the visibility of folders in the Obsidian.MD file navigator based on name-patterns
Dayframe
3 months ago by Ganessh Kumar R P
🖼️ like a picture frame but for your daily notes.
Better Live Preview Image
3 months ago by Dong Yang
Better Live Preview image editing for Obsidian
Ctrl Click Links
2 months ago by Eiko Wagenknecht
Restore the link opening behavior in Obsidian.
TableTune
2 months ago by niizhou
Tune your Obsidian tables: drag column/row borders to resize; sizes remembered per table; content-aware defaults; clean single-scrollbar reading view.
Table Resize
2 months ago by lishuai1993
调整obsidian中表格宽度的插件
Qiaomu Publish
12 days ago by 向阳乔木
在 Obsidian 写好,预览排版、制作封面、发到公众号草稿箱 | Format Obsidian notes and send them to WeChat drafts.