Mudanças entre as edições de "Como Usar"

De IT's Instruções de Trabalho - FAHOR/CFJL
Ir para navegação Ir para pesquisar
 
(42 revisões intermediárias por 3 usuários não estão sendo mostradas)
Linha 1: Linha 1:
 
==Como usar este Wiki==
 
==Como usar este Wiki==
Abaixo uma séria de exemplos de formatação, para servir de base na criação de novos manuais.
+
 
 +
'''ITCI091''' - Essa instrução de trabalho traz uma série de exemplos de formatação, para servir de base na criação de novas instruções de trabalho, as principais formas estão descritas e explicadas, com exemplos quando julgado necessário. Você pode acessar outros [[Manuais do CI|exemplos de artigos]] criados, como o de [[Adicionando uma impressora|configuração de impressoras]] e o manual de [[Analisar motivo de excesso de tráfego|verificação de origem de consumo de banda]] (excesso). Outros exemplos, se pertinente, serão inseridos no decorrer do tempo.
 +
 
 +
É possível que seu usuário (ou se você não estiver usando um usuário) não possa editar artigos/manuais, portanto esta tarefa não lhe cabe e seu acesso neste wiki é apenas de leitor.
 +
 
 
==Como editar==
 
==Como editar==
  
 
==Tags para formatação básica==
 
==Tags para formatação básica==
 +
 
*<code><nowiki>''texto''</nowiki></code> Para itálico
 
*<code><nowiki>''texto''</nowiki></code> Para itálico
 
*<code><nowiki>'''texto'''</nowiki></code> Para negrito
 
*<code><nowiki>'''texto'''</nowiki></code> Para negrito
Linha 15: Linha 20:
 
*<code>&lt;nowiki><nowiki>''</nowiki>&lt;/nowiki></code> Permite usar os caracteres especiais da Wiki, em uma porção de código, o texto deve estar entre <code>NOWIKI</code>
 
*<code>&lt;nowiki><nowiki>''</nowiki>&lt;/nowiki></code> Permite usar os caracteres especiais da Wiki, em uma porção de código, o texto deve estar entre <code>NOWIKI</code>
 
*<code>&lt;code>x := 1+2;&lt;/code></code> Formata o conteúdo entre <code>CODE</code> com uma fonte monospace, ideal para códigos de programação
 
*<code>&lt;code>x := 1+2;&lt;/code></code> Formata o conteúdo entre <code>CODE</code> com uma fonte monospace, ideal para códigos de programação
*<code><nowiki>----</nowiki></code> Uma linha horizontal, uma barra, como o <code>&lt;hr /></code> do HTML
+
*<code><nowiki>----</nowiki></code> Uma linha horizontal, uma barra, como o <code>&lt;hr></code> do HTML
 
*<code><nowiki>*</nowiki></code> Asteríscos geram bullets lists, ou listas não ordenadas, como a deste menu, você também pode encadear, ex:
 
*<code><nowiki>*</nowiki></code> Asteríscos geram bullets lists, ou listas não ordenadas, como a deste menu, você também pode encadear, ex:
 
<pre>
 
<pre>
Linha 46: Linha 51:
 
<pre>
 
<pre>
 
Sem Indentação
 
Sem Indentação
:Indentação 1
+
:Indentação 1.1
 +
:Indentação 1.2
 
::Indentação 2
 
::Indentação 2
 
:::Indentação 3
 
:::Indentação 3
Linha 52: Linha 58:
 
:'''Gera como saída:'''
 
:'''Gera como saída:'''
 
:Sem indentação
 
:Sem indentação
::Indentação 1
+
::Indentação 1.1
 +
::Indentação 1.2
 
:::Indentação 2
 
:::Indentação 2
 
::::Indentação 3
 
::::Indentação 3
*<code><nowiki><br/></nowiki></code> Uma quebra de linha. O wiki faz a quebra de linha automaticamente, a cada linha em branco. O <code>&lt;br /></code> faz com que um texto possa ter as linhas quebradas mesmo que escrito linha abaixo de linha, ex:
+
*<code><nowiki><br></nowiki></code> Uma quebra de linha. O wiki faz a quebra de linha automaticamente, a cada linha em branco. O <code>&lt;br></code> faz com que um texto possa ter as linhas quebradas mesmo que escrito linha abaixo de linha, ex:
 
<pre>
 
<pre>
 
Uma linha
 
Uma linha
  
 
Outra linha, a linha em branco acima gera para esta linha (atual) um novo parágrafo.
 
Outra linha, a linha em branco acima gera para esta linha (atual) um novo parágrafo.
Outra linha, mas por a linha anterior não ter terminado em BR, esta linha no resultado final estará junto a linha acima&lt;br />
+
Outra linha, mas por a linha anterior não ter terminado em BR, esta linha no resultado final estará junto a linha acima&lt;br>
Outra linha de novo, mas esta linha foi escrita abaixo da anterior, mesmo tendo espaço ao lado, pois foi usado o BR, onde há BR há uma quebra de linha (BREAK LINE)
+
Outra linha de novo, mas esta linha será gerada abaixo da anterior mesmo não tendo linha em branco entre elas pois foi usado o BR,
 +
onde há BR, há uma quebra de linha (line BReak)
 
</pre>  
 
</pre>  
Para formatar partes de código, pode ser usado o comando <code>&lt;syntaxhighlight lang="php"></code> onde em LANG define-se a linguagem a ser formatada no código. Ex:
+
*<code>&lt;syntaxhighlight lang="XXX"></code> Para formatar partes de código, pode ser usado o comando <code>&lt;syntaxhighlight lang="php"></code> onde em LANG define-se a linguagem a ser formatada no código. Ex:
 
<pre>
 
<pre>
 
<syntaxhighlight lang="php">
 
<syntaxhighlight lang="php">
Linha 78: Linha 86:
 
</syntaxhighlight>
 
</syntaxhighlight>
 
</pre>
 
</pre>
 +
 +
*<code><nowiki>;</nowiki></code> Ponto e vírgula criam uma lista de definição em conjunto aos caracteres de indentação (<code><nowiki>:</nowiki></code>) ex:
 +
<pre>
 +
;Lista de termos
 +
:ERP - Sigla de ''Enterprise Resource Planning'' (em português '''''Sistemas Integrados de Gestão Empresarial''''')
 +
:CAD - ''Computer Aided Design'' ('''''Desenho Assistido por computador''''')
 +
</pre>
 +
:'''Gera como saída:'''
 +
:;Lista de termos
 +
::ERP - Sigla de ''Enterprise Resource Planning'' (em português '''''Sistemas Integrados de Gestão Empresarial''''')
 +
::CAD - ''Computer Aided Design'' ('''''Desenho Assistido por Computador''''')
  
 
==Suporte a HTML e CSS==
 
==Suporte a HTML e CSS==
Você também pode usar as tags do HTML para criar conteúdos diferentes com cores e formatações diversas. Mas é importante não abusar deste recurso devido a falta de padronização que causa.<br/>
+
 
Ex:
+
Você também pode usar as tags do HTML para criar conteúdos diferentes com cores e formatações diversas. Mas é importante não abusar deste recurso devido a falta de padronização que gera no contexto geral. Ex:
 
<syntaxhighlight lang="html4strict">
 
<syntaxhighlight lang="html4strict">
<div style="margin:2em 5em;border:1px solid red;padding:1em;">
+
<div style="padding:0.5em 1em;margin:1em auto;border:1px solid red;width:650px;color:#fff;text-align:center;">
     <span style="background-color:#000;color:#fff;">Fundo preto letra branca</span>
+
     <span style="background-color:#000;box-shadow:3px 3px 8px #333;padding:3px 10px;">
 +
          Objeto pai no centro com bordas vermelhas, SPAN filho com fonte branca, fundo preto e sombreado
 +
    </span>
 
</div>
 
</div>
 
</syntaxhighlight>
 
</syntaxhighlight>
 +
:'''Gera como saída'''
 +
<div style="padding:0.5em 1em;margin:1em auto;border:1px solid red;width:650px;color:#fff;text-align:center;">
 +
<span style="background-color:#000;box-shadow:3px 3px 8px #333;padding:3px 10px;">Objeto pai no centro com bordas vermelhas, SPAN filho com fonte branca, fundo preto e sombreado</span>
 +
</div>
  
<div style="margin:2em 5em;border:1px solid red;padding:1em;">
+
== Saiba Mais ==
<span style="background-color:#000;color:#fff;">Fundo preto letra branca</span>
 
</div>
 
  
 +
*Para mais opções de formatação, visite o site da [http://www.mediawiki.org/wiki/Help:Formatting/pt MediaWiki]
 +
*Sobre os tipos e as formas de [http://www.mediawiki.org/wiki/Help:Links exibir links]
 +
*Sobre a forma de [http://www.mediawiki.org/wiki/Help:Lists criar e configurar listas]
 +
*Sobre a forma [http://www.mediawiki.org/wiki/Help:Images de trabalhar com imagens]
 +
*Sobre a forma criar e organizar [http://www.mediawiki.org/wiki/Help:Tables dados em tabelas]
 +
*Outros exemplos de [http://meta.wikimedia.org/wiki/Help:Wikitext_examples formatação e dicas]
  
 
[[Categoria:Manual]]
 
[[Categoria:Manual]]

Edição atual tal como às 14h23min de 15 de fevereiro de 2018

Como usar este Wiki

ITCI091 - Essa instrução de trabalho traz uma série de exemplos de formatação, para servir de base na criação de novas instruções de trabalho, as principais formas estão descritas e explicadas, com exemplos quando julgado necessário. Você pode acessar outros exemplos de artigos criados, como o de configuração de impressoras e o manual de verificação de origem de consumo de banda (excesso). Outros exemplos, se pertinente, serão inseridos no decorrer do tempo.

É possível que seu usuário (ou se você não estiver usando um usuário) não possa editar artigos/manuais, portanto esta tarefa não lhe cabe e seu acesso neste wiki é apenas de leitor.

Como editar

Tags para formatação básica

  • ''texto'' Para itálico
  • '''texto''' Para negrito
  • '''''texto''''' Para itálico e negrito
  • =texto= Título equivalente a <H1>, é o padrão do título de cada artigo, preferir o uso dos subtítulos abaixo
  • ==texto== Subtítulo de nível <H2> (gera uma barra/borda na base da linha horizontal)
  • ===texto=== Subtítulo de nível <H3>
  • ====texto==== Subtítulo de nível <H4>
  • =====texto===== Subtítulo de nível <H5>
  • ======texto====== Subtítulo de nível <H6>
  • <nowiki>''</nowiki> Permite usar os caracteres especiais da Wiki, em uma porção de código, o texto deve estar entre NOWIKI
  • <code>x := 1+2;</code> Formata o conteúdo entre CODE com uma fonte monospace, ideal para códigos de programação
  • ---- Uma linha horizontal, uma barra, como o <hr> do HTML
  • * Asteríscos geram bullets lists, ou listas não ordenadas, como a deste menu, você também pode encadear, ex:
* Lista em nível 1
** Lista em nível 2
** Continuação de lista em nível 2
* Continua a lista em nível 1
Gera como saída:
  • Lista em nível 1
    • Lista em nível 2
    • Continuação de lista em nível 2
  • Continua a lista em nível 1
  • # Sustenidos geram listas ordenadas, você também pode encadear, ex:
# Lista em nível 1
## Lista em nível 2
## Continuação de lista em nível 2
### Lista de nível 3
# Continua a lista em nível 1
Gera como saída:
  1. Lista em nível 1
    1. Lista em nível 2
    2. Continuação de lista em nível 2
      1. Lista de nível 3
  2. Continua a lista em nível 1
  • <big>texto</big> Um texto grande
  • : (dois pontos) gera uma indentação, um recuo no texto com quebra de linha, pode ser usada uma ou mais sequências a fim de evidenciar mais a distância da esquerda da área de leitura
Sem Indentação
:Indentação 1.1
:Indentação 1.2
::Indentação 2
:::Indentação 3
Gera como saída:
Sem indentação
Indentação 1.1
Indentação 1.2
Indentação 2
Indentação 3
  • <br> Uma quebra de linha. O wiki faz a quebra de linha automaticamente, a cada linha em branco. O <br> faz com que um texto possa ter as linhas quebradas mesmo que escrito linha abaixo de linha, ex:
Uma linha

Outra linha, a linha em branco acima gera para esta linha (atual) um novo parágrafo.
Outra linha, mas por a linha anterior não ter terminado em BR, esta linha no resultado final estará junto a linha acima<br>
Outra linha de novo, mas esta linha será gerada abaixo da anterior mesmo não tendo linha em branco entre elas pois foi usado o BR,
onde há BR, há uma quebra de linha (line BReak)
  • <syntaxhighlight lang="XXX"> Para formatar partes de código, pode ser usado o comando <syntaxhighlight lang="php"> onde em LANG define-se a linguagem a ser formatada no código. Ex:
<syntaxhighlight lang="php">
    function valida_email($endereco) {
      $regra = "^[-_a-z0-9]+(\\.[-_a-z0-9]+)*\\@([-a-z0-9]+\\.)*([a-z]{2,4})$";
      return eregi($regra, $endereco);
    }
</syntaxhighlight>

<syntaxhighlight lang="html4strict">
    <div style="margin:5em 20em;border:1px solid red;padding:5em;">
        <span style="background-color:#000;color:#fff;">Fundo preto letra branca</span>
    </div>
</syntaxhighlight>
  • ; Ponto e vírgula criam uma lista de definição em conjunto aos caracteres de indentação (:) ex:
;Lista de termos
:ERP - Sigla de ''Enterprise Resource Planning'' (em português '''''Sistemas Integrados de Gestão Empresarial''''')
:CAD - ''Computer Aided Design'' ('''''Desenho Assistido por computador''''')
Gera como saída:
Lista de termos
ERP - Sigla de Enterprise Resource Planning (em português Sistemas Integrados de Gestão Empresarial)
CAD - Computer Aided Design (Desenho Assistido por Computador)

Suporte a HTML e CSS

Você também pode usar as tags do HTML para criar conteúdos diferentes com cores e formatações diversas. Mas é importante não abusar deste recurso devido a falta de padronização que gera no contexto geral. Ex:

<div style="padding:0.5em 1em;margin:1em auto;border:1px solid red;width:650px;color:#fff;text-align:center;">
    <span style="background-color:#000;box-shadow:3px 3px 8px #333;padding:3px 10px;">
          Objeto pai no centro com bordas vermelhas, SPAN filho com fonte branca, fundo preto e sombreado
    </span>
</div>
Gera como saída

Objeto pai no centro com bordas vermelhas, SPAN filho com fonte branca, fundo preto e sombreado

Saiba Mais