Como utilizar o rich text editor
Pode utilizar o editor de rich text para formatar e alterar o estilo do texto que surge na sua loja online.
Nesta página
- Onde utilizar o editor de rich text
- Adicionar conteúdo HTML com o editor de rich text
- Formatar texto com o editor de rich text
- Alterar as cores de texto com o editor de rich text
- Eliminar formatação no editor de rich text
- Inserir tabelas com o editor de rich text
- Inserir ligações com editor de rich text
- Adicionar ligações e ligações externas com o editor de rich text
- Ligação a um ficheiro no conteúdo da página
- Inserir imagens com o editor de rich text
- Mover e redimensionar uma imagem no editor de rich text
- Edite uma imagem no editor de rich text
- Inserir vídeos com o editor de rich text
- Insira os ficheiros de áudio no editor de rich text
- Adicione ou remova comentários internos no editor de rich text
- Onde utilizar o editor de rich text
- Formatar texto com o editor de rich text
- Inserir ligações com editor de rich text
- Onde utilizar o editor de rich text
- Formatar texto com o editor de rich text
- Inserir ligações com editor de rich text
Onde utilizar o editor de rich text
Pode utilizar o editor de rich text para adicionar ou editar o texto em diversos locais na sua loja:
Adicionar conteúdo HTML com o editor de rich text
Pode introduzir conteúdos HTML para as suas publicações no blogue, descrições de produto e descrições de coleção com o editor de rich text.
Clique no botão Mostrar HTML para visualizar o código HTML para o conteúdo no interior do editor de rich text:

Na vista de HTML, pode efetuar muitas alterações ao conteúdo no editor de rich text. Pode adicionar imagens, vídeos ou tabelas utilizando o HTML e pode depurar ou ajustar a disposição e o estilo do conteúdo.
Integrar um widget multimédia
Se pretender integrar um widget de música ou vídeo, deve em primeiro lugar hospedá-lo num serviço, como por exemplo, Youtube, Vimeo, ou SoundCloud. Estes serviços geram um código integrado que pode copiar e colar no seu editor de rich text do Admin Shopify.
Passos:
-
Encontre o código integrado para a multimédia que está a tentar integrar:
Selecione todo o código integrado fazendo clique sobre o mesmo e pressionando
ctrl
+A
num PC oucommand
+A
num Mac.Copie o código integrado pressionando
ctrl
+C
num PC oucommand
+C
num Mac.No seu Admin Shopify, clique no botão mostrar HTML no editor de rich text para o conteúdo que está a editar.
-
Cole o código integrado pressionando
ctrl
+V
num PC oucommand
+V
num Mac: Clique em Guardar na página que está a editar para guardar as suas alterações.
Formatar texto com o editor de rich text
Com o botão Formatação, pode rapidamente criar parágrafos, cabeçalhos ou blocos de citação. Utilizar os níveis de cabeçalho e formatação corretos pode ajudar as pessoas e os motores de pesquisa a ler o conteúdo do seu website.
Para escolher um formato para texto, destaque o texto e, em seguida, clicar no botão Formatação:

Opções de formatação
-
Parágrafo
A maioria do conteúdo de texto no seu website é texto de parágrafo. O texto de parágrafo possui um tamanho de letra de 10–12 pt, mas alguns temas utilizam tamanhos de texto diferentes.
-
Cabeçalho (1-6)
Os cabeçalhos são utilizados para estruturar conteúdos. Existem 6 níveis de cabeçalho. O Cabeçalho 1 é o nível mais importante e o Cabeçalho 6 é o menos importante.
-
Bloco de citação
Um bloco de cotações é utilizado para apresentar texto que está atribuído a outra pessoa, como por exemplo, uma citação ou um excerto de um livro ou website.
Texto a negrito
Para criar texto a negrito, destaque o texto e clique no botão Negrito:

Colocar em itálico
Para criar texto em itálico, destaque o texto e clique no botão Itálico:

Criar uma lista com marcas
Para criar uma lista com marcas, clique no botão Lista com marcas:

Pode escrever para criar itens da lista com marcas:
Para criar novos itens de lista, pressione a tecla enter
ou return
. Para concluir a lista, pressione a tecla enter
ou return
duas vezes.
Criar uma lista numerada
Para criar uma lista numerada, clique no botão Lista numerada:

Pode escrever para criar itens de lista numerada:
Para criar novos itens de lista, pressione a tecla enter
ou return
. Para concluir a lista, pressione a tecla enter
ou return
duas vezes.
Texto avançado
Para avançar um texto, clique no botão Avançar:

Avançar um parágrafo vai dar-lhe uma margem do lado esquerdo.
Texto sem avanço
Para colocar um parágrafo sem avanço ou diminuir o avanço, clique no botão Diminuir avanço:

Diminuir o avanço de um parágrafo remove o avanço de quaisquer margens com avanço.
Alinhar texto

Para alinhar texto, selecione o texto, clique no botão Alinhamento e escolha Alinhar à esquerda, alinhar ao centro ou Alinhar à direita:

Alterar as cores de texto com o editor de rich text
Passos:
-
Destaque o texto e clique no botão Cor:
-
clique numa cor para alterar o texto "destacado" para essa cor:
Alterar as cores do texto de fundo
Passos:
-
Destaque o texto e clique no botão Cor:
-
Clique em cor de fundo…:
-
Clique numa cor para alterar o fundo do texto destacado para essa cor:
Eliminar formatação no editor de rich text
Para remover a formatação de texto ou imagens, destaque o conteúdo e clique no botão Eliminar formatação:

Inserir tabelas com o editor de rich text
Pode inserir tabelas nas suas publicações no blogue, páginas, produto, descrições e descrições de coleções com o editor de rich text. Pode colocar texto, imagens ou até vídeos na tabela após a ter criado.
Passos:
-
No editor de rich text, clique no botão Inserir tabela:
-
Clique em Inserir tabela para inserir uma tabela:
Isto cria uma tabela com uma fila e uma coluna.
Quando criar uma tabela, clique no botão Inserir tabela novamente, para modificar as filas e colunas da tabela:
- Inserir fila acima: Coloque o seu cursor numa fila e clique neste botão para inserir uma nova fila acima.
- Inserir fila abaixo: Coloque o seu cursor numa fila e clique neste botão para inserir uma nova fila abaixo.
- Inserir coluna antes: Coloque o seu cursor numa coluna e clique neste botão para inserir uma nova coluna abaixo.
- Inserir coluna depois: Coloque o seu cursor numa coluna e clique neste botão para inserir uma nova coluna acima.
- Eliminar fila: coloque o cursor na fila que deseja eliminar e clique neste botão.
- Eliminar coluna: Coloque o cursor na coluna que pretende eliminar e, em seguida, clique neste botão.
- Eliminar tabela: Coloque o cursor em qualquer posição na tabela e, em seguida, clique neste botão para eliminar toda a tabela.
Inserir ligações com editor de rich text
Pode inserir ligações (hiperligações) em publicações no blogue, páginas, descrições de produto e descrições de coleção com o editor de rich text. Pode adicionar ligações que dirigem clientes para páginas dentro da sua loja online da Shopify e para outros websites. Pode também adicionar ligações que abrem mensagens de e-mail ou fazer chamadas telefónicas para ajudar os clientes a entrar em contacto consigo.
Passos:
Destaque o texto ou imagem que deseja transformar numa ligação.
Clique em Inserir ligação.
Introduza o URL de destino para a ligação no campo Ligar a:
- Para ligar a um website externo que se encontra fora da sua loja Shopify, introduza http://
seguido do endereço web, por exemplo http://www.example.com
.
- Para ligar a uma página na sua loja online Shopify, introduza o URL breve, por exemplo /collections/summer-collection
.
- Para criar uma ligação que abre uma mensagem de e-mail, introduza mailto:
seguido do endereço de e-mail, por exemplo mailto:example@example.com
.
- Para criar uma ligação, que efetua uma chamada telefónica tel:
, seguido de um número de telefone, por exemplo tel:+0-123-456-7890
.
Introduza uma breve descrição da ligação na caixa Título da ligação.
Escolha como a ligação vai abrir no menu Abrir esta ligação em:
- a mesma janela: A ligação será aberta numa janela ou separador do navegador existente do utilizador. - a mesma janela: A ligação será aberta numa nova janela ou separador do navegador.
- Clique em Inserir ligação para converter o seu texto destacado numa ligação.
Adicionar ligações e ligações externas com o editor de rich text
Ligações para as páginas dentro da sua loja Shopify são denominadas ligações internas. Pode utilizar URL breves para criar ligações internas. Por exemplo, o URL /collections
vai direcionar para as páginas de coleções da sua loja.
Para ligar a uma página específica da sua loja online, como por exemplo, uma coleção ou página de produto, utilize o formato URL /page-type/page-handle
. Por exemplo, para ligar a uma coleção que criou denominada coleção de verão, utilize o URL /collections/summer-collection
.
Ligações a websites que estão fora da sua loja Shopify são denominadas ligações externas. As ligações externas devem ser introduzidas por completo e começar com http://
.
Ligação a um ficheiro no conteúdo da página
Após carregar um ficheiro, pode efetuar ligação aos conteúdos no editor de rich text para torná-los disponíveis para transferência a partir de um produto ou descrição de coleção, página web ou publicação no blogue.
Passos:
- A partir do admin Shopify, aceda a Definições > Ficheiros.
- A partir da aplicação da Shopify, aceda a Loja > Definições.
- Em Definições de loja, toque em Ficheiros.
- A partir da aplicação da Shopify, aceda a Loja > Definições.
- Em Definições de loja, toque em Ficheiros.
Copie o URL para o ficheiro ao qual deseja efetuar ligação.
No seu Admin Shopify, clique no produto, coleção, página web ou publicação no blogue onde pretende adicionar o ficheiro.
No editor de rich text, introduza ou escolha o texto de ligação. Por exemplo, pode adicionar uma ligação a uma tabela de medidas em PDF a partir do texto de ligação.
Click here to download our sizing chart.
Selecione o texto de ligação.
-
Clique em Inserir ligação:
No campo Ligar a, cole o URL para o ficheiro que deseja ligar.
- Clique em Inserir ligação. No editor de rich text, o texto ligado aparece em azul e sublinhado.
Inserir imagens com o editor de rich text
Existem três formas de inserir uma imagem utilizando o editor de rich text. Pode:
- carregar imagens
- escolha a partir das suas imagens de produto
- utilize um URL de imagem pública.
Carregar imagem
Passos:
-
No editor de rich text, clique no botão Inserir imagem:
Na caixa de diálogo Inserir imagem, clique no separador Imagens carregadas.
-
Clique em Carregar ficheiro:
Escolha um ficheiro de imagem JPG ou PNG a partir do seu computador.
-
Clique na imagem que pretende carregar para a selecionar:
-
A partir do menu Tamanho a inserir, selecione o tamanho de apresentação da imagem. Pode selecionar Original para inserir a imagem sem alterar o seu tamanho de apresentação.
Clique em Inserir imagem para colocar a imagem no editor de rich text.
Escolher a partir de imagens de produto
Passos:
-
No editor de rich text, clique no botão Inserir imagem:
Na caixa de diálogo Inserir imagem, clique no separador Imagens de produto
-
clique na imagem que pretende inserir:
Se não vir a imagem de produto que pretende inserir, então pode utilizar os botões de seta para pesquisar em páginas diferentes:
-
A partir do menu Tamanho a inserir, selecione o tamanho de apresentação da imagem. Pode selecionar Original para inserir a imagem sem alterar o seu tamanho de apresentação.
Clique em Inserir imagem para colocar a imagem de produto no editor de rich text.
Utilizar um URL de imagem
Para inserir uma imagem utilizando um URL público:
-
No editor de rich text, clique no botão Inserir imagem:
Na caixa de diálogo Inserir imagem, clique no separador URL.
-
Introduza um URL publicamente acessível do seu ficheiro de imagem:
Clique em Inserir imagem para inserir a imagem no editor de rich text no seu tamanho original.
Mover e redimensionar uma imagem no editor de rich text
Após adicionar uma imagem a uma descrição de produto ou coleção, página web ou um blogue, pode movê-la para outra localização no conteúdo.
Passos:
No seu Admin Shopify, clique no produto, coleção, página web ou publicação no blogue que inclui a imagem que pretende mover ou redimensionar.
No editor de rich text, clique na imagem.
Faça as suas alterações:
- Para mover a imagem, clique e arraste-a para outra localização no campo Conteúdo. - Para redimensionar a imagem, clique e arraste um dos cantos.
- Clique em Guardar.
Edite uma imagem no editor de rich text
Também pode alterar o tamanho, ajustar o texto e alinhar uma imagem dentro do editor de rich text. Também pode editar um URL de imagem ou adicionar ou editar o texto alternativo da imagem.
Passos:
Faça duplo-clique na imagem no editor de rich text para abrir a caixa de diálogo Editar imagem.
Utilize as opções de tamanho e alinhamento para editar uma imagem:
- Para alterar o tamanho da imagem, selecione a opção de tamanho. - Para alterar a imagem, um novo URL de imagem. - Para melhorar o SEO e acessibilidade da sua loja online, adicionar ou edite o texto alternativo da imagem. - Para adicionar espaçamento, introduza o número de píxeis de espaço que pretende de cada lado. - Para alterar o alinhamento da imagem, selecione a partir dos ícones que representam o alinhamento à esquerda, centro ou direita. - Para adicionar moldagem de texto, consulte Ajustar o texto em volta da imagem.
- Clique em Editar imagem para guardar as suas alterações.
Inserir vídeos com o editor de rich text
Pode inserir ligações ou integrar vídeos em publicações no blogue, páginas, descrições de produto e descrições de coleção utilizando o editor de rich text.
Se desejar integrar um vídeo que criou, em primeiro lugar deve carrega-lo para um site de streaming de vídeo, como por exemplo Youtube ou Vimeo.
O Youtube não lhe permite desativar vídeos relacionados, mas pode especificar que os vídeos relacionados devem partir do mesmo canal que o vídeo que acabou de reproduzir.
Passos:
-
Copiar o URL do vídeo pressionando
ctrl
+C
num PC oucommand
+C
num Mac. -
Visite Embed Responsively. A Embed Responsively é uma ferramenta que lhe vai dar um código de integração melhorado para o seu vídeo.
Na Embed Responsively, clique para selecionar o website do vídeo onde o vídeo está localizado.
Cole o URL do vídeo que copiou para a caixa de URL da página em Embed Responsively pressionando
ctrl
+V
num PC oucommand
+V
num Mac.Clique em Embed. A Embed Responsively vai criar um código de integração para si.
Se o vídeo for do YouTube e desejar apresentar apenas vídeos relacionados do mesmo canal do YouTube então localize o URL do vídeo no código integrado. Copie e cole
?rel=0
no final e dentro das aspas:Copie todo o código no interior da caixa Integrar código.
-
No seu Admin Shopify, clique no botão Inserir vídeo no editor de rich text:
Cole o código integrado na caixa de diálogo Inserir vídeo.
Clique em Inserir vídeo.
Clique em Guardar quanto vier concluído para guardar as suas alterações para o item que está a editar.
Insira os ficheiros de áudio no editor de rich text
Pode utilizar o editor de rich text para inserir ou integrar ficheiros de áudio nas publicações no blogue, páginas, descrições de produto e descrições de coleção.
Passos:
A partir de Admin Shopify, clique em Definições e, em seguida, clique em Ficheiros.
Clique em Carregar itens para carregar o ficheiro de áudio que pretende inserir ou integrar na sua loja.
A partir da secção Loja online, abra o editor de rich text para a página ou publicação no blogue que pretenda que tenha o ficheiro de áudio.
Copie
<div id="player"><audio controls="controls">
e cole o código no editor de rich text para integrar um leitor de áudio na sua página.-
Copie o código que se segue:
<source src="https://cdn.shopify.com/s/files/1/0220/2378/files/example.mp3" type="audio/mpeg" /></div>
Cole este código no seu editor de rich text após o código para o leitor de áudio e, em seguida, substitua
https://cdn.shopify.com/s/files/1/0220/2378/files/example.mp3
com o URL que criou para o seu ficheiro áudio quando o atualizou para o Shopify. Pode encontrar o URL do seu ficheiro áudio a qualquer momento na página Ficheiros. Clique em Guardar.
Clique em Ver para garantir que o seu ficheiro áudio é reproduzido corretamente.
Adicione ou remova comentários internos no editor de rich text
Pode utilizar a etiqueta de comentários <!--
e -->
para texto interno que não deseja publicar para a sua loja.
Passos:
No seu editor de rich text editor, clique no botão Mostrar HTML.
Para adicionar um comentário interno, inclua o texto que pretende manter oculto em
<!--
e-->
. Por exemplo:<!--yourtext-->
.Clique em Guardar.
As tags de HTML incluídas com as etiquetas comentários são guardadas como texto interno. Para essas tags de HTML funcionarem corretamente, deve remover as etiquetas de comentários <!--
e -->
à volta das mesmas.
Onde utilizar o editor de rich text
Atualmente, pode utilizar o editor de rich text na Aplicação Shopify para adicionar descrições aos seus produtos. Se pretender adicionar texto às páginas, blogues ou coleções, então deve fazê-lo a partir do seu Admin Shopify num navegador web.
Formatar texto com o editor de rich text
Pode utilizar o editor de rich text para formatar o seu texto de diversas formas:
- Texto a negrito
- Colocar em itálico
- Sublinhar texto
- Alinhar texto
- Criar listas
Texto a negrito
Para colocar o seu texto a negrito, destaque o texto e toque no botão de negrito:
Colocar em itálico
Para colocar o seu texto em itálico, destaque o texto e, em seguida, toque no botão de itálico:
Sublinhar texto
Para sublinha o seu texto, destaque o texto e, em seguida, toque no botão sublinhar:
Alinhar texto
Passos:
- A partir do editor de texto, destaque o texto que pretende alinhar.
- Toque no botão de alinhamento:
- Toque numa das opções de alinhamento para selecionar o alinhamento à esquerda, alinhamento ao centro ou alinhamento à direita.
Criar listas
Pode utilizar o editor de texto parar adicionar listas numeradas e com marcas ao seu texto.
Passos:
A partir do editor de texto, toque no botão de lista para mostrar as duas opções de lista:
Toque na opção de lista com marcas ou lista numerada para selecionar o tipo de lista que deseja adicionar.
Introduza a sua lista de itens. Após cada item, toque em enter para se mover para a próxima linhas e introduzir outro item.
Quando tiver terminado de introduzir a sua lista toque em enter duas vezes.
Inserir ligações com editor de rich text
Pode utilizar o editor de texto para adicionar ligações ao seu texto:
A partir do editor de texto, selecione as palavras que deseja tornar numa ligação.
Toque no botão de ligação:
A partir do ecrã Inserir ligação, introduza o URL da ligação.
Introduza um título de ligação que é utilizado para acessibilidade e SEO.
Por predefinição, o destino da ligação vai abrir na mesma janela. Para definir uma ligação para abrir numa janela diferente, ative a opção Abrir ligação numa nova janela.
Tocar em Guardar.
Criar ligações internas e externas
Ligações para as páginas dentro da sua loja Shopify são denominadas ligações internas. Pode utilizar URL breves para criar ligações internas. Por exemplo, o URL /collections
vai direcionar para as páginas de coleções da sua loja.
Para ligar a uma página específica da sua loja online, como por exemplo, uma coleção ou página de produto, utilize o formato URL /page-type/page-handle
. Por exemplo, para ligar a uma coleção que criou denominada coleção de verão, utilize o URL /collections/summer-collection
.
Ligações a websites que estão fora da sua loja Shopify são denominadas ligações externas. As ligações externas devem começar com http://
.
Onde utilizar o editor de rich text
Atualmente, pode utilizar o editor de rich text na Aplicação Shopify para adicionar descrições aos seus produtos. Se pretender adicionar texto às páginas, blogues ou coleções, então deve fazê-lo a partir do seu Admin Shopify num navegador web.
Formatar texto com o editor de rich text
Pode utilizar o editor de rich text para formatar o seu texto de diversas formas:
- Texto a negrito
- Colocar em itálico
- Sublinhar texto
- Alinhar texto
- Criar listas
Texto a negrito
Para colocar o seu texto a negrito, destaque o texto e toque no botão de negrito:
Colocar em itálico
Para colocar o seu texto em itálico, destaque o texto e, em seguida, toque no botão de itálico:
Sublinhar texto
Para sublinha o seu texto, destaque o texto e, em seguida, toque no botão sublinhar:
Alinhar texto
Passos:
- A partir do editor de texto, destaque o texto que pretende alinhar.
- Toque no botão de alinhamento:
- Toque numa das opções de alinhamento para selecionar o alinhamento à esquerda, alinhamento ao centro ou alinhamento à direita.
Criar listas
Pode utilizar o editor de texto parar adicionar listas numeradas e com marcas ao seu texto.
Passos:
A partir do editor de texto, toque no botão de lista para mostrar as duas opções de lista:
Toque na opção de lista com marcas ou lista numerada para selecionar o tipo de lista que deseja adicionar.
Introduza a sua lista de itens. Após cada item, toque em enter para se mover para a próxima linhas e introduzir outro item.
Quando tiver terminado de introduzir a sua lista toque em enter duas vezes.
Inserir ligações com editor de rich text
Pode utilizar o editor de texto para adicionar (hiperligações) ao seu texto:
A partir do editor de texto, selecione as palavras que deseja tornar numa ligação.
Toque no botão de ligação:
A partir do ecrã Inserir ligação, introduza o URL da ligação.
Introduza um título de ligação que é utilizado para acessibilidade e SEO.
Por predefinição, o destino da ligação vai abrir na mesma janela. Para definir uma ligação para abrir numa janela diferente, ative a opção Abrir ligação numa nova janela.
Toque na marca de verificação para guardar as suas ligações.
Criar ligações internas e externas
Ligações para as páginas dentro da sua loja Shopify são denominadas ligações internas. Pode utilizar URL breves para criar ligações internas. Por exemplo, o URL /collections
vai direcionar para as páginas de coleções da sua loja.
Para ligar a uma página específica da sua loja online, como por exemplo, uma coleção ou página de produto, utilize o formato URL /page-type/page-handle
. Por exemplo, para ligar a uma coleção que criou denominada coleção de verão, utilize o URL /collections/summer-collection
.
Ligações a websites que estão fora da sua loja Shopify são denominadas ligações externas. As ligações externas devem começar com http://
.