Inserir Imagens no Site Pronto

De Suporte
(Diferença entre revisões)
Ir para: navegação, pesquisa
Linha 31: Linha 31:
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
| 3. Será aberta a tela de formatação de imagem.
 
| 3. Será aberta a tela de formatação de imagem.
−
4. Clique no botão '''Localizar no Servidor'''.
+
Clique no botão '''Localizar no Servidor'''.
 
|}
 
|}
 
|-
 
|-
Linha 40: Linha 40:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 5. Será aberta a tela do '''Gerenciador de Arquivos'''.
+
| 4. Será aberta a tela do '''Gerenciador de Arquivos'''.
−
6. Clique no botão '''Enviar arquivos'''.
+
Clique no botão '''Enviar arquivos'''.
 
|}
 
|}
 
|-
 
|-
Linha 50: Linha 50:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 7. Será aberta a opção para envio de imagem ao servidor.
+
| 5. Será aberta a opção para envio de imagem ao servidor.
−
8. Clique no botão '''Procurar...'''.
+
Clique no botão '''Procurar...'''.
 
|}
 
|}
 
|-
 
|-
Linha 60: Linha 60:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 9. Procure e selecione o arquivo da imagem em seu computador.
+
| 6. Procure e selecione o arquivo da imagem em seu computador.
−
10. Para transmitir o arquivo para o servidor clique no botão '''Upload'''.
+
7. Para transmitir o arquivo para o servidor clique no botão '''Upload'''.
 
----
 
----
 
<font color=red>'''Atenção:''' O Site Pronto tem uma limitação de tamanho máximo de 2Mb para cada arquivo.
 
<font color=red>'''Atenção:''' O Site Pronto tem uma limitação de tamanho máximo de 2Mb para cada arquivo.
Linha 76: Linha 76:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 11. Aguarde o processo de envio do arquivo da imagem para o servidor.
+
| 8. Aguarde o processo de envio do arquivo da imagem para o servidor.
 
Quando for concluído será exibida uma mensagem informando o sucesso do envio do arquivo e o mesmo aparecerá na listagem de arquivos logo abaixo.
 
Quando for concluído será exibida uma mensagem informando o sucesso do envio do arquivo e o mesmo aparecerá na listagem de arquivos logo abaixo.
 
|}
 
|}
Linha 86: Linha 86:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 12. Após clique no nome do arquivo para selecionar a imagem a ser inserida na página do Site Pronto.
+
| 9. Após clique no nome do arquivo para selecionar a imagem a ser inserida na página do Site Pronto.
 
|}
 
|}
 
|-
 
|-
Linha 95: Linha 95:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 13. Será retornado para a tela de formatação de imagem onde já estará preenchido o local da imagem no servidor (URL) e a mesma será exibida no campo de pré-visualização (Preview).
+
| 10. Será retornado para a tela de formatação de imagem onde já estará preenchido o local da imagem no servidor (URL) e a mesma será exibida no campo de pré-visualização (Preview).
−
14. Clique em '''OK''' para incluir a imagem na página.
+
Clique em '''OK''' para incluir a imagem na página.
 
|}
 
|}
 
|-
 
|-
Linha 105: Linha 105:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 15. A imagem será inclusa na página na [[Área de Edição]].
+
| 11. A imagem será inclusa na página na [[Área de Edição]], no local em que estava posicionado o cursor "|".
 
|}
 
|}
 
|-
 
|-
Linha 114: Linha 114:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| Se desejar pode ajustar o tamanho da imagem inserida.
+
| 12. Se desejar pode ajustar o tamanho da imagem inserida.
−
16. Para redimensionar uma imagem, clique apenas uma vez na imagem para selecioná-la.
+
Para redimensionar uma imagem, clique apenas uma vez na imagem para selecioná-la.
  
 
Note que ao redor da imagem aparecem alguns quadradinhos nos cantos e laterais.
 
Note que ao redor da imagem aparecem alguns quadradinhos nos cantos e laterais.
Linha 126: Linha 126:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 17. Clique em um dos quadradinhos, mantenha pressionado o botão do mouse, arraste na direção desejada para aumentar ou reduzir a imagem e solte quando a imagem estiver do tamanho desejado.
+
| 13. Clique em um dos quadradinhos, mantenha pressionado o botão do mouse, arraste na direção desejada para aumentar ou reduzir a imagem e solte quando a imagem estiver do tamanho desejado.
 
Utilize os quadadinhos dos cantos para redimensionar altura e largura ao mesmo tempo.
 
Utilize os quadadinhos dos cantos para redimensionar altura e largura ao mesmo tempo.
 
|}
 
|}
Linha 136: Linha 136:
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
| style="border:1px solid #cccccc; background:#f5f5f5; vertical-align:top;"|
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
 
{| cellpadding="2" cellspacing="2" style="width:408px; vertical-align:top; text-align: left;"
−
| 18. ou apenas um quadradinho de cima, baixo ou lateral para redimensionar somente altura ou largura.
+
| Ou apenas um quadradinho de cima, baixo ou lateral para redimensionar somente altura ou largura.
 
|}
 
|}
 
|-
 
|-
Linha 148: Linha 148:
 
Consulte [[Site Pronto#Tamanho da Imagem|Tamanho da Imagem]] e [[Site Pronto#Redimensionar uma Imagem|Redimensionar uma Imagem]]</font>
 
Consulte [[Site Pronto#Tamanho da Imagem|Tamanho da Imagem]] e [[Site Pronto#Redimensionar uma Imagem|Redimensionar uma Imagem]]</font>
  
−
19. Se desejar repita o procedimento para incluir outras imagens.
+
14. Se desejar repita o procedimento para incluir outras imagens.
  
−
20. Quando terminar clique no botão '''Gravar'''.
+
15. Quando terminar clique no botão '''Gravar'''.
 
|}
 
|}
 
|-
 
|-

Edição das 14h11min de 11 de junho de 2014

Para incluir imagens em uma página do Site Pronto, siga o procedimento:
Clique para ampliar
1. Na Área de Edição, posicione o cursor "|" no local da página onde deseja que seja inserida a imagem.
Clique para ampliar
2. Clique no botão de Imagem SitePronto125.png.
Clique para ampliar
3. Será aberta a tela de formatação de imagem.

Clique no botão Localizar no Servidor.

Clique para ampliar
4. Será aberta a tela do Gerenciador de Arquivos.

Clique no botão Enviar arquivos.

Clique para ampliar
5. Será aberta a opção para envio de imagem ao servidor.

Clique no botão Procurar....

Clique para ampliar
6. Procure e selecione o arquivo da imagem em seu computador.

7. Para transmitir o arquivo para o servidor clique no botão Upload.

Atenção: O Site Pronto tem uma limitação de tamanho máximo de 2Mb para cada arquivo.

Sendo necessário reduzir o tamanho dos arquivos para no máximo 2Mb.

No caso de arquivo de imagem/foto o ideal é qua a imagem tenha apenas alguns Kb de tamanho, pois quanto maior o arquivo da imagem, maior o tempo para carregamento da imagem no site, fazendo com que a abertura do site seja lenta e tornando o site desinteressante aos visitantes devido a lentidão.

Clique para ampliar
8. Aguarde o processo de envio do arquivo da imagem para o servidor.

Quando for concluído será exibida uma mensagem informando o sucesso do envio do arquivo e o mesmo aparecerá na listagem de arquivos logo abaixo.

Clique para ampliar
9. Após clique no nome do arquivo para selecionar a imagem a ser inserida na página do Site Pronto.
Clique para ampliar
10. Será retornado para a tela de formatação de imagem onde já estará preenchido o local da imagem no servidor (URL) e a mesma será exibida no campo de pré-visualização (Preview).

Clique em OK para incluir a imagem na página.

Clique para ampliar
11. A imagem será inclusa na página na Área de Edição, no local em que estava posicionado o cursor "|".
SitePronto037.jpg
12. Se desejar pode ajustar o tamanho da imagem inserida.

Para redimensionar uma imagem, clique apenas uma vez na imagem para selecioná-la.

Note que ao redor da imagem aparecem alguns quadradinhos nos cantos e laterais.

Clique para ampliar
13. Clique em um dos quadradinhos, mantenha pressionado o botão do mouse, arraste na direção desejada para aumentar ou reduzir a imagem e solte quando a imagem estiver do tamanho desejado.

Utilize os quadadinhos dos cantos para redimensionar altura e largura ao mesmo tempo.

Clique para ampliar
Ou apenas um quadradinho de cima, baixo ou lateral para redimensionar somente altura ou largura.
Clique para ampliar
Atenção: Esse ajuste no dimensionamento da imagem pode deformar a imagem o ideal é já inserir a imagem no tamanho adequado.

Consulte Tamanho da Imagem e Redimensionar uma Imagem

14. Se desejar repita o procedimento para incluir outras imagens.

15. Quando terminar clique no botão Gravar.

Volt.png
Disponível em "http://wiki.splicenet.com.br/suporte/index.php?title=Inserir_Imagens_no_Site_Pronto&oldid=20699"
Ferramentas pessoais
Espaços nominais

Variantes
Ações
Navegação
Ferramentas