Obsidian Magic Move is a Obsidian (https://obsidian.md) plugin for animating code blocks. It based on shiki-magic-move.
- Open Settings > community plugins
- Turn off
Safe mode
- Click
Browse
button to browse plugins and search forMagic Move
, or open this linkobsidian://show-plugin?id=magic-move
in your browser - Click
Install
button - After installed, go back community plugins window, and activate the newly installed plugin below installed plugins list
- Download the latest release
- Extract
obsidian-magic-move
folder from the zip to your vault's plugins folder<vault>/.obsidian/plugins/
(Note:.obsidian
folder may be hidden, you need to show it firstly) - Open Settings > community plugins, reload and activate the plugin below installed plugins list
- working in
Reading Mode
- use ````magic-move to wrap multiple code blocks
- code block syntax is the same as you know
- support code highlighting
````magic-move ```vue import { defineComponent } from 'vue' export default defineComponent({ data: () => ({ count: 1 }), computed: { double() { return this.count * 2 } }, }) ``` ```vue import { ref, computed } from 'vue' const count = ref(1) const double = computed(() => count.value * 2) ``` ````
You can set the duration
, stagger
, lineNumbers
animation option and select any theme you like in the settings tab. All settings are effective immediately.
- mix Magic Move with line highlighting
- living preview