Kitchen Sink

De todo un poco como en bótica.

Elementos

Columnas

Las columnas tienen que sumar entre ellas 12, por ejemplo por defecto la columna tiene 6 asi que serian dos 6+6 tambien pueden ser 4+8, 8+4, 3+3+6 etc...

[Row]
  [Col]Columna[/Col]
  [Col]Columna[/Col]
[/Row]

Columna

Columna


[Row]
  [Col num=4]Columna[/Col]
  [Col num=4]Columna[/Col]
  [Col num=4]Columna[/Col]
[/Row]

Columna

Columna

Columna


[Row]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
  [Col num=3]Columna[/Col]
[/Row]

Columna

Columna

Columna

Columna


Otras:

Columna 3

Columna 3

Columna 6

Columna 6

Columna 3

Columna 3

Columna 3

Columna 6

Columna 3

Details

[Details title='Texto oculto']
  Markdown Hidden content 
[/Details]
Texto oculto

Estoy escondidoo.

[Row]
  [Col]
  [Details title='Texto oculto']
    Estoy escondidoo.
  [/Details]
  [/Col]
  [Col]
  [Details title='Texto oculto']
    Estoy escondidoo.
  [/Details]
  [/Col]
[/Row]

Texto oculto

Estoy escondidoo.

Texto oculto

Estoy escondidoo.


Imagenes

Normal:

[Img src='public/notfound.jpg']

Con clases css:

[Img class='clase css' src='public/notfound.jpg']

También añadir enlaces:

[Img url='//google.es' src='public/notfound.jpg']

O también añadir texto:

[Img title='Hello' src='public/notfound.jpg']
Hello
Hello

Si el enlace es de otro dominio

[Img title='Hello' ext='true' src='//monchovarela.es/public/proyectos/colectoxo.png']
Hello
Hello

Nota: Los enlaces de otro dominio no hace falta poner https: solo basta con poner // por ejemplo //example.com/image.png


Textos

A veces necesitamos añadir un texto o nota con un color diferente, para eso usaremos [Text]

[Text bg='blue' color='white']
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim 
veniam, quis nostrud exercitation  ullamco laboris nisi ut aliquip 
ex ea commodo consequat. Duis aute irure dolor in** reprehenderit 
in voluptate velit esse cillum dolore eu fugiat nulla pariatur**. 
[/Text]

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.


Divisores (separadores)

<br/> // normal
<hr/> // linea normal

[Divider] // numero de espacios 1
[Divider type='br'] // sin linea // numero de espacios 1
[Divider color='Khaki'] // color
[Divider class=demo6] // clase opcional
[Divider num='2'] // numero de espacios maximo 3
[Divider type='br' num='2'] // sin linea numero de espacios maximo 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.


Php

[Php]
  function sayName($name)[
    print($name);
  ]
  sayName('Hello World');
[/Php]

Estilos Css y Javascript

Podemos incluir en cada pagina un Css o Jvascript personalizado. El Css se añadirá automaticamente al head y el Javascript al footer.

Css normal:

[Styles]
body[
  background:red;
  color:white;
]
[/Styles]

Css en archivo:

// no hace falta incluir https
[Style href='linkto.css']

Javascript normal:

[Scripts]
function sayName(name)[
  console.log(name);
]
[/Scripts]

Javascript en archivo:

// no hace falta incluir https
[Script src='linkto.js']


Tablas

SyntaxDescription
HeaderTitle
ParagraphText

Alineación:

SyntaxDescriptionTest Text
HeaderTitleHere's this
ParagraphTextAnd more


Listas de definición

First Term
This is the definition of the first term.
Second Term
This is one definition of the second term.
This is another definition of the second term.

Notas al pié

Here's a simple footnote,1 and here's a longer one.2

↑ Volver arriba


  1. This is the first footnote. 

  2. Here's one with multiple paragraphs and code.

    Indent paragraphs to include them in the footnote.

    { my code }

    Add as many paragraphs as you like. 

Ultimo articulo

Kitchen Sink

De todo un poco como en bótica.

Ultimos articulos

Kitchen Sink

De todo un poco como en bótica.

Jodit

Probando shortcodes #2

Hola Mundo

Hola Mundo

Lorem ipsum dolor sit amet, consectetur adipisicin...