Esconder ícone rede social que não tem link no JetEngine e Elementor

É possível configurar um “options page” no jetengine para adicionar links aos ícones de rede social do Elementor.

Para isso, criei um pagina de opções como abaixo:

Onde é possível adicionar o link de cada rede social pré-configurada.

Depois é só adicionar o widget “ícones sociais” na sua pagina, e usar a opção “tags dinâmicas” para vincular o campo na rede social correta.

Porem, as vezes pode ser que o cliente não quer preencher todas as redes sociais, isso pode deixar seu layout com um ícone mostrando, mas sem nenhum link associado.

Em CSS Personalizado, adicione esse código abaixo:

selector a {
    display: none;
}

selector a[href] {
    display: flex;
    margin-left: 24px;
}

selector .elementor-grid-item:nth-child(1) a {
    margin-left: 0px;
} /* CSS opcional para dar espaço entre os icones, pois com o código personalizado acima, não é possivel espaçar corretamente pelo editor do elementor */

O código acima, vai verificar se a rede social possui link atrelado ao ícone, se tiver ele exibe, se não ele oculta da pagina.