Como posso replicar os links do banner meta?

Dev
1

image
image1612×428 48.8 KB

Como posso criar 4 botões: Personalizar, Guia, Tópicos em alta, Nossa hospedagem

2 curtidas
2

No componente de tema do banner de pesquisa, existem dois pontos de extensão de plugin que você pode direcionar para conteúdo personalizado em um componente personalizado separado que você pode criar.

4 curtidas
3

Qual é o search_banner.search_button_text
Como posso criar um botão igual à foto?

image
image1612×428 48.8 KB

4

Obrigado! Não consegui encontrar a opção para inserir este código em personalização.
Você pode me guiar, por favor? :pray:

5

Vou criar um componente de tema. :+1:

8 curtidas
7

Bem, tudo bem, Don. É tudo sobre aprender e compartilhar. Acho que seria uma boa ideia informar nossa intenção desde o início, da próxima vez. Obrigado por compartilhar. :+1:

Na verdade, tenho trabalhado nisso desde ontem[1]. Fiz algo semelhante, mas ainda não postei. Quero adicionar mais opções de personalização, como a capacidade de escolher entre emojis, ícones do Font Awesome ou URLs de imagem, mas também CSS por botão, renderização condicional e coisas assim. Para isso, tenho explorado e testado muito o formato JSON schema (e é uma dor de cabeça - em tempo, este PR para melhorar o estilo será incrível!). Postarei silenciosamente minha versão no Github mais tarde.

  1. image
    image477×499 35.1 KB
    ↩︎

9 curtidas
8

Você teve algum sucesso? Eu tentei construir um, mas fiquei preso.

3 curtidas
9

Olá @Arkshine, você tem alguma atualização sobre este componente? Seria incrivelmente útil para mim também :innocent:

2 curtidas
10

Eu esqueci completamente, desculpe. :smile:

Infelizmente, o formato de esquema JSON para as configurações logo será descontinuado, então o que eu originalmente queria fazer não funcionará mais (e a personalização com ele era muito complicada, para ser honesto).

Eu queria postar a versão do Don, mas não consigo encontrar o repositório dele. :thinking:

Vou ver o que posso fazer para postar uma versão funcional o mais rápido possível. :+1:

3 curtidas
11

Muito obrigado! :pray:t2:

2 curtidas
12

@Helga_Razinkova

Você pode tentar? Créditos para @Don e @manuel – Eu peguei algumas ideias deles.

Requer uma versão recente do Discourse (3.3), pois depende do novo Objects type for theme setting.

Algumas imagens

Configurações gerais:

image
image616×907 15.9 KB

Configurações de link:

image
image1090×1036 34.4 KB

A aparência padrão – usa a cor do tema.
image

O botão pode ser estilizado separadamente:
image

Me avise se precisar de configurações específicas.
Pode precisar de alguns ajustes para dispositivos móveis. Por padrão, os botões se quebram e são exibidos em uma coluna no celular. Aguardo qualquer feedback.

Se tudo estiver bem, eu o lançarei mais tarde. :+1:

7 curtidas
13

@Arkshine Desculpe pelo atraso, acabei de ter essa ideia :slight_smile:

Consegui adicionar os botões, muito obrigado por este plugin!! O único desafio agora é colocar os botões logo após a barra de pesquisa, mas espero que encontremos uma solução.

Uma pergunta: é possível tornar o campo Emoji opcional em vez de obrigatório?

Obrigado mais uma vez!

2 curtidas
14

Ei, obrigado por testar o componente!

Atualizei para tornar o emoji opcional. :+1:

Você quer dizer que está usando o componente Banner Search e quer que o botão apareça abaixo?
Se sim, na configuração plugin outlets, você pode defini-lo como below-site-header.
Talvez você precise ajustar o espaçamento com algum CSS, no entanto.

Me avise se precisar de ajuda adicional. :slight_smile:

1 curtida
15

Olá, acho que Helga está procurando por este plugin outlet. :slightly_smiling_face:

4 curtidas
16

Com certeza!

Por algum motivo, presumi que o componente Plugin Outlet os mostraria (esqueci como o componente os gera). Obrigado por me corrigir. :+1:

Precisarei ajustar as configurações para que funcione com os component outlets e para facilitar a personalização do espaçamento. Atualizarei você em breve, Helga.

3 curtidas
17

Incrível, muito obrigado pela ajuda, @Arkshine @Don! :fire: :fire:

2 curtidas
18

Desculpe pela demora! Atualizei o componente. Adicionei várias novas configurações.

No seu caso, você quer usar search-banner-below-input na configuração plugin_outlet.
Ele aparecerá agora logo abaixo:

image
image1206×356 24.5 KB

Se preferir, agora você pode definir uma largura máxima para o contêiner:

image
image654×303 14.2 KB

Aqui estão as configurações que usei:

image
image740×128 2.68 KB

A imagem mostra um elemento de interface do usuário rotulado como "buttons wrapper max width" com um controle deslizante e um campo de entrada numérica permitindo ao usuário definir uma largura máxima de 600 pixels, juntamente com um botão "reset". (Legenda por IA)

Existem outras configurações, incluindo algumas para a visualização móvel.

Me diga se funciona bem para você. :+1:

2 curtidas
19

Oh meu Deus, @Arkshine, você é uma estrela!! Muito obrigado, tudo parece incrível agora! :heart_eyes:

2 curtidas
20

Muito inteligente como as configurações deste componente temático estão organizadas, @Arkshine! Como sempre, você fornece outro excelente ponto de partida e modelo para os construtores de componentes iniciantes da comunidade!

MUITO, MUITO OBRIGADO, meu amigo!

4 curtidas
21

Ótimo Componente de Tema - e definitivamente merece seu próprio tópico!

Talvez devêssemos reformular este para esse fim? Ou criar um novo?

2 curtidas