Incorpore um vídeo personalizado em sua página

Além de incorporar conteúdo do YouTube e Vimeo, o GemPages permite que você use código personalizado para adicionar mídia de outros serviços de hospedagem.

Envie seu vídeo para um servidor de hospedagem

Neste caso, usaremos o Shopify CDN (Content Delivery Network) como host.

Etapa 1Aceda a Administrador do Shopify > Conteúdo > Arquivos.

Etapa 2: Clique no "Fazer upload de arquivos” no canto superior direito. 

Etapa 3: Selecione o arquivo para enviar do seu dispositivo.

Etapa 4: Após o término do upload, copie o URL clicando no cadeia ícone.

Incorpore o vídeo na sua página

A partir deste ponto, as etapas podem diferir com base na versão específica do Editor de GemPages que você está usando. Por favor, localize as instruções que correspondem à sua Versão e prossiga com os seguintes passos de acordo.

versão 6

Etapa 1: No Painel GemPages, clique na página escolhida e digite o editor.

Etapa 2: Procure por Liquid elemento para arrastá-lo e soltá-lo na sua página.

Etapa 3: Clique com o botão direito do mouse no Liquid elemento e selecione “Editar Código".

Etapa 4: Selecione uma opção para copiar e colar o código na janela Editor de código.

Reprodução automática com controles de navegação:

<video poster="" loop="" muted="" playsinline="" controls="" autoplay="" src="ABCDEF" width="100%"></video>

Reprodução automática sem controles de navegação:

<video poster="" loop="" muted="" playsinline="" autoplay="" src="ABCDEF" width="100%"></video>

Sem reprodução automática, sem loop e com controles de navegação:

<video poster="YYYYY" controls="" playsinline="" src="ABCDEF" width="100%"></video>

Substituir ABCDEF com a URL que você copiou do servidor de hospedagem.

Para a terceira opção, como o arquivo não será reproduzido automaticamente, você pode configurar uma imagem em miniatura para ele. Para fazer isso, substitua AAAAA com a URL da sua imagem.

Etapa 5: Bater "Economize” e saia do editor de código.

Etapa 6: Bater "EconomizeePublicar".

versão 7

Etapa 1: A partir do Painel GemPages > PÁGINAS, localize a página de destino para abrir o editor.

Etapa 2: Entrar código personalizado na barra de pesquisa na barra lateral esquerda e arraste e solte no local de sua preferência. 

Etapa 3: Localize o elemento para revelar o Configurações aba. A partir daqui, sob o Código personalizado seção, clique em Adicionar código para abrir o painel de código.

Passo 4: No painel de código, cole o seguinte código no HTML/Líquido aba.

• Reprodução automática com controles de navegação:

<video poster="" loop="" muted="" playsinline="" controls="" autoplay="" src="ABCDEF" width="100%"></video>

• Reprodução automática sem controles de navegação:

<video poster="" loop="" muted="" playsinline="" autoplay="" src="ABCDEF" width="100%"></video>

• Sem reprodução automática, sem loop e com controles de navegação:

<video poster="YYYYY" controls="" playsinline="" src="ABCDEF" width="100%"></video>

Substituir ABCDEF com a URL que você copiou do servidor de hospedagem.

Para a terceira opção, como o arquivo não será reproduzido automaticamente, você pode configurar uma imagem em miniatura para ele. Para fazer isso, substitua AAAAA com a URL da sua imagem.

Etapa 5: Uma vez feito isso, clique em Economize botão para salvar suas alterações e fechar o painel de código.

Passo 6: Salve e republique sua página para publicar suas alterações na vitrine.

Mais guias para ajudá-lo a dominar o GemPages podem ser encontrados aqui..