Support » Allgemeine Fragen » Fertiges Vertical Menü in WordPress einfügen ?!

  • JensGoro

    (@jensgoro)


    Hallo zusammen,

    ich habe gestern ein vertikal Menü gekauft, habe aber nicht beachtet, dass es kein Plugin, sondern ein fertig programmiertes Menü Design ist.

    Daher nun meine Frage an euch, wie kann ich dieses mit dem WordPress Standart ersetzen?

    Da Menü ist hier: http://codecanyon.net/item/responsive-bootstrap-sidebar-navigation/full_screen_preview/11784410

    Eine Anleitung zum einbinden in ein HTML Theme ist dabei, aber geht das auch in WordPress?

    Navigation Features
    Design & Developed to supports any device using latest Bootstrap framework.
    Multiple levels
    100% Responsive and Mobile Friendly
    Vertical Navigation with both Left/Right Sidebar Support
    Create your own theme with theme options
    11 Effects for both Vertial and Horizontal Menu
    How to Use?
    Here are described varios ways of using this sidebar, you can read and adapt them to your website’s requeriments. Below are described all options with details.

    Simplest Usage – Default HTML Code

    <body hoe-navigation-type="vertical" hoe-nav-placement="left" >
        <div id="hoeapp-wrapper" class="hoe-hide-lpanel" hoe-device-type="desktop">
            <header id="hoe-header" hoe-lpanel-effect="shrink">
                <div class="hoe-left-header">
                </div>
                <div class="hoe-right-header" hoe-position-type="relative" >
                </div>
            </header>
            <div id="hoeapp-container" hoe-color-type="lpanel-bg2" hoe-lpanel-effect="shrink">
                <aside id="hoe-left-panel" hoe-position-type="absolute">
                    <ul class="nav panel-list">
                        <li class="nav-level">Navigation
                        <li class="active">
                            <a href="void(0)">
                                <i class="fa fa-tachometer"></i>
                                <span class="menu-text">Dashboard</span>
                                <span class="selected"></span>
                            </a>
    
    <li>
                            <a href="void(0)">
                                <i class="fa fa-bar-chart"></i>
                                <span class="menu-text">Graphs</span>
                                <span class="label sul">New</span>
                                <span class="selected"></span>
                            </a>
                        </li>
                        <li class="hoe-has-menu">
                            <a href="void(0)">
                                <i class="fa fa-files-o"></i>
                                <span class="menu-text">Other Pages</span>
                                <span class="selected"></span>
                            </a>
                            <ul class="hoe-sub-menu">
    
    <li>
                                    <a href="void(0)">
                                        <span class="menu-text">Blank Page</span>
                                        <span class="selected"></span>
                                    </a>
                                </li>
                </aside>
                <section id="main-content">
                </section>
            </div>
        </div>
    </body>

Ansicht von 3 Antworten - 1 bis 3 (von insgesamt 3)
  • Moderator Bego Mario Garde

    (@pixolin)

    Bei der Übertragung des Menüs ist scheinbar etwas schief gelaufen – zumindest bekomme ich nur Teile des Codes angezeigt. Besser demnächst Dienste wie pastebin.com verwenden und den Link hier posten.

    Wenn es um das reine Einfügen des HTML-Codes ginge, wäre deine Frage einfach zu beantworten: Child-Theme für dein aktuelles Theme anlegen, header.php kopieren, HTML des Menüs einfügen, fertig.

    Leider ist das aber nur die halbe Wegstrecke, denn Du möchtest ja, dass dieses Menü mit den (automatisch generierten) Menü-Punkten von WordPress gefüllt wird. Da WordPress aber dem Navigationsmenü eigene Klassen mitgibt, müsstest Du einen Custom Walker erstellen, der die benötigte HTML-Struktur samt zugehörigen CSS-Klassen abbildet. Eine aktuelle Anleitung dazu findest Du bei Smashing Magazine. Allerdings sind Custom Walker nicht gerade trivial.

    Moderator Frank Neumann-Staude

    (@fstaude)

    Hallo,

    ich habe den HTML-Code mal in einen Code-Block gepackt.

    Edi

    (@psychosopher)

    Das Skript hat Dich gerade einmal $ 6 gekostet… Geht aber von einem völlig anderen Konzept aus als WordPress beziehungsweise WordPress-Themes. Klar, sich da durchzukämpfen und zu versuchen, es in ein WordPress-Theme einzubauen, ist eine nette Übung (und wie Bego angedeutet hat, eine nicht ganz einfache).

    Ich würde die $ 6 abschreiben und mit einem Theme oder Plugin arbeiten, dass das kann, was Du willst. Allein mit den Anpassungen dafür, wirst Du genug beschäftigt sein. 😉

Ansicht von 3 Antworten - 1 bis 3 (von insgesamt 3)
  • Das Thema „Fertiges Vertical Menü in WordPress einfügen ?!“ ist für neue Antworten geschlossen.