A continuación mostramos algunos elementos generales de estilo, para que el aspecto de todos los artículos de la documentación sea parecido.

La norma general que debemos tener en cuenta es: no modificar el estilo del documento que estamos editando. Es decir no debemos cambiar el tipo y el tamaño de la fuente, su color, su alineación, etc. De estas cuestiones se ocupa la plantilla que controla el aspecto general del portal de documentación.

Esto no entra en contradicción con que en algunos casos debamos modificar el estilo en alguno de los artículos de la documentación. Pero siempre que exista alguna justificación no estética para hacerlo. Por ejemplo en un artículo dedicado al uso del color puede ser necesario cambiar el color de un texto para resaltar lo que se mostará luego en una escena. Pero no cambiaremos el color de un título por que nos parezca más elegante.

Tras el salto introducido con el botón Insertar etiqueta More mencionaremos algunas cuestiones relativas al estilo que debemos tener en  cuenta. La primera es que, si el artículo es largo, conviene realizar una introducción a cada artículo, o comentar aspectos generales, y después incluir un enlace Leer más. También podemos dividir un artículo en varias páginas, lo que mencionaremos más adelante.

[Leer más…]

Para crear una tabla podemos usar el editor de textos que tiene incorporado WordPress (TinyMCE). Durante la creación dejaremos que sea la hoja de estilos quien controle el aspecto estético de la tabla. Esta norma es general y aplicable a la creación de cualquier artículo de la documentación.

Para crear una tabla hacemos clic en el botón Insertar una nueva tabla. Elegimos el número de filas y columnas, por ejemplo tres filas y cuatro columnas. No marcamos ninguna opción de formato (borde, alineación, etc).

Cuando insertamos la tabla en el editor de WordPress no se aprecia la forma en que se publicará luego. Recordemos que no debemos tomar decisiones que afecten al estilo, salvo que exista un motivo muy importante para hacerlo. Debe ser la hoja de estilos quien controle el aspecto de la tabla. Obviamente sí podemos dar negrita o cursiva al texto, crear listados numerados o no numerados, etc.

Para que la tabla se muestre correctamente debemos indicar que la primera fila es el encabezado de la tabla. Para ello seleccionamos esa primera fila y pulsamos en Propiedades de fila. En la opción Tipo de fila seleccionamos Encabezado de la tabla. Observa que también podemos modificar el alto de la fila, aunque como ya hemos mencionado será una opción que no usaremos con la intención de modificar el estilo de la tabla por una cuestión meramente estética.

Una vez definida la primera fila como encabezado la plantilla le dará el formato adecuado.

Para resaltar código en un artículo de forma que se facilite su lectura debemos encerrarlo entre las etiquetas <pre> y </pre>. También debemos especificar el lenguaje en el que está construido el código. Por ejemplo para JavaScript escribimos <pre lang=»javascript»>.

También es posible numerar las líneas de código, usando <pre lang=»javascript» line=»1″>

Es importante tener en cuenta que debemos trabajar desde la pestaña Texto. Es importante que guardemos el artículo desde esa misma pestaña sin pasar a la pestaña Visual pues en caso contrario el texto se filtrará y se perderá el código.

A continuación se muestra un ejemplo. El resaltado de código también es válido en los comentarios.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<ajs class="DescartesJS" name="mas01" width="240" height="80" code="Descartes.class" codebase="./" archive="lib/Descartes5.jar,lib/Descartes5_Sonido.jar,lib/Descartes5_Algebra.jar" mayscript=""> <param name="tamaño" value="240x80"> <param name="sonido" value="sí">
<param name="álgebra" value="sí"> <param name="decimal_symbol" value=",">
<param name="antialias" value="sí">
<param name="nombre" value="mas01">
<param name="Versión" value="5.107, 2013-08-17">
<param name="Idioma" value="español">
<param name="Botones" value="créditos=no config=no inicio=no limpiar=no">
<param name="E_01" value="tipo='R2' id='E1' fijo='sí' escala='80' O.y='-50' despl_imagen='arr-izq' fondo='blanco' red='no' red10='no' ejes='no' texto='no'">
<param name="C_01" value="id='n3' tipo='numérico' nombre='n3' valor='1' incr='1' min='0' max='1' decimales='0' fijo='sí' visible='sí' parámetro.fuente='Monospaced,PLAIN,12'">
<param name="C_02" value="id='n2' tipo='numérico' nombre='n2' valor='1' incr='1' min='0' max='1' decimales='0' fijo='sí' visible='sí' parámetro.fuente='Monospaced,PLAIN,12' pos_mensajes='centro'"> <param name="C_03" value="id='n1' tipo='numérico' nombre='n1' valor='1' incr='1' min='0' max='1' decimales='0' fijo='sí' visible='sí' parámetro.fuente='Monospaced,PLAIN,12' pos_mensajes='centro'"> <param name="C_04" value="id='n0' tipo='numérico' nombre='n0' valor='1' incr='1' min='0' max='1' decimales='0' fijo='sí' visible='sí' parámetro.fuente='Monospaced,PLAIN,12' pos_mensajes='centro'">
<param name="A_01" value="id='dec' constante='sí' expresión='8*n3+4*n2+2*n1+n0' evaluar='siempre'">
<param name="G_01" value="espacio='E1' tipo='texto' color='azul' expresión='[0,0]' texto='{\rtf1\uc0{\fonttbl\f0\fcharset0 Times New Roman;\f1\fcharset0 Arial;\f2\fcharset0 Courier New;}{\colortbl\red255\green102\blue0;\red0\green128\blue0;\red0\green0\blue255;}\cf0\f1\fs28{\*\mjaformula\cf1 El binario {\expr n3\decimals 0\fixed1}{\expr n2\decimals 0\fixed1}{\expr n2\decimals 0\fixed1}{\expr n0\decimals 0\fixed1}=\cf0}\cf2\f2\fs24\par}' fuente='Arial,PLAIN,14' fijo='sí'">
<param name="G_02" value="espacio='E1' tipo='texto' color='azul' expresión='[0,17]' texto='{\rtf1\uc0{\fonttbl\f0\fcharset0 Times New Roman;\f1\fcharset0 Arial;\f2\fcharset0 Arial;\f3\fcharset0 Courier New;}{\colortbl\red255\green102\blue0;\red0\green128\blue0;\red0\green0\blue255;}\cf0\f1\fs28{\*\mjaformula\cf1 =\f2\fs32{\expr n3\decimals 0\fixed1}\u183 2{\supix\cf1 3\cf0}+{\expr n2\decimals 0\fixed1}\u183 2{\supix\cf1 2\cf0}+{\expr n1\decimals 0\fixed1}\u183 2{\supix\cf1 1\cf0}+{\expr n0\decimals 0\fixed1}\u183 2{\supix\cf1 0\cf0}=\f3\fs24\cf0}\cf2\f3\fs24\par }' fuente='SansSerif,PLAIN,14' fijo='sí'">
<param name="G_03" value="espacio='E1' tipo='texto' color='azul' expresión='[0,38]' texto='{\rtf1\uc0{\fonttbl\f0\fcharset0 Times New Roman;\f1\fcharset0 Arial;\f2\fcharset0 Courier New;}{\colortbl\red255\green102\blue0;\red0\green128\blue0;\red0\green0\blue255;}\cf0\f1\fs28{\*\mjaformula\cf1 ={\expr dec\decimals 0\fixed1} escrito en decimal\cf0}\cf2\f2\fs24\par }' fuente='SansSerif,PLAIN,14' fijo='sí'">
</ajs>

La ventana de edición posee dos pestañas, Visual y Texto. Es posible embeber contenidos mediante un iframe desde la pestaña Visual. Para ello basta escribir el iframe encerrado entre corchetes. La forma es la siguiente:

[iframe src=»URL del contenido» width=»ancho» height=»alto»]

El ancho y el alto pueden ser un porcentaje (100%) o una medida (400) que se entenderá expresada en píxeles.