It’s enough to learn to write a blog


Supporting information, free download
Link: https://pan.baidu.com/s/1ZpqUYISWViBWb4z0_SPu9A
Extraction code: l43x
Copy this content and open the Baidu Netdisk mobile app, which is more convenient for operation

Chapter One Current Status

  • Pain point 1: After you finish writing an article, it is sometimes difficult to write it once and publish it everywhere on the Internet.

    image-20201117184521072

  • Pain point 2: In the process of editing articles, the introduction of pictures often brings great trouble to the author, and it is very inconvenient to carry

  • Pain point 3: Some blog platforms do not support video, or sometimes we only need a simple animation to describe what we mean, how to generate this animation

  • Pain point 4: The traditional Word editing mode is not suitable for the rapid iteration of Internet technology today, and complex typesetting always makes people helpless

Chapter 2 How to Choose

So, what is my solution after seeing the above pain points?

Typora+PicGo+Gitee+Snipaste+ScreenToGif's fast editing mode is worth it!

  • Typora: It is a lightweight and concise Markdown editor that supports real-time rendering technology, that is, you can see what you write immediately, without time for typesetting, and focus on editing the content of the article.
  • PicGo: It is a tool for quickly uploading pictures and obtaining picture URL links. It supports a variety of galleries, but its functions are much more than that.
  • Gitee: Currently China's largest code hosting tool, in fact, in addition to code, it also supports image storage.
  • Snipaste: If you usually use QQ screenshots, I can only tell you that you are out of date. Snipaste is your best choice. The pictures captured with it are not only of high quality, but the file size is much smaller than that of QQ screenshots. Only high-quality images with low file size can ensure that when you upload articles on major platforms, you can ensure that the images will not fail to transfer because they are too large.
  • ScreenToGif: Are you still worrying about how to describe CSS animation to fans? Today, it is here, a very simple and easy-to-use powerful GIF recording tool is here.

The above tools can all exist separately, but when they are combined together, they can exert their greatest power. Really realize, write once, publish across blog sites, and no longer have to worry about the storage of pictures and the upload process. For the problem of unsuccessful image transfer in, you only need to save one .mdfile in the end for all your articles . So, what are you waiting for in front of the screen, see how these tools work together!

Chapter 3 How to install

Typora installation:

Official address: https://typora.io/

How to install: Download the version corresponding to the number of bits in accordance with their own computer, and then all the way to default the next installation.

homescreen icon:image-20201117192214493

PicGo installation:

Official address: https://github.com/Molunerfinn/PicGo

How to install: Download the version corresponding to the number of bits in accordance with their own computer, and then all the way to default the next installation. Note: You must install a node.js before installation (12 and above is best), otherwise, you will fail when installing the plug-in later and cannot run.

homescreen icon:image-20201117192159004

Gitee installation:

Official address: https://gitee.com/

How to install: This does not need to be installed, you have to register an account.

Installation of Snipaste:

Official address: https://www.snipaste.com/

How to install: Download the version corresponding to the number of bits in accordance with their own computer, and then all the way to default the next installation. Note: If it is a green version, just unzip it and use it.

homescreen icon:image-20201117191737150

Installation of ScreenToGif:

Official address: https://www.screentogif.com/

How to install: Download the version corresponding to the number of bits in accordance with their own computer, select the lower left corner at the time of installation cn, and then all the way to default the next installation.

homescreen icon:image-20201117192116478

Reminder: I will pack all the above software into the supporting materials, because the official website of some software is on the external network, the download speed of the machine is slow, and the download fails easily! When you choose the software I provide, some of the software may prompt you to update. Here I just want to say, if you don’t update, the update will probably fail, because the update is also connected to the Internet, so just ignore it. , The versions I provide are basically the latest ones, and I am using them myself.

Chapter 4 Picture Bed Configuration

Open PicGo to find "Plugin Settings" , search for the plugin "gitee-uploader" , after finding it, click Install in the lower right corner

image-20201117193053841

Then find "Picture Bed Settings" , find the "gitee" item inside , turn on the standby first, and configure it later.

image-20201117193318608

Next, open the Gitee website and create a warehouse in it to store the pictures used in the article. The three parameters that gitee picture bed must set are as shown above:

  • repo: It represents the address of your warehouse. If you don’t know about it, look at the picture below

    image-20201117193631121

  • branch: Just write master for this parameter

  • token: This parameter first needs to be found in the personal settings and generated by finding the private token. The specific steps are as follows:

    image-20201117193806036

    image-20201117193829675

    image-20201117193856227

    image-20201117193938063

    image-20201117194014297

Copy the token above into the token text box just now, so that PicGo can submit pictures to Gitee through the image bed.

Then, we set up the image bed itself, open the image bed settings, and set as follows:

image-20201117194324057

Next, let's check what is the current service port of TuBed, which is convenient for the following configuration:

image-20201117194407977

image-20201117194426350

This address and port are very important, so you should write it down now for easy operation later!

Chapter 5 Picture bed docking

Open Typora preferences, found inside the image , then like me, for him to be set.

image-20201117194611671

image-20201117194709007

Then check whether the image-to-bed connection is successful, click "Verify image upload option" , and if it succeeds, the acquisition will be displayed as successful.

image-20201117194812566

Chapter 6 Writing Skills

  1. Tip 1: After starting Snipaste, press F1 to quickly take a screenshot. It is recommended to set the application to start automatically after booting.

  2. Tip 2: Don’t use shortcut keys to insert a picture, just use the screenshot of Tip 1, then paste it in Typora, and then click upload, so that the picture will be automatically uploaded to the cloud, and the absolute address of the cloud will be automatically replaced in the article, gif demonstration as follows:

    The demo animation is too big, please open it manually: https://gitee.com/caochenlei/BlogImages/raw/master/20201117195730.gif

  3. Tip 3: After you finish using ScreenToGif, you can export the gif to the desktop, then use the mouse to directly drag into the article, and then click on the picture to upload, so that the picture will be automatically uploaded to the cloud, and the absolute address of the cloud will be automatically replaced In the article, the gif demonstrates as follows:

    The demo animation is too big, please open it manually: https://gitee.com/caochenlei/BlogImages/raw/master/20201117195743.gif

  4. Tip 4: You must copy and upload one of the pictures. Do not upload to the last one, otherwise there may be problems. In this way, because the pictures in your article are quoted by network addresses, local pictures are optional. It becomes easier when you publish blog posts on multiple platforms.

  5. Five Tips: Questions about Typora bold, must be in ** 需要加粗的文本 **before and after they left a blank space, or sometimes failed to render.

  6. Tip 6: About Typora, try to use shortcut keys instead of looking in the format of the navigation bar. Common shortcut keys are as follows:

    • First level heading: CTRL + 1, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Secondary title: CTRL + 2, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Three-level heading: CTRL + 3, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Four-level heading: CTRL + 4, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Five-level heading: CTRL + 5, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Sixth level heading: CTRL + 6, note: this number is the row of small numbers on the left, not the number from the numeric keypad on the right
    • Bold text: CTRL + B
    • Insert picture: CTRL + SHIFT + I
    • Insert link: CTRL + K
    • Insert table: CTRL + T
    • Insert underscore: CTRL + U
    • Full text search: CTRL + F
    • Full text replacement: CTRL + H
    • Ordered list: CTRL + SHIFT + [
    • Unordered list: CTRL + SHIFT + ]
    • Open or close source code mode: CTRL + /
  7. Tip 7: If you want your text to have color, please use html code to achieve it, as follows:

    <font color='red'>我想要变成红色</font>
    
  8. Tip 8: If you want to insert a code snippet, please enter the key under ESC three times in English, followed by lowercase of your code language, as follows:

    ​```html          回车,这就是插入html代码片段
    ​```css           回车,这就是插入css代码片段
    ​```javascript    回车,这就是插入javascript代码片段
    ​```c             回车,这就是插入c代码片段
    ​```java          回车,这就是插入java代码片段
    ​```bash          回车,这就是插入bash代码片段
    
  9. Tip 9: When uploading an article, do not directly copy the current text, you have to open it in source mode, copy the source code to the article editing area of ​​CSDN, the source code is as follows:

    image-20201117202223490

  10. Tip 10: If you encounter a problem, you will not ask Baidu, you can also leave a message at the end of this article, I will reply in time when I see it, la la la, finished!

Guess you like

Origin blog.csdn.net/qq_38490457/article/details/109752298