ti-enxame.com

Use a tag HTML para negrito apenas algumas palavras de um item de menu

Estou tentando usar uma tag HTML no meu item de menu para obter um menu como este:

Menu principal

  • Meu submenu punho está em negrito
  • Meu segundo submenu é enfatizado

Se eu inserir, por exemplo, o <strong> no campo de título do menu, ele é removido quando eu salvo a página.

Mas se eu inserir [b]My fist submenu[/b] is in bold, a [b] tag não é removida.

Existe uma maneira de dizer ao Joomla para substituir [b] por um <strong> tag?

4
MagTun

Você tem algumas opções aqui.

Opção 1 seria fazer o que o @Bakual recomendou. Eu nunca tentei usar o ReReplacer, mas a extensão é desenvolvida e mantida por um desenvolvedor muito popular e bem elogiado; portanto, ela é obrigada a fazer o trabalho bem.

Opção 2:

Você pode desenvolver um pequeno plug-in e segmentar os itens de menu e substituir [b] com um <strong> tag usando algo como isto:

$item = //code to get menu items
$tag = array(
    '/\[b\](.*?)\[\/b\]/is',
);
$replace = array(
    '<strong>$1</strong>',
);
$output = preg_replace($tag, $replace, $item);

Opção

O amado método jQuery, que posso acrescentar, não é o método preferido, no entanto pode é o mais fácil. Algo semelhante a isso:

$('.nav li a').html(function (i, html) {
     return html.replace(/(\w+\s\w+\s\w+)/, '<strong>$1</strong>')
});

Espero que isto ajude

6
Lodder

Você pode usar o ReReplacer do NoNumber ( http://www.nonumber.nl/extensions/rereplacer ) para substituir essas coisas em cada carregamento de página. No entanto, eu não recomendaria neste caso.

Posso sugerir uma abordagem diferente para resolver isso? Nas opções do item de menu, você pode definir um "Link CSS Style" na guia "Link Type". Adicione uma classe CSS e aplique a formatação a essa classe. Como adicionar a classe CSS bold lá e defini-la no seu arquivo CSS de modelo como

.bold {
    font-weight:bold;
}

Isso deve funcionar sem precisar de HTML no item de menu.

10
Bakual

Você já usou o Maximenu CK? http://extensions.joomla.org/extensions/structure-a-navigation/menu-systems/drop-a-tab-menus/11578

Ele tem uma tonelada de funcionalidade extra, da qual você provavelmente não precisará, mas pode configurá-lo para um estilo despojado, para que você mesmo possa estilizar o css. De qualquer forma, a parte interessante disso é que você pode separar o texto do item de menu com quebras de tubo e adicionar automaticamente uma classe à metade que vem depois dos tubos.

Meu Menu || Item

Depois, você estiliza a coisa inteira para corresponder ao que deseja na seção "Meu menu" e substitui esses estilos usando a classe que foi aplicada à seção "Item".

Muito útil. Incidentalmente, o Maximenu também possui integração de menus móveis, campos de descrição e algumas outras opções interessantes.

O plug-in para celular pode ser encontrado aqui: http://extensions.joomla.org/extensions/extension-specific/extensions-specific-non-sorted/22662

3
Faye

Você tem certeza de que deve usar a tag strong?

strong não deve ser usado para deixar o texto em negrito. Idem a tag em. em é usado para aplicar ênfase (como lida) a um pedaço de texto e não para renderizá-lo em uma fonte em itálico. Se o que você deseja é que parte do texto do item de menu apareça com um peso de fonte maior, então b é uma escolha muito melhor.

No entanto, para ter controle total sobre o conteúdo dos itens de menu, posso recomendar o plugin JBType do Joomla Bamboo; http://www.joomlabamboo.com/joomla-extensions/jb-type-joomla-typography-plugin

Com ele, você pode simplesmente inserir o título do menu como:

Um item de menu com {jb_i} itálico {/ jb_i}

E o plugin renderizará a saída com tags em.

2
Seth Warburton

Como uma solução css pura, você pode usar nth-of-type() para direcionar os itens do submenu.

Para o meu teste local, esses seletores funcionaram para mim:

li.deeper > ul.nav-child > li.deeper:nth-of-type(1) > a {
    font-weight: bold;
}

li.deeper > ul.nav-child > li.deeper:nth-of-type(2) > a {
    font-style: italic;
}

enter image description here

Minha captura de tela mostra que:

  • O primeiro submenu está em negrito
  • O segundo submenu está em itálico
  • O terceiro submenu não possui estilo personalizado aplicado

Esses seletores podem ou não funcionar "imediatamente" para o seu projeto - os resultados podem variar dependendo da estrutura do menu e do estilo pretendido para outros submenus. Basta usar as ferramentas de desenvolvedor do navegador para inspecionar elementos e determinar as classes e hierarquia corretas para atingir os elementos desejados.

0
mickmackusa