Como adicionar CSS personalizado no EmbedFeed?
Teo avatar
Escrito por Teo
Atualizado há mais de uma semana

Neste artigo, você encontrará os códigos CSS mais usados e necessários que você pode aplicar manualmente aos seus widgets EmbedFeed.

O CSS personalizado pode ser aplicado dentro das configurações do widget. No canto inferior esquerdo, você encontrará a aba CSS personalizado (screenshot abaixo).

A seguir, estão os códigos CSS personalizados.


Imagem do cabeçalho, altura e largura:
.es-widget-header-image {
border: 3px dashed purple;
height: 100px;
width: 100px;
}

Caixa de feed, tamanho da borda e cor de fundo:
.esu-box {
border-radius: 30px;
border: none;
background-color: whitesmoke;
}


Nome de usuário da postagem no feed, tamanho da fonte:
.esu-username {
font-size: 18px;
text-transform: capitelize;
}


Data da postagem no feed, tamanho da fonte e cor:
.esu-date {
font-size: 16px;
color: #696b70;
}

Postagem no feed, raio da borda:

.esu-media-box {
border-radius: 30px;
}

Postagem no feed, opacidade do ícone de play:
.esu-play-icon circle {
fill-opacity: 1;
}

Postagem no feed, opacidade do logo:

.esu-logo path {fill-opacity: #000000;}

Postagem no feed, tamanho da fonte da legenda:
.esu-caption-text {
font-size: 16px;
-webkit-line-clamp: 4;
}


Postagem no feed, cor e decoração do "ver mais":
.esu-text-toggle {
font-size: 16px;
text-decoration: underline;
color: #0d0def;
}

Isto respondeu à sua pergunta?