Alterar posição do título do banner

Bom dia a todos!

Como tenho quase zero conhecimento de CSS e JS gostaria de pedir uma ajuda:

Eu gostaria de alterar a posição do título do banner e remover a cor do fundo dele, deixar transparente. A ideia é poder utilizar o título como texto no banner, igual aos banners nesta loja (https://www.meugameusado.com.br).

Saberiam me auxiliar?

Ninguém já mexeu com isso? :frowning_face:

1 curtida

Vou tentar fazer pra você, amigo. Porém, preciso que coloque algum banner em PNG e também algum título.

1 curtida

Muito obrigado pela disposição Mateus!
O banner principal da página inicial está no formato PNG e com título como solicitou.

Porque a necessidade de ser no formato PNG?

Tinha postado o código que tinha feito mas ele estava com um detalhe errado.
Segue o código em que consegui o resultado desejado:

/* Alterar posicao do titulo do banner */
.info-banner.titulo {
    position: absolute;
    text-align: left;
    top: 25%;
    left: 60%;
    color: black;
    background-color: transparent !important;
}

No mobile o título não é mostrado mas acredito que seja o tema que estou utilizando. Que inclusive estou pensando em remover pois está me impedindo de fazer quase qualquer alteração no site.

1 curtida

É que havia pedido para deixar em PNG pois levei a parte de deixar parecido com o deles bem ao pé da letra. Eu queria literalmente fazer igual ao deles.

Mas que ótimo que conseguiu deixar do jeito que queria.

1 curtida

Muito obrigado pela disposição em ajudar!
O banner atual não é próprio para isso que desejo igual o deles, mas nos próximos já faço correto: PNG com uma imagem na esquerda e fundo transparente e aí o texto coloco utilizando o campo de título do próprio painel LI e com esse CSS ele já fica no canto direito.
Fica bem mais prático reaproveitar e criar banners.

1 curtida

No caso eu meio que ia fazer uma gambiarra, usaria o atual título do Banner para produzir o botão de “confira”. Já tinha até começado
image

1 curtida

Esse é meu próximo passo. Pode passar o código desse que começou? Que aí incorporo na modificação que fiz :grimacing: