wxmp
v2.4.0
Artículo oficial de la cuenta oficial de WeChat editor en línea de Markdown, use Markdown Grammar para crear una hermosa y generosa imagen de cuenta oficial de cuentas y introducción de texto. Debido a la molestia de la publicación de versiones y la incapacidad de expandir algunas funciones, el desarrollo se ha estado estancado. En el futuro, los complementos de Chrome ya no se desarrollarán (la rama de Chrome existe temporalmente) y se personalizarán más funciones ricas a través de la versión web.
Los planes de desarrollo y algunas funciones se pueden introducir en el tema si es necesario, lo que hace que las herramientas sean más perfectas. El siguiente ejemplo se utiliza para la visualización de efectos en aplicaciones web.
El siguiente es jsx y resalta el código para la pantalla de efecto en aplicaciones web.
function Demo ( ) {
return < div className = "demo" > Hello World! </ div >
} A continuación se muestra css y resalte el código para la pantalla de efecto en aplicaciones web.
li {
font-size : 16 px ;
margin : 0 ;
line-height : 26 px ;
color : rgb ( 30 41 59 );
font-family : -apple-system-font , BlinkMacSystemFont , Helvetica Neue , PingFang SC , Hiragino Sans GB , Microsoft YaHei UI , Microsoft YaHei , Arial , sans-serif;
}Se utiliza para mostrar efectos en aplicaciones web.
Código en línea {code: 0}
La tabla no puede usar estilos personalizados, todavía no se encuentra ninguna solución
| Encabezado 1 | Encabezado 2 |
|---|---|
| Clave 1 | Valor 1 |
| Clave 2 | Valor 2 |
| Clave 3 | Valor 3 |
Aquí hay una nota de pie de página de sintaxis simple de Markdown 1 . Hay algunas descripciones de texto adicionales al final de la página. Tenga en cuenta que esta no es la característica completa de la nota al pie 3 .
< ruby >
汉 < rt > Han </ rt >
</ ruby >Efecto de pronunciación de carácter chino: Chino Personaje deletrear sonido Nota sonido
Los comentarios de HTML también se pueden usar en Markdown en Markdown. Esta característica se utiliza para personalizar los estilos para algún contenido. Use comentarios HTML <!--rehype:xxx--> para habilitar Markdown para admitir la personalización de estilo.
## 定义标题样式
<!-- rehype:style=display: flex; height: 230px; align-items: center; justify-content: center; font-size: 38px; -->
支持对某些文字变更样式，如_文字颜色_ <!-- rehype:style=color: red; --> ，文字颜色将被设置为红色(red)。<!--rehype:style= para iniciar, --> para terminar y envolver el estilo CSS en el medio, como color: red; Para establecer el texto rojo.
Esta característica utiliza comentarios HTML para ser ignorados en Markdown. Marca el contenido que necesita ser ignorado. La marca comienza <!--rehype:ignore:start--> , la marca termina <!--rehype:ignore:end--> , y la marca no se muestra en la vista previa del editor WeChat Markdown. Mostrar contenido en otras herramientas de vista previa, como GitHub.
# 注释忽略
<!-- rehype:ignore:start -->内容在微信 Markdown 编辑器预览中不显示。在其它预览工具中展示内容。 <!-- rehype:ignore:end --> https://<URL>?md=<Markdown 资源 URL>
Muestra de URL para cargar contenido de marcado:
https://jaywcjlove.github.io/wxmp/#/?theme=underscore&md=https://raw.githubusercontent.com/jaywcjlove/c-tutorial/master/README.md
Markdown URL 地址: https://raw.githubusercontent.com/jaywcjlove/c-tutorial/master/README.md
Almacene el tema predeterminado en el website/src/themes , configure el tema en website/src/store/context.tsx y use css para definir estilos, y no admite selectores complejos. Se proporciona un editor de temas en línea, bienvenido a modificar y PR en el almacén para que todos los usen.
/* 1~6 标题样式定义 */
h1 {} h2 {} h3 {} h4 {} h5 {} h6 {}
a { color : red; } /* 超链接样式定义 */
strong {} /* 加粗样式定义 */
del {} /* 删除线样式定义 */
em {} /* 下划线样式定义 */
u {} /* 下划线样式定义 */
p {} /* 段落样式定义 */
ul {} /* 无序列表样式定义 */
ol {} /* 有序列表样式定义 */
li {} /* 列表条目样式定义 */
blockquote {} /* 块级引用样式定义 */
table {}
td {}
th {}
pre {} /* 样式定义 */
. code-highlight {} /* 代码块样式定义 */
. code-line {} /* 代码块行样式定义 */
. code-spans {} /* 代码块行样式定义 */
sup {} /* GFM 脚注样式定义 */
. footnotes-title {} /* GFM 脚注，参考标题样式定义 */
. footnotes-list {} /* GFM 脚注，参考列表样式定义 */
. image-warpper {} /* 图片父节点样式定义 */
. image {} /* 图片样式定义 */
/* 部分代码高亮样式 */
. comment {}
. property {}
. function {}
. keyword {}
. punctuation {}
. unit {}
. tag {}
. color {}
. selector {}
. quote {}
. number {}
. attr-name {}
. attr-value {}Implemente fácilmente la aplicación del sitio web "WeChat Office Cuenta Markdown" Aplication a través de Docker.
docker pull wcjiang/wxmp
# Or
docker pull ghcr.io/jaywcjlove/wxmp:latestdocker run --name wxmp --rm -d -p 8113:3000 wcjiang/wxmp:latest
# Or
docker run --name wxmp -itd -p 8113:3000 wcjiang/wxmp:latest
# Or
docker run --name wxmp -itd -p 8113:3000 ghcr.io/jaywcjlove/wxmp:latestAcceda a la siguiente URL en su navegador
http://localhost:96611/
Como siempre, ¡gracias a nuestros increíbles contribuyentes!
La lista de contribuyentes de la imagen de arriba, la imagen contribuyente es generada automáticamente por Action-contribuyentes 4 .
Licenciado bajo la licencia del MIT.
Especificación de Markdown de estilo GitHub https://github.github.com/gfm/ ↩
Notas al pie https://github.blog/changelog/2021-09-30-footnotes-now-supported-in-markdown-fields/ ↩
Los artículos de WeChat no admiten saltos de anclaje y apertura de hipervínculos de URL de terceros, por lo que no admiten características completas de notas al pie. ↩
Action Contribuyentes https://github.com/jaywcjlove/github-action-contributores ↩
