A Quest ao menú perfecto ...

Esta é a parte 1 do tutorial
Parte 2 deste tutorial ensina como construír + menú vertical da paleta de cor escura para a horizontal

Eu decidín ir tema da tese , porque un dos meus clientes me informou sobre problemas de compatibilidade entre a Tese ea miña adhesión plugin wordpress sitio MemberWing. Fixei-lo e entón decidir un ollo na tese e realmente preocupou en asistir vídeos na páxina do sitio principal tese - Diythemes.com .
O que me impresionou máis é a atención ao detalle, facilidade de uso e características de SEO, por riba de todo - que son tan ben pensado.
plugin adhesión MemberWing foi designado desde o principio para os locais da sociedade que precisa puxar como zume de SEO posible. Entón eu paguen moita atención ao gran número de melloras en SEO e perfeições MemberWing. Moitos dos meus propios clientes están pregunta sobre diferentes temas de usar e con tema que foi tan ben SEO optimized do interior profundo sería un axuste excelente para adherirse empresarios portal.

SEO Información poderes de MemberWing con poderes de SEO tema da tese daría o mellor valoración de oportunidades para os meus clientes. Entón, eu teño de Teses e chanceou con el por un día.

É un excelente tema de todas as maneiras. A parte de navegación do que é un pouco limitado a función. A partir da tese de 1.5 + é un menú único nivel. O meu desexo sempre é ser capaz de personalizar a navegación, tanto como sexa necesario. Algúns sitios teñen poucas páxinas, moitos outros teñen de toneladas de páxinas estáticas + zilhões de artigos / posts + lotes de categorías.
Así, no mundo ideal de ter a oportunidade de crear mirando agradable organizados xerarquicamente menú de navegación do usuario agradable é unha obriga. Tese dereita fóra do pau ten boa procura de navegación, pero notei que todos os sitios Tese baseados son parecidos cos xemelgos. Personalizado o menú de navegación tese non é realmente fácil así a maioría da xente simplemente deixar la como está. Non hai ningunha forma de cambiar a orde das categorías no menú ou posiciona-los entre as páxinas. E, de novo, a capacidade de crear estruturas aniñados menú está en falta. Entón eu decidimos ver o que podería ser feito sobre iso.
Despois de probar a metade ducia menú / navegación plugins relacionados pus a miña elección na lista de navegación WordPress Plugin TAVN .
plugin TAVN é esencialmente xerador de lista non ordenada con super chic e un pouco difícil de imaxinar interface admin untraditional. O erro sobre el é que realmente non crear menús fantasía buscar por si mesmo. El fai a parte máis difícil do traballo - aínda que lle dá a capacidade de reunir visual, e xerar a lista non ordenada - o esqueleto do seu menú a ser. E podes crear menús de moitos tamén. Podes puxar todo tipo de cousas WordPress para o menú de navegación: páxinas, artigos, artigos, categorías, usuarios, bloques de código, as ligazóns externas, anteparos, separadores e mesturar e combinar e niño e organizar e personalizar-los en calquera estrutura de árbore que quere.
TAVN xera para ti resultou HTML lista non ordenada. Segundo a beleza da TAVN é que axuda a introducir o seu novo menú no seu tema a través de lóxica baseado JQuery famoso, pero sen necesidade de cambiar calquera código! TAVN permite que especifique: "substituír este elemento # menú TAVN co meu novo". # Elemento podería ser unha id ou clase de camiño de menú existente ou tag div elemento que está a ser xerado polo seu tema actual. Entón TAVN fai esta substitución para ti, sen forza-lo a ir en código tema e facelo máis confuso que xa é. Se iso todo soa como o argot - non te preocupes - Vou guía-lo paso a paso en breve. A parte reto da TAVN para todos é que vai ter que vir cara arriba con CSS reais + imaxes + código JavaScript para o seu menú de si mesmo. E cabe a descubrir onde e como integrar estes arquivos e facer ese material chegar correctamente conectados entre si.
Saúdos sen saber JQuery + PHP + alguns + CSS con experiencia decente con WordPress - esa cousa é difícil de puxar.
Alegría sei que esas cousas un pouco así que eu decidín morder a burbulla e guiar a humanidade para a liberdade na construción do mellor do mellor menús de navegación para WordPress. Eu só precisaba descubrir fontes para algúns mirando agradable menús horizontal CSS. Eu escollín website unidade dinámica das súas mellores seleccións, demos e fontes.

Dediques un día para estudar e xogar con Teses plugin TAVN. Ao final eu orgullosos creado personalizado, flexible, óptimo SEO, multilevel, aninhado estrutura funcionalidade de navegación para o meu sitio WordPress these + baseado.

Lista de recursos de varios niveis WordPress menú de navegación aniñados, para tema Teses
(Ten que amar ese material):

• Professional, un aspecto limpo e sentir.
• Soporte para todos os navegadores modernos, incluíndo 6,7 MSIE, Opera, Safari, Firefox 3.x, o Google Chrome en ambos os modos de javascript e non javascript.
• Graciosamente desactualizados para navegadores non-JavaScript. Vostede menú será usável, visualmente similares e de traballo, mesmo para os navegadores javascript desactivado (aínda que só de navegación de nivel superior serán visibles e non flyouts acontecerá naturalmente como son feitos por javascript).
• características SEO amigable - Código menú desordenadas lista é xerada dentro do HTML. Google e arañas outro buscador será capaz de indexar a súa estrutura de navegación e enlaces a páxinas internas.
• Soporte para ilimitada niveis de aninhado e subníveis.
• Soporte para calquera fin ou páxinas, artigos (definido polo usuario vía URI), categorías, usuarios, bloques de código personalizado e enlaces externos dentro do menú.
• Soporte de texto, así como elementos do menú baseado en imaxe. (Aínda teño que experimentar estes though).
• Menú estrutura eo contido é visualmente axustable mediante TAVN área administrativa.
• Compacto: flyouts JQuery base para os niveis aniñados.
• Fast: JQuery para o menú é cargado a partir de servidores de Google (que eu Tese amor propio a facer o mesmo en vez de puxa-lo localmente). Isto vai acelerar un pouco as cousas.
• Escalabilidade - Este tipo de menú é editável e configurable, en calquera momento a través das definicións plugin TAVN, sen necesidade de codificación en calquera lugar.

Eu usei este excelente menú do disco dinámico portal como unha base. Tiven que personalizar o código JavaScript un pouco, así como incluír anaco do PHP en custom_functions.php para facer o traballo coa tese. Tamén o número de páxinas preexistentes, categorías e artigos do meu sitio foron usadas para montar a estrutura do menú. O seu sitio específicos serán diferentes - pero os conceptos son os mesmos.
Entón imos seguir, imos?

Paso a paso as instruccións para instalación TAVN baseado aniñados, personalizable, multinível, SEO friendly
e simplemente ollar fresco menú de navegación para WordPress e Teses Temas

1. Ir ao panel de administración WordPress. Extensións-> Engadir nova busca por "TAVN". O plugin será mostrado. Prema en [Install], [Instalar agora], "Activar plugin".
2. Ferramentas-> Lista de TAVN, Inside "Navegación" Grupo zona atopar "o nome do grupo" e escriba: "menu1" no campo, preme [botón Crear]. "Menu1 área do rectángulo" foi creada.
   Este "menu1 área" será o principal parque para a construción do menú. Estará arrastrando e soltando elementos aquí o seu menú.
3. En "bens" área de atopar "listbox" outro e prema en "Home" elección. "Home thingie" aparecerá dentro "asignado" área. Raro, hein? Non te preocupes, mentres traballa - e será para nós.
4. Arrastre este "Home thingie" de "activos" en área "menu1 área do rectángulo". Vai facer se "Home" elemento no menú.
   • Repita os pasos 3-4 para algunhas páxinas de "Páxina" área, así como para as categorías en "categorías" área. Arrastre outros elementos que quere estar no seu menú dentro "menu1" rectángulo. Podes premer nas páxinas, categorías, usuarios e algúns elementos personalizados como "divisor de lista" e "bloque de código". bloque de código dá sempre xeito para engadir migallas personalizados dentro do menú.
   • Podes arrastrar os elementos do menú dentro "menu1" espazo para reorganizar a súa orde.
   • Pode axustar a posición xerárquica de cada elemento do menú con "<" e ">" flechas.
   • Clicando no nome do texto de cada elemento de menú - abre incomprensíbel diálogo personalización extra para este elemento. Eu patróns máis utilizados, pero tecnicamente pode estar tolo e comezar a facer opcións de menú baseado en imaxe e engadir anacos de HTML para ela. Proceda con coidado though.
   • Para linkless submenus unclikable que servirán como "pais" para outros "sub-nenos" Eu usei o "bloque de código tipo". Por exemplo, cando a personalización elemento bloque de código como eu entrei para o "Menú elemento alias =" MemberWing "e" Enter bloque de código: = "<a href='#'> MemberWing </ a>". Tendo en href = "#" vai facelo, pero actuando como un válido "menú" nai elección clickable non.
5. Vexa como estruturar miña TAVN 'menu1' construír parecía case concluído:
   
6. Completar a construción inicial e, a continuación, prema en "Gear" icono para personalizar a súa estrutura de menú:
   
7. Será aberto de diálogo con catro guías: Options, Mostrar, CSS, tema.
   1. Ir a "guía Opcións" e asegurarse que todo está desmarcada e "nome do grupo" di: "menu1"
   2. Vaia á pestana "Ver" e facer todo certo no "Show do grupo navegación ..." área está marcada [x]. Deixe o resto en estándares.
   3. Ir a "CSS" guía e seleccione o botón de radio (x) "Non se aplican as clases CSS.
   4. Ir a "theme" guía e enche-lo así:
      
      Inserir en "engadir etiquetas antes ..." esta área de código:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Inserir en "engadir etiquetas despois ..." esta área de código:
      <br style='clear: left' /></div>
   5. Prema [Gardar / Pechar] botón
8. Neste punto dende o menú de construción dentro TAVN opcións plugin está completo.
   Agora é hora de facer unha pequena melodía ata para tema da tese de obtelo listo. Para iso, cómpre engadir algúns arquivos personalizados - CSS e JavaScript, que pertence ao menú e actualizar custom_functions.php tese "
9. Fai a descarga do conxunto completo de arquivos aquí .
10. Descompactá o arquivo. Se ten actualizado o seu custom_functions.php coas súas personalizações - precisas mestura-los coas miñas cousas. Vou deixar isto para vostede.
    Se aínda non tocou - sexa a vontade para substituír-lo co meu. Nota: Eu prefería posición menú baixo a cabeceira website (estándar está enriba) - polo que a miña adaptación inclúe esta preferencia, ben.
11. Upload de ficheiros, incluíndo todos os Subdirectorio e arquivos no seu tema de tese "costume" de directorio, como este:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    Eu non Preme custom.css - Eu prefiro manter CSS menú específico nas súas propias posicións, para evitar crear confusión dentro custom.css
12. Neste punto, pode actualizar o seu sitio e ver o novo fermoso novo multinível, aninhado, SEO optimized menú.
13. Sempre poderá volver a a configuración TAVN e personalizar o seu menú con máis opcións ou recolocala nada. Isto será reflectido no lugar viven automaticamente.

O camiño por diante ...

Este tutorial incluído exemplo creativo dun tipo de menú. Joguei con outro - só para ver como o menú de cor escura quedaría así:

Tese tema - menú CSS aniñados multinível - escuro da paleta

Penso que é moi agradable. Hai moitos máis exemplos de navegación dispoñible no Dynamic Drive - todos eles son posibles de personalizar a tese de WordPress e outros temas con algún esforzo:

Dynamic Drive Menús Horizontal

Eu espero que vai atopar este tutorial beneficioso e útil. Como dixo, é posible personalizar calquera destes menús para a tese - que é xa tempo e ganas de facer ocorrer.

Eu podería facer este traballo para ti nunha base contractual. Só ten que escoller o menú que lle gusta, póñase en contacto comigo e eu vou traballar no código e as instruccións para o seu sitio.

$ 20

E, claro, se for ata a construción de SEO super otimizada adhesión WordPress Premium portal - a mellor solución para iso:
Tema Teses + plugin adhesión MemberWing + auto Hosted WordPress , por suposto.

Etiquetado como: menú CSS para WordPress , tema da tese , tema de tese de menús xerárquicos , tema da tese menú multinível , funcionalidade de navegación tema da tese , tema da tese menús aniñados , tema da tese tutorial , css menú WordPress , WordPress nested menú