> For the complete documentation index, see [llms.txt](https://wiki.spiritshop.com.br/suporte-admin-3.0/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.spiritshop.com.br/suporte-admin-3.0/home-banner-paginas-e-blog/cadastrar-um-banner-para-versao-desktop-e-mobile.md).

# Cadastrar um Banner para versão Desktop e Mobile

Neste tutorial você irá aprender como cadastrar um **Banner Principal** para versão **Desktop** e tambem para **versão Mobile** em sua loja virtual.

### 1 - Entre com seu **Login** e **Senha** no A**dmin** de sua Loja.

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2F9rUZkfsmpnH9JmxnOuEA%2Fimage.png?alt=media&amp;token=0ed5def4-0015-4ae6-ab88-b5e5bac76f03" alt=""><figcaption></figcaption></figure></div>

* 2 - Navegue em **Design → Banners** no menu principal.

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2FzvjW6aHygNPgAYqaS3xG%2FCaptura%20de%20Tela%202025-01-28%20a%CC%80s%2014.19.33.png?alt=media&amp;token=a852d7aa-8d7d-4388-a509-17739020872d" alt=""><figcaption></figcaption></figure></div>

* 3 - Selecione a área do Banner principal (**Principal - Home**) e clique em **Editar**.

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2FkQGnkl942LwWtt0i6z53%2FCaptura%20de%20Tela%202025-01-28%20a%CC%80s%2014.30.41.png?alt=media&amp;token=8c52ddba-fd5f-4997-93ff-7293419ee3fa" alt=""><figcaption></figcaption></figure></div>

### 2 - Cadastre seu Banner.

* 4 - Clique em **Imagem Desktop** para adicionar seu novo Banner (**Desktop** e **Mobile**).

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2FEWKk2YGXtaBkm67pmb9z%2Fimage.png?alt=media&amp;token=1d3963a7-a418-42c3-b1bd-af6598973655" alt=""><figcaption></figcaption></figure></div>

* Basta clicar em editar e **fazer o upload de suas imagens em uma pasta no servidor** e selecionar as imagens desktop e mobile do Banner e depois clicar em **Salvar**.&#x20;

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2FPmwTingncz3YrWd05whq%2Fimage.png?alt=media&amp;token=2076fe2f-26e3-42b0-b442-c6a61ed4230b" alt=""><figcaption></figcaption></figure></div>

***

### 3 - Atualize o cache dos Banners

* ( **ATENÇÃO** ) → Após alterações nesse módulo você precisa atualizar o **Cache dos Banners** da Home de sua Loja:\
  \- Na página inicial do seu **Admin**, encontre o botão **Mais Ações** no canto superior direito e siga os passos da imagem abaixo.

<div data-full-width="true"><figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2FJ3Cp2SXbXl7hNtogL31u%2Fimage.png?alt=media&amp;token=c7313c34-4be3-4135-9bab-20b9084bad53" alt=""><figcaption></figcaption></figure></div>

* Marque a caixa de seleção \[**Banner's**], digite a **URL da página inicial** de sua Loja e clique em **Limpar**.

<figure><img src="https://2105237181-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZkzZVMxLiuvqRO6xv6kx%2Fuploads%2F81isBTbveKHSHPKJbmW3%2Fimage.png?alt=media&amp;token=68f3308e-b2c3-4011-bce0-a7b9886d42e7" alt=""><figcaption></figcaption></figure>

&#x20;