Typora+Vue theme +Gitee Chart bed for easy writing articles
preface
My blog is built by Hexo+GitHub, and MY articles are written in Markdown style. At first, I didn’t think there was anything wrong with my blog, but later, when I saw other people’s articles, they were all so beautiful, both in style and theme. I see the more they write the uglier, in order to write with the nuggets inside the big guy articles as good-looking style, I consulted the wood yi Yang big guy just know Typora, this is the big guy nuggets home page.
These days I have studied Typora, installed the theme of Vue, used the Gitee chart bed to insert pictures when writing articles, and decided to write an article to record it.
The environment
MacOS Catalina 10.15.7
Typora introduction
What is Typora?
Typora is a Markdown text editor that supports live preview. It is available on OS X, Windows, and Linux, and is completely free as it is still in beta.
Typora is first and foremost a Markdown text editor that supports text editing with Markdown syntax only. On Typora’s official website they describe Typora as “A truly minimal Markdown Editor.”
About the Markdown
Markdown is a plain-text format for writing structured documents that allows a degree of formatting of text without taking our hands off the keyboard. You can get a quick start on Markdown in this article.
Since there is no authoritative authority to regulate the syntax of Markdown, the syntax of Markdown varies from application manufacturer to application manufacturer. One of the more recognized is the GFM standard, developed by GitHub, a well-known code hosting site. Typora mainly uses the GFM standard. You can also set standards to “more strictly follow GFM standards” in file-preferences – Markdown Syntax preferences – Strict mode. You can check the details in the official document.
Some highlights of Typora
Open up file-preferences and you’ll find that Typora’s consideration for the editing experience is amazingly detailed. Typora provides a number of Settings for Markdown preferences, so you can build a Markdown editor that is almost perfect for you. Below I’ll go through some of the highlights of the text editing experience in turn.
Smart punctuation
I think intelligent punctuation is one of the more interesting ones. It automatically converts ugly straight quotes into nice curved quotes. You can check the details in the official document. You can also read this article on how to type straight curved quotes on macOS.
Photo insert
Typora’s image insertion function is well received. Remember, Markdown doesn’t place much emphasis on image insertion, but you can do it in Typora:
- Direct use of
Right click - Copy Ctrl + VCopy network pictures, clipboard pictures into the document - Drag a local image into a document
Typora will automatically insert a Markdown image statement and title it for you.
You can also use a graph bed to ensure that your document still shows up after you share it.
Even more powerful, Typora supports automatic saving of web images to local storage after dragging or Ctrl + V. You can choose between file – preferences – Editor – Image insert which path to copy to and under what circumstances.
This feature ensures that even if the Internet source fails, you still have a local backup. It also makes your document folder more logical and complete.
The specific bed configuration will be explained in Gitee Bed configuration.
Typewriter mode and focus mode
** typewriter mode ** keeps the line you are editing in the center of the screen.
** Focus mode ** keeps the color on the line you are editing, and grays the font on the other lines.
You can check both modes in View-Focus/Typewriter mode.
Real-time preview
Not only does Typora support live preview of the editing interface, it also hides Markdown tags automatically, leaving only the * WYSIWYG beauty **. They call it the Hybrid View.
Typora keeps a ** “source code mode” ** in case some program bugs occur and the format cannot be modified. You can enter it through view-source mode or the button in the lower left corner.
In addition to the above there are many other features, we can go to experience.
Install Typora
1. Open the official website of Typora
Typora website
2. Scroll up the page and choose The navigation bar Download in the upper right corner
3. Select the version of your system to download
4. Install the software after downloading
# Common shortcut keysNew CTRL + N Save CTRL + S save as CTRL + SHIFT + S Level 1 Title: CTRL + 1 Level 2 Title: CTRL + 2 Level 3 Title: CTRL + 3 Level 4 Title: CTRL + 4 Level 5 Title: CTRL + SHIFT + Q Ordered list: CTRL + SHIFT + [Unordered List: CTRL + SHIFT +] Code block: CTRL + SHIFT + K Font Bold: CTRL + B Hyperlink: CTRL + K Insert Picture: CTRL + SHIFT + L Show/Hide sidebar: CTRL + SHIFT + L Open/Close Source code mode: CTRL + / Full text Search: CTRL + F Full text replace: CTRL + H Developer tools: SHIFT + F12 jump to the beginning of the text CTRL + Home Jump to the End of the text CTRL + EndCopy the codeInstall the Vue theme
Typora default with Github, Gothic, Newsprint, Night, Pixyll, Whitey these themes, you can check yourself which theme is more consistent with your ideas, you can also install Vue theme to try.
Download the theme
1. Download address
Vue theme download address
2, You can choose to use Git to pull down the project, or choose Download ZIP, Download the package and unzip it.
Install the theme
1, open Typora, click the upper left corner “Typora(Windows is file)” ->” Preferences “->” Appearance” ->” Open theme folder”
2, open the folder you just extracted with Git or the folder you extracted from the zip package, select vue folder, VU E.css, cue-dark. CSS and copy it to the theme folder you just opened.
Set the theme
1. Restart Typora
2. Click on the menu bar theme and select Vue
Using PicGo + Gitee
Download PicGo
1. Go directly to the official website to download
PicGo website
2. Open Typora and click on Typora-> Preferences -> Image -> Download
3. Install PicGo after downloading
Configuration Gitee
1. Open Gitee and log in. If not, register first.
Gitee
2. Build a new public warehouse
3. Click your profile picture in the upper right corner -> Settings -> Then click security Settings -> Private Tokens -> Produce New tokens in the left sidebar
Simply select a projects+ default user_Info, enter the password, and save the token
Configuration PicGo
1. Open PicGo and select the plugin market
I read other articles to install Git 2.0.3 before, but after I installed this plug-in and configured it, it failed to upload successfully, prompting 'statusCodeError', so this plug-in is not used hereCopy the code
2. Search github and install Github-plus 1.2.2
3. Then restart PicGo, select Bed Settings, and find GithubPlus
4. Specific configuration
repo: Fill in your Gitee project address here, open the gitee repository you just created, and copy it in the address bargitee.com/What’s nexttoken: Paste your private token hereorigin: Select Gitee here
At this point PicGo is configured.
Configure the graph bed for Typora
Open Typaora -> Preferences -> Image -> as shown below
The end of the
This is the end of this article, if you find this article useful, please help to like! Thank you very much!!