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
 
(69 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.
 
===Como editar===
 
  
===Tags para formatação básica===
+
'''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==
 +
 
 +
==Tags para formatação básica==
  
 
*<code><nowiki>''texto''</nowiki></code> Para itálico
 
*<code><nowiki>''texto''</nowiki></code> Para itálico
Linha 14: Linha 18:
 
*<code><nowiki>=====texto=====</nowiki></code> Subtítulo de nível &lt;H5>
 
*<code><nowiki>=====texto=====</nowiki></code> Subtítulo de nível &lt;H5>
 
*<code><nowiki>======texto======</nowiki></code> Subtítulo de nível &lt;H6>
 
*<code><nowiki>======texto======</nowiki></code> Subtítulo de nível &lt;H6>
*<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 NOWIKI
+
*<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>
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;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> Asteríscos geram bullets lists, ou listas não ordenadas, como a deste menu, você também pode encadear, ex:
 +
<pre>
 +
* 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
 +
</pre>
 +
:'''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
 +
*<code><nowiki>#</nowiki></code> Sustenidos geram listas ordenadas, você também pode encadear, ex:
 +
<pre>
 +
# 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
 +
</pre>
 +
:'''Gera como saída:'''
 +
::# 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
 +
*<code><nowiki><big>texto</big></nowiki></code> Um texto grande
 +
*<code><nowiki>:</nowiki></code> (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
 +
<pre>
 +
Sem Indentação
 +
:Indentação 1.1
 +
:Indentação 1.2
 +
::Indentação 2
 +
:::Indentação 3
 +
</pre>
 +
:'''Gera como saída:'''
 +
:Sem indentação
 +
::Indentação 1.1
 +
::Indentação 1.2
 +
:::Indentação 2
 +
::::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:
 +
<pre>
 +
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&lt;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)
 +
</pre>
 +
*<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 31: Linha 87:
 
</pre>
 
</pre>
  
===Suporte a HTML e CSS===
+
*<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:
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/>
+
<pre>
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''''')
 +
</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==
 +
 
 +
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:5em 20em;border:1px solid red;padding:5em;">
+
<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>
 +
 +
== Saiba Mais ==
 +
 +
*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]]

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