Arquivo da tag: textile como escrever

Formatação de texto em Textile

Formatação de texto em Textile. Para elementos como cabeçalhos, negrito, tabelas, listas e vários comandos HTML pode ser usado a sintaxe Textile escrita mais rápida e eficiente. Consulte outras publicações no blog para informações de uso de mais funcionalidades. Alguns exemplos são apresentados a seguir por serem mais recorrentes na escrita.

Formatação de texto em Textile

 

Acrônimo

JPL(Jean-Philippe Lang)

Exibe:

JPL

Estilo de fonte

* *negrito*
* _itálico_
* *_negrito itálico_*
* +sublinhado+
* -riscado-
* Texto ^sobrescrito^
* Texto ~subscrito~
* @Monoespaçado em linha@
* normal *negrito* _itálico_ normal;E=mc ^2^
* normal<notextile></notextile>*negrito*<notextile></notextile>_itálico_<notextile></notextile>normal;E=mc<notextile></notextile>^2^
* Escapando: <notextile>*negrito* _itálico_ @monoespaçado@</notextile> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Alternativa usando códigos HTML: &#42;negrito&#42; &#95;itálico&#95; &#64;monoespaçado&#64;
* <pre>*algumas linhas*      algum "link":http://www.redmine.org</pre>
* <pre><notextile></notextile>*algumas linhas*      algum "link":http://www.redmine.org</pre>

Exibição:

  • negrito
  • itálico
  • negrito itálico
  • sublinhado
  • riscado
  • Texto sobrescrito
  • Texto subscrito
  • Monoespaçado
  • normal negrito itálico normal;E=mc 2
  • normalnegritoitáliconormal;E=mc2
  • Escaping: *negrito* _itálico_ @monoespaçado@       Alternativa usando códigos HTML: *negrito* _itálico_ @monoespaçado@
  • *algumas linhas*      algum "link":http://www.redmine.org
  • algumas linhas      algum link

Cores

* %{color:red}vermelho% %{color:green}verde% %{color:yellow}amarelo% %{color:#82B6E1}azul%
* %{color:red}vermelho%<notextile></notextile>%{color:green}verde%<notextile></notextile>%{color:yellow}amarelo%<notextile></notextile>%{color:#82B6E1}azul%
* %{background:lightgreen}Fundo verde-claro% %{background:yellow}Fundo amarelo%
* %{background:lightgreen}Fundo verde-claro%<notextile></notextile>%{background:yellow}Fundo amarelo%

Exibição:

  • vermelho verde amarelo azul
  • vermelhoverdeamareloazul
  • Fundo verde-claro Fundo amarelo
  • Fundo verde-claroFundo amarelo

Imagens

  • !image_url! exibe imagem localizada em image_url (textile syntax)
  • !>image_url! imagem alinhada à direita
  • !image_url(Image title)! exibe imagem com atributo alt/title
  • !image_url!:URL exibe imagem localiza em image_url com link embutido

Se você tiver uma imagem anexada na página wiki, pode ser inserida informando o nome do arquivo: !attached_image.png!

Você também pode aplicar estilo CSS na image da mesma forma ao estilizar SPANs. O código !{width: 100%}attached_image.png! irá ajustar a imagem conforme largura do elemento pai.

Cabeçalhos

h1. Título

h2. Subtítulo

h3. Subtítulo

Redmine atribui uma âncora para cada um desses títulos, assim você pode linká-los com “#Heading”, “#Subheading” e assim por diante.

Parágrafos

p. alinhado à esquerda

  p(. identado à equerda em 1em

    p((. identado à equerda em  2em
    bem como as seguintes linhas

                                                                                   p>. alinhado à direita

                                                                        p)))>. identado à direita em 3em

                           p=. Parágrafo centralizado.

Linha horizontal

----
Exibição:


Pré-definido

Para escapar sintaxe wiki

 <pre> *Seu texto não será negrito* </pre>

Exibição:

 *Seu texto não será negrito*

Citações

Inicie o parágrafo com bq.:

bq. Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
To go live, all you need to add is a database and a web server.

Exibição:

Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
To go live, all you need to add is a database and a web server.

Você também pode usar > no inicio de cada linha e empilhá-los para citações aninhadas:

>> Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
>> To go live, all you need to add is a database and a web server.
> Great!

Exibição:

Rails is a full-stack framework for developing database-backed web applications according to the Model-View-Control pattern.
To go live, all you need to add is a database and a web server.

Great!

Listas não-ordenadas

* Item 1
* Item 2
** Item 21
** Item 22
* Item 3

exibição:

  • Item 1
  • Item 2
    • Item 21
    • Item 22
  • Item 3

Listas ordenadas

# Item 1
# Item 2
# Item 3
## Item 3.1
## Item 3.2

exibição:

  1. Item 1
  2. Item 2
  3. Item 3
    1. Item 3.1
    2. Item 3.2

Tabelas

|_.UserID      |_.Nome          |_.Grupo     |_. lista atributos  |
|Iniciando com | uma            |   simples  |linha               |
|\3=.TI                                      |<. alinha esquerda  |
|1             |Artur Pirozhkov |/2.Users    |>. alinha direita   |
|2             |Vasya Rogov     |=. centraliza |
|3             |John Smith      |Admin
                                 (root)      |^. alinha topo      |
|4             |-               |Ninguém
                                 (anônimo)   |~. alinha base      |

displays (all multiple spaces are replaced by 1 space):

UserIDNomeGrupolista atributos
Iniciando comumasimpleslinha
TIalinha esquerda
1Artur PirozhkovUsersalinha direita
2Vasya Rogovcentraliza
3John SmithAdmin
(root)
alinha topo
4Ninguém
(anônimo)
alinha base

Se você quiser inserir o caracter | (pipe) dentro da tabela (ex.: links Wiki), deve-se prevenir que o textile os interprete:

EntradaSaída
<notextile>|</notextile>|

Tabela de conteúdo (TOC)

{{toc}} => toc alinhado à esquerda
{{>toc}} => toc alinhado à direita

Observe que a tag do TOC precisa de uma linha vazia antes e depois da mesma.

Exemplo:


h1. TítuloUm

h2. subtítulo

{{toc}}

h2. outro subtítulo

Textile Comandos Guia Rápido

Textile Comandos Guia Rápido. O principais comandos para editar um arquivo textile. Use estes comandos para criar um arquivo textile.

Escrevendo em Textile
A single paragraph.

Followed by another.
formata em:A single paragraph.

Followed by another.

I am <b>very</b> serious.

<pre>
  I am <b>very</b> serious.
</pre>
formata em:I am very serious.

  I am <b>very</b> serious.
I spoke.
And none replied.
formata em:I spoke. And none replied.
"Observe!"
formata em:“Observe!”
Observe -- very nice!
formata em:Observe—very nice!
Observe - tiny and brief.
formata em:Observe – tiny and brief.
Observe...
formata em:Observe…
Observe: 2 x 2.
formata em:Observe: 2×2.
one(TM), two(R), three(C).
formata em:one™, two®, three©.
Quick Block Modifiers
h1. Header 1
formata em:

Header 1

h2. Header 2
formata em:

Header 2

h3. Header 3
formata em:

Header 3

An old text

bq. A block quotation.

Any old text
formata em:An old text

A block quotation.

Any old text

This is covered elsewhere[1].
formata em:This is covered elsewhere1.
fn1. Down here, in fact.
formata em:

1 Down here, in fact.

Quick Phrase Modifiers
I _believe_ every word.
formata em:I believe every word.
And then? She *fell*!
formata em:And then? She fell!
I __know__.
I **really** __know__.
formata em:I know. I really know.
??Cat's Cradle?? by Vonnegut
formata em:Cat’s Cradle by Vonnegut
Convert with @r.to_html@
formata em:Convert with r.to_html
I'm -sure- not sure.
formata em:I’m sure not sure.
You are a +pleasant+ child.
formata em:You are a pleasant child.
a ^2^ + b ^2^ = c ^2^
formata em:a 2 + b 2 = c 2
log ~2~ x
formata em:log 2 x
I'm %unaware% of most soft drinks.
formata em:I’m unaware of most soft drinks.
I'm %{color:red}unaware%
of most soft drinks.
formata em:I’m unaware of most soft drinks.
Attributes
p(example1). An example
formata em:

An example

p(#big-red). Red here
formata em:

Red here

p(example1#big-red2). Red here
formata em:

Red here

p{color:blue;margin:30px}. Spacey blue
formata em:Spacey blue
p[fr]. rouge
formata em:

rouge

I seriously *{color:red}blushed*
when I _(big)sprouted_ that
corn stalk from my
%[es]cabeza%.
formata em:I seriously blushed when I sprouted that corn stalk from my cabeza.
p<. align left
formata em:align left
p>. align right
formata em:align right
p=. centered
formata em:centered
p<>. justified
formata em:justified
p(. left ident 1em
formata em:left ident 1em
p((. left ident 2em
formata em:left ident 2em
p))). right ident 3em
formata em:right ident 3em
h2()>. Bingo.
formata em:

Bingo.

h3()>[no]{color:red}. Bingo
formata em:

Bingo

<pre>
<code>
  a.gsub!( /</, '' )
</code>
</pre>
formata em:

  a.gsub!( /</, '' )

&ltpre><div style=”float:right;”>

h3. Sidebar

“Hobix”:http://hobix.com/
“Ruby”:http://ruby-lang.org/

</div>

The main text of the
page goes here and will
stay to the left of the
sidebar.</pre>

formata em:

Sidebar

Hobix Ruby

The main text of the page goes here and will stay to the left of the sidebar.

Lists
# A first item
# A second item
# A third
formata em:
  1. A first item
  2. A second item
  3. A third
# Fuel could be:
## Coal
## Gasoline
## Electricity
# Humans need only:
## Water
## Protein
formata em:
  1. Fuel could be:
    1. Coal
    2. Gasoline
    3. Electricity
  2. Humans need only:
    1. Water
    2. Protein
* A first item
* A second item
* A third
formata em:
  • A first item
  • A second item
  • A third
* Fuel could be:
** Coal
** Gasoline
** Electricity
* Humans need only:
** Water
** Protein
formata em:
  • Fuel could be:
    • Coal
    • Gasoline
    • Electricity
  • Humans need only:
    • Water
    • Protein
External References
I searched "Google":http://google.com.
formata em:I searched Google.
I am crazy about "Hobix":hobix
and "it's":hobix "all":hobix I ever
"link to":hobix!

[hobix]http://hobix.com
formata em:I am crazy about Hobix and it’s all I ever link to!
!http://redcloth.org/hobix.com/textile/sample.jpg!
formata em:
!openwindow1.gif(Bunny.)!
formata em:Bunny.
!openwindow1.gif!:http://hobix.com/
formata em:
!>obake.gif!

And others sat all round the small
machine and paid it to sing to them.
formata em:

And others sat all round the small machine and paid it to sing to them.

We use CSS(Cascading Style Sheets).
formata em:We use CSS.
Tables
| name | age | sex |
| joan | 24 | f |
| archie | 29 | m |
| bella | 45 | f |
formata em:
nameagesex
joan24f
archie29m
bella45f
|_. name |_. age |_. sex |
| joan | 24 | f |
| archie | 29 | m |
| bella | 45 | f |
formata em:
nameagesex
joan24f
archie29m
bella45f
|_. attribute list |
|<. align left |
|>. align right|
|=. center |
|<>. justify |
|^. valign top |
|~. bottom |
formata em:
attribute list
align left
align right
center
justify
valign top
bottom
|\2. spans two cols |
| col 1 | col 2 |
formata em:
spans two cols
col 1col 2
|/3. spans 3 rows | a |
| b |
| c |
formata em:
spans 3 rowsa
b
c
|{background:#ddd}. Grey cell|
formata em:
Grey cell
table{border:1px solid black}.
|This|is|a|row|
|This|is|a|row|
formata em:
Thisisarow
Thisisarow
|This|is|a|row|
{background:#ddd}. |This|is|grey|row|
formata em:
Thisisarow
Thisisgreyrow

Leia também um guia de referência completa do textile http://redcloth.org/hobix.com/textile/