Потрага за савршеним вертикални мени ...

Део 1 овог туторијала описао корак по корак процес изградње хоризонталног нивоа угнежђених мени за Уордпресс рад тема . Део 2 ће наставити да унапреди ову функционалност. Овде ћемо додати "тамне" верзија хоризонталне навигациони мени и ја ћу вас научити како да прелазите "паметни" и "тамно" верзија. Део 2 је надскуп Део 1. Она укључује све од 1. део + додаје више кул ствари.

Основна идеја коју сам желео да изнесе додаје вертикални мени на (и Уордпресс уопште). Тражио сам стварно флексибилан, СЕО фриендли и мулти-бровсер компатибилан вертикални мени који би омогућио стварање неограниченог гнежђење нивоима.

ВЕБ има тона страница на тему, али када сам почео да покушам све ове узорке - они ни покварио, распали, подржани само ограничен број нивоа или мисбехавед у Гејтс + Балмер је јунксплорер 6. Коначно сам се вратио да је покушао и поверења Динамички менија диск као своје вертикалне узорке показало се лепо случај да одговара мом строге захтеве. Морао сам да их мењате, иако значајно да се уверите се уклапа рад модела.
Потрага за савршенством се наставља ...

Провео сам око 16 сати претраживања, монтажа, тестирање, фиксирање, полирање и подешавање ЦСС-вертикални мени и ЈС код и 3 / 4 времена је потрошено што је за рад у МСИЕ 6..
Аниваис, био сам задовољан коначним резултатом. Резултирало вертикални навигација мени има све исте предности које хоризонталном менију има.

Пошто је могућност додавања вертикални мени је веома важно да око 70-80% од портала на Интернету. Хоризонтална менији имају ограничен "простор" за смештај много избора, али мени вертикални мени нема ово ограничење и да ће изузетно помоћи. Дакле, идемо.

Много корака да се то деси већ описани у делу 1. туторијала тако да ће то учинити за мало краћи, али са много више функција богата резултате.

Па овде иде:

Изградња СЕО фриендли, вертикално, више нивоа, хијерархијски угнежђена мени за Уордпресс и . Корак по корак
(... Оно што никад нисте помислили могуће ...)

  1. Инсталирајте екец ПХП додатак и активирали га. Ми ћемо то морати јер ће користити ПХП-у текст виџет да емитују ХТМЛ код вертикалног менија.
  2. Да ли кораке 1 - 6 од дела 1 туторијала . У суштини потребно је да инсталирате и активирате користе НАВТ додатак + визуелно изградите менија. Уверите се да је група мени име је "мену1". Ово име је хардцодед у цустом_фунцтионс.пхп
  3. Кликните на "брзину" икону "мену1 група да измените то својства:
    navt_customize_menu
  4. Прати Кораци 7.1 -7.3 Дела 1 упутство за подешавање "Опције", "Екран" и "сестара" картице подешавања.
  5. Сада кликните на "Тема" картици овог дијалога. Ми ћемо заменити низ поставки тамо (ако је следећи корак 1). То је у реду - нећете изгубити ништа - али ове промене су потребне, јер сам променио неки код од корака бр.1.
    Ево како овај дијалог треба да буде испуњен у:
    1. Унутар "Тема КСПатх:" подручја унесите овај код (то команде да замени било коју ознаку са ове класе):
      .jquerycssmenu, .jqueryslidemenu
    2. Сет "Акција" да "Замени са"
    3. Унутар "Додавање ознака пре навигацију групе" област унесите овај код:
      <div class='jquerycssmenu' style='margin-top:5px;'>
    4. Унутар "Додавање ознака после навигацију групе" област унесите овај код:
      <br style='clear: left' /></div>
    5. Кликните на [САВЕ / Затвори] дугме.
  6. Сада идите на Уордпресс админ панела -> Изглед -> Видгет-а.
  7. Драг "Текст" виџет (из великих "Расположиви виџети" простор) у "Сидебар 1" површине на десној страни. Ћемо додати код у Текст виџет који ће нам помоћи да се материјализује у вертикалном менију.
    НАПОМЕНА: Претпостављам да сте се "Сидебар 1" у постојање. Теза опција вам омогућава да га искључите - већ због овог туторијала дозволите да тако буде.
  8. Када сте превукли и пао овај виџет - то ће отвара као цвет (осећам романтично сада када МСИЕ борба више).
  9. У "Наслов" простор унесите "Најбољи светски вертикални мени" ... Па, слободно да користе своју креативност - да текст иде изнад новорођене вертикалном менију.
  10. У великим простор за текст - унесите ову ПХП код:
    <?php
    if (function_exists('navt_getlist'))
    $menu_html = navt_getlist ('menu1', false, '', 'ul id="dd_vertical"');
    else
    $menu_html = "";
    $menu_html = preg_replace ('#class=[\'\"]jquery(css|slide)menu[\'\"]#', 'class="dd_vertical"', $menu_html);
    echo $menu_html;
    ?>
  11. Притисните [САВЕ] дугме, кликните на "Затвори" везу.
  12. Преузмите ажуриране скуп фајлове овде .
    Ова архива садржи:


    • Ажурирана верзија "паметни" хоризонталном менију код
    • "Тамна" верзија хоризонталном менију
    • Вертикални мени кодови
    • Ажурирану верзију цустом_фунцтионс.пхп
  13. Сада треба да распакујте архиву и отпремите ово је у "обичај" директоријум вашег .
    Напомена: Ако сте урадили било прилагођавања унутар цустом_фунцтионс.пхп - би ми била потребна да их споји. Ако не - слободно га замени са мојим верзију.
  14. Воила! Сада можете да поново покренете веб сајт и погледате исти "паметни" хоризонталном менију + неато вертикални мени на левој бочној траци.
  15. БОНУС задатак: Нека промена "паметни" хоризонталном менију на "мрачни" шему боја.
    1. Унутар цустом_фунцтионс.пхп фајла:
      замени овај код:
      echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
      //echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu

      са овим код:
      //echo "<div class=\"jquerycssmenu\">$menu_html</div>"; // "Bright" menu
      echo "<div class=\"jqueryslidemenu\">$menu_html</div>"; // "Dark" menu

      У суштини смо коментаришући једну линију и унцомментинг други.
    2. Сада идите на админ-> Уордпресс Алати-> НАВТ Листе и кликните на поменути "опрему" икону да бисте изменили својства вашег "мену1 група.
    3. Кликните на "Тема" картицу.
    4. Унутар "Додавање ознака пре навигацију групе" област унесите овај код:
      <div class='jqueryslidemenu' style='margin-top:5px;'>
    5. Сада - поново покренете страна - и ваш главни хоризонтални мени за навигацију "магично" је постао тамно, тако нешто:
      Thesis theme - multilevel nested CSS menu - dark palette

      - више нивоа угнежђених ЦСС мену - тамно палете

      Тамна палета боја може бити погодна за одређеним сајтовима од светле боје једног. Дакле, сада имате слободу избора у вашем животу!

    6. Да се ​​вратите на "светле" боја - само Ундо изнад "бонус" кораке.
  16. Закључак:
    Волим , волим Уордпресс и волим то да имамо начина да додате пристојан мени за навигацију наше портале.

$ 20


Уживајте!

Глеб Есман

comments } { 5 коментара }

Потрага за савршеним мени ...

То је део 1 од туторијала
Део 2 овог туторијала учи како да се изгради вертикални мени + тамна палета боја за хоризонталну један

Одлучила сам да се тема теза , јер је један од мојих клијената ме је обавестио о компатибилности питања између тезе и мој УордПресс чланство сајту плугин МемберВинг. Ја га фиксна и онда одлучио да се ближи поглед на рад и заправо смета да гледају видео на насловној страни главних теза сајта - Диитхемес.цом .
Оно што ме импресионирао највише је пажње на детаље, једноставности и пре свега - СЕО карактеристике које су тако добро мисли.
МемберВинг чланство додатак је дизајниран од самог почетка за чланство локације које би требало да се повуче што више СЕО сок могуће. Тако да сам платио много пажње на мноштво СЕО проаирења и савршенствима у МемберВинг. Многи од мојих сопствених клијената тражимо око различитих тема за коришћење и да је тема која је била тако добро СЕО оптимизовани из дубоко у себи био би одличан спреман за предузетнике чланство портала.

Комбиновање СЕО овлашћења МемберВинг са СЕО овлашћења би дао најбоље од рангирање прилика да моји клијенти. Тако сам тезе и свирао са њим за дан.

То је одлична тема на све могуће начине. Навигација део иако је мало ограничен у функцији. Полазећи од тезе 1.5 + то је само један ниво менија. Моја жеља је уобичајено бити у могућности да прилагодите навигацију онолико колико је потребно. Неки сајтови имају само неколико страна, многи други тона статичких страна + зиллионс чланака / постова + много категорија.
Дакле, у идеалном свету има шансу да створи леп хијерархијски организованих корисник пријатан мени навигација мора. Теза право ван палицу има добре изгледа навигација, али сам приметио да су сви тезе засноване на сајтовима изгледају као близанци. Прилагођавање теза навигација мени није нимало лака тако да је већина људи једноставно оставити као што је то. Не постоји начин да се промени редослед категорија у менију или место њих у различитим странама. И опет, могућност креирања угнежђена структуре мени недостаје. Тако сам одлучио да видим шта се може учинити о томе.
Након покушава око пола туцета мени / навигација се односе плугин Поставио сам мој избор на Уордпресс Навигација Листа НАВТ додатака .
НАВТ додатак је у суштини несређене листе генератора са супер фенси и помало тешко фигура унтрадитионал админ интерфејса. Шта доводи у заблуду о томе је то што заправо не створи фенси изгледа менија по себи. То се најтежи део посла, иако - даје вам могућност да визуелно повуче заједно, и генеришу несређене листе - скелет вашег мени-да-буде. И можда превише створити много менија. Можете повући све врсте Уордпресс ствари у навигациони мени: странице, поруке, чланке, категорије, корисници, код блокова, спољни линкови, разделници, сепаратора и мешати и одговарају и гнездо и организовати и прилагодити их на било који дрвета налик структуру вас желите.
НАВТ генерише за вас резултат ХТМЛ-код несређене листе. Други лепота НАВТ је у томе што вам помаже да убаците нови мени у тему преко чувеног ЈКуери на основу логике, али без потребе да промени било код! НАВТ вам омогућава да одредите: "Замени ово # елемент са својим новим НАВТ мени". # Елемента може бити ид или класу пута постојећих менија или див елемента таг који се генерише ваш тренутни тему. Дакле, НАВТ ли ово замена за вас не приморава да иде у тему код и учинити га неуредан него што је сада. Ако се то све звучи као бесмислице - не брините - ја ћу водити корак по корак ускоро. Изазован део НАВТ за све је да ћете морати да дође до стварне ЦСС + слике + ЈаваСцрипт код за себе мени. И то је на вама да схватим где и како да интегришемо те фајлове и те ствари правилно окупити повезани.
Искрено не знајући ЈКуери + неким ПХП + ЦСС + има пристојан искуство са Уордпресс - ова ствар је тешко извући.
Радо Знам да ствари мало па сам одлучио да гризу метак и водич човечанства на слободу у изградњи најбољи од најбољих навигацију меније за Уордпресс. Ја само треба да сазнамо изворе за неке леп хоризонтална ЦСС менија. Изабрао сам Динамиц Дриве сајт за своје најбоље селекције, демонстрације и извора.

Сам посветила дан да уче рад и игра са НАВТ плугин-а. На крају сам поносно створио обичај, флексибилан, СЕО оптимизовани, више нивоа, угнежђене нагиватион структура за мој Уордпресс + рад заснива сајта.

Листа карактеристика нивоа, угнежђене Уордпресс менија за
(Иоу Гот да волите ове ствари):

  • Професионални, чист изглед и осећај.
  • Подршка за све модерним претраживачима, укључујући и МСИЕ 6,7, Опера, Сафари, Фирефок 3.к, Гоогле Цхроме ће у оба ЈаваСцрипт и нису ЈаваСцрипт режима.
  • Грациозно довнградабле за не-ЈаваСцрипт претраживача. Ви мени ће бити употребљива, визуелно сличне и раде чак и за ЈаваСцрипт онемогућен бровсер (додуше само врхунском нивоу навигација ће бити видљив и не флиоутс ће се десити, наравно, јер су од стране ЈаваСцрипт).
  • СЕО фриендли функције - несређене листе мени код се генерише унутар ХТМЛ-а. Гоогле и друге паука претраживача ће моћи да индексира навигацију структуру и наћи линкове за унутрашње странице.
  • Подршка за неограничен гнезда нивое и поднивое.
  • Подршка за било какав налог или странице, поруке (преко кориснички дефинисаних УРИ), категорије, кориснике, прилагођени код блокови и екстерне линкове у менију.
  • Подршка текста, као и слике на основу мени елементима. (Ја тек треба да проба јер су ипак).
  • Структура менија и садржаја је визуелно подесив преко НАВТ Администратор области.
  • Компактан: јКуери базиран флиоутс за угнеждена нивоа.
  • Брзи: јКуери за мени се учитава из Гоогле-ове сервере (волео бих рад саме да учине исто, уместо да их вуче на локалном нивоу). Ово ће убрзати ствари мало.
  • Скалабилност - Ова врста мени се мењати и конфигурисати у било које време преко НАВТ додатак подешавањима, без икакве потребе кодирања било где.

Користио сам ову одличну мени из динамичну вожњу портала као базу. Морао сам да прилагодите ЈаваСцрипт кода мало, као и укључују комад ПХП у цустом_фунцтионс.пхп да то ради са тезом. Такође, број већ постојећих страница, категорија и поруке из мог сајта су коришћени за склапање структуре менија. Ваш сајт специфичности ће бити другачије - али концепти ће бити исти.
Па хајде настави, ми ћемо?

Корак по корак инструкције за подешавање НАВТ на бази угнеждене, прилагодљив, више нивоа, СЕО фриендли
и напросто кул потрази и теза Тема

  1. Иди на Уордпресс админ панела. Плугинс-> Додај нови, пронађите "навт". Додатак ће бити приказани. Кликните на [Инсталирај], [Инсталирај одмах], "Активирај плугин".
  2. Алати-> НАВТ листе Унутар "Навигација Група" површине пронашли "име групе" и унесите: "мену1" у пољу, притисните [Направи] дугме. "Мену1" правоугаоник површине добио направили.
    Овај "мену1" простор ће бити главни игралиште за изградњу менија. Бићете превлачењем и испуштањем овде мени елемената.
  3. У "актива" област наћи "други" ЛистБок и кликните на "Хоме" избор. "Хоме" тхингие ће се појавити у оквиру за "нераспоређен" области. Чудно, зар не? Без бриге, све док се ради - и то ће за нас.
  4. Превуците овај "Почетна" тхингие из "актива" простор у "мену1" правоугаоник области. Она ће постати "Хоме" ставку у менију.
    • Поновите кораке 3-4 за неке странице из "Странице" области, као и за категорије у "категорије" области. Превуците било друге ставке које желите да буде на вашем менију изнутра "мену1" правоугаоник. Можете кликнути на страницама, категорије, кориснике и неке уобичајене елементе као што су "Листа разделник" и "код блока". Код блок је кул начин да додате прилагођени исечака унутар менија.
    • Можете превуците ставке менија у "мену1" простор да реорганизујете њихов редослед.
    • Можете подесити хијерархијског положаја сваког менија са "<" и ">" стрелице.
    • Кликом на име сваког текста ставке менија - отвара ум фантастичних екстра прилагођавање дијалог за ову ставку. Ја углавном користе подразумеване вредности, али технички можете полудети и почнемо правити слике на основу мени изборе и додају комади ХТМЛ код у њега. Наставите са опрезом ипак.
    • За линклесс унцликабле подменији који ће послужити као "родитељи" за друге "под-децу" Користио сам "Код блока" типа. На пример, када прилагођавања што су код блока ставку сам ушао за "Ставка менија алиас" = "МемберВинг" и за "Унесите блок кода:" = "<а хреф='#'> МемберВинг </ а>". Пошто хреф = "#" ће учинити, али не можете да кликнете делује као валидна "родитељ" мени избор.
  5. Ево како мој НАВТ 'мену1 "изгради структуру изгледао скоро завршен:
    navt_building_icon
  6. Заврши почетни зграде и затим кликните на "опрему" икону да бисте прилагодили структуру менија:
    navt_customize_menu
  7. То ће отворити дијалог са 4 картице: Опције приказа, ЦСС тема.
    1. Идите на "Опције" картицу и проверите да ли је све непроверена и "Име групе" каже: "мену1"
    2. Идите на "Екран" картицу и проверите да ли све на "Прикажи навигациони групе за ..." површине се проверава [к]. Оставите остатак на вредности.
    3. Идите на "ЦСС" картицу и изаберите радио дугме (к), "Немојте наносити ЦСС-класе".
    4. Идите на "Тема" картицу и напуните је у тако:
      navt_configuration_theme_tab_icon
      Убаците у "Додавање ознака пре ..." област овај код:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      Убаците у "Додавање ознака после ..." област овај код:
      <br style='clear: left' /></div>
    5. Притисните [сачувате / затвори] дугме
  8. У овој згради тренутку мени из НАВТ додатак опције је завршена.
    Сада је време да мало подесити за да се то спреман. За то нам треба да додате неколико датотека прилагођених - ЦСС и ЈаваСцрипт што припада мени и ажурира рад 'цустом_фунцтионс.пхп
  9. Овде можете преузети комплетан скуп фајлова .
  10. Унзип архиву. Ако сте ажурирали вашу цустом_фунцтионс.пхп са прилагођавања - потребно је да их споји са мојим стварима. Ја ћу га оставити на вама.
    Ако нисте дотакли - слободно га замени са мојим. Имајте на уму: Ја радије на позицију мени под сајту заглавља (стандардно је горе) - тако да је мој подешавање укључени ову предност као добро.
  11. Уплоад архива укључујући све поддиректоријуме и датотеке у оквиру вашег директоријум 'обичај', овако:
    .../themes/THESIS-DIR/custom/custom_functions.php
    .../themes/THESIS-DIR/custom/jquerycssmenu/...

    Нисам дотакао цустом.цсс - Ја више волим да мени специфичним ЦСС-под својим локацијама да би се избегло стварање неред унутар цустом.цсс
  12. У овом тренутку можете поново покренете веб сајт и погледате нове лепа нова нивоа, угнежђене, СЕО оптимизовани менија.
  13. Увек можете вратити НАВТ подешавања и прилагођавање менија са више избора или промените било шта. Он ће се одразити на живи сајт аутоматски.

Пут пред нама ...

Ово упутство су креативни пример једне врсте менија. Играо сам са другом - само да видим како тамне боје мени би да изгледа овако:

Thesis theme - multilevel nested CSS menu - dark palette

- више нивоа угнежђених ЦСС мену - тамно палете

Мислим да је прилично лепо. Постоји још много навигациони узорака доступни на Динамиц Дриве - сви они су могуће прилагодити за рад и других Уордпресс тема са неким напор:

Dynamic Drive Horizontal Menus

Динамиц Дриве Хоризонтална Менији

Надам се да ћете наћи овај туторијал корисно и корисно. Као што сам рекао, могуће је да прилагодите било који од ових менија за теза - то је дато време и жељу да се то деси.

Сам могао да урадим овај посао за вас на основу уговора. Само изаберите мени вам се допада, контактирајте ме и ја ћу радити на код и упутства за ваш сајт.

$ 20

И наравно, ако сте до зграде Супер СЕО оптимизовани Премиум Вордпресс чланство Портал - најбоље решење за то:
Теза Тема + МемберВинг чланство додатак + Селф Хостед Вордпресс- наравно.

comments } { 15 коментара }

Премија пост 3

Јул 5, 2009

Ово је слободни задиркивање за премијум порука 3.
Овај чланак садржи комбиновани садржај: Први део је видљив за Златни члан, цео чланак је видљива само на Платина чланова.
Покушајте да се пријавите као злато члан прве (корисничко име / лозинка = злата / злато) - видећете више садржаја.
... А онда одјављивање и поново пријавите као платина члан (корисничко име / [...]

Прочитајте цео чланак →

Премиум Пост 2

Јул 5, 2009

Ово је слободни задиркивање за премијум порука 2. Остатак је видљив за злато и само за чланове.
Савет - златна Мембер Логин / пассворд = злата / злата

Остатак овог чланка је на располагању премија само за чланове.
Пријавите се или Постаните члан

Прочитајте цео чланак →

Премиум Пост 1

Јул 5, 2009

Ово је демонстрација чланак за МемберВинг-Кс. Са МемберВинг Кс овог члана доноси за куповину по једној цени од $ 2.95, или путем претплате на "Златно Чланство" програма.
Дакле, то је бесплатно задиркивање за премијум порука 1. Остатак овог чланка је видљив само за чланове који су је купили за $ 2.95 или се претплатили на "Златно Чланство".
Хинт [...]

Прочитајте цео чланак →

Теза тема и чланство сајту плугин МемберВинг за најбољи СЕО чланство сајтова

Јул 5, 2009

МемберВинг је УордПресс чланство сајту плугин дизајниран специјално за СЕО оптимизован чланство портала. Са својим флексибилним индексираних Теасерс, подршка за Гоогле Фирст Цлицк Фрее стандард дигиталног садржаја и преузимање заштиту оснажене са ПромоФусион - то гарантује Ваше чланство сајт брзо индексирање и већи ранг листи.
Док су други чланство сајт софтвери воли да потпуно онемогући приступ [...]

Прочитајте цео чланак →