Table of Contents

• Image
• Markdown
• Math
• Chemstry
• Embed video
• Embed Google Map
• Mermaid Chart
• Code format
• Emoji
• Navigation

Image ↑

To past image, you can use

[description of image](http://link_to_image)

or

<div align="center"><img width="200px" src="http://link_to_image"></div>

Images in a 2x2 grid:

<div align="center"><img width="45%" src="http://link_to_image"><img width="45%" src="http://link_to_image"><img width="45%" src="http://link_to_image"><img width="45%" src="http://link_to_image"></div>

Do not mix markdown’s format with html, they usually don’t work together. We currently do not host any images, you can find plenty free image host services, such as postimage.org, to host your images.

Markdown ↑

Picobin.xyz has full support for common markdown.

| Command | Description |
| --- | --- |
| `git status` | List all *new or modified* files |
| `git diff` | Show file differences that **haven't been** staged |
| Third row | this is the third row |

Footnotes / reference, at the end of the document, add something like this:

[^refname]: [description](http://link_to_some_publication)

[^anotherRef]: Some words

Noticing the space to separate them. And use them in the content as:

Someone once said[^refname]: "this is wrong".

<a id="ppost-toc"></a>
**Table of Contents**
 - [Image](#ppost-image)
 - [Markdown](#ppost-markdown)
 - [Math](#ppost-math)

<a id="ppost-image"></a>
## Image [↑](#ppost-toc)

Math ↑

Latex math are supported via Katex $$e^{ix}=\cos(x) + i\sin(x)$$

$$e^{ix}=\cos(x) + i\sin(x)$$

$$\begin{aligned} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\[1em] \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\[0.5em] \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\[1em] \nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned}$$

$$\begin{aligned}
\nabla \times \vec{\mathbf{B}} -\\, \frac1c\\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\\\[1em]
\nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\\\[0.5em]
\nabla \times \vec{\mathbf{E}}\\, +\\, \frac1c\\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\\\[1em]
\nabla \cdot \vec{\mathbf{B}} & = 0
\end{aligned}$$

Chemistry ↑

With Katex extension mhchem, we’re very happy to offer the ability of writing beautiful chemistry formulas, please check mhchem site for mor examples. $$\ce{SO4^2- + Ba^2+ -> BaSO4 v}$$

$$\ce{SO4^2- + Ba^2+ -> BaSO4 v}$$

Embedding video / post ↑

Embedding are supported for YouTube, twitter and TikTok. More website will be enabled if we can ensure security.

Embedding Google Map ↑

<div class="pwrapper" align="center">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d114964.52300824488!2d-80.22945845000001!3d25.7824075!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x88d9b0a20ec8c111%3A0xff96f271ddad4f65!2sMiami%2C%20FL!5e0!3m2!1sen!2sus!4v1701531338965!5m2!1sen!2sus"
width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade">
</iframe>
</div>

Mermaid Chart ↑

  graph TD;
      A-->B;
      A-->C;
      B-->D;
      C-->D;

```mermaid
graph TD;
  A-->B;
  A-->C;
  B-->D;
  C-->D;
```

Code formatting ↑

Computer program could be highlighted automatically, the language should be detected automatically:

python

def main():
    print(“Hello World!”)

c++

int main(int argc, char** argv) {
    std::cout << “Hello World!” << std::endl;
    return 0;
}

Emoji ↑

Just use it. 😅

Navigation ↑

You can assign special ids to your html elements starting with ppost- + alphanumerical symbols. Also there are two special ids: page-header and post-title available for you to reference. Click the following link will scroll the page all the way to the top.

[Top](#page-header)

<a id="ppost-toc"></a>

[↑](#ppost-toc)

Top