החיפוש אחר התפריט המושלם ...

זהו חלק 1 של מורה
חלק 2 של הדרכה זו מלמדת איך לבנות תפריט אנכי + הצבעים כהים אחד אופקי

החלטתי לקבל את נושא התזה , כי אחד הלקוחות שלי הודיע ​​לי על בעיות תאימות בין תזה שלי wordpress חברות האתר תוסף MemberWing. סידרתי את זה ואז החליט לקחת מבט מקרוב על תזה באמת טרח לראות קטעי וידאו בעמוד הראשי של האתר התזה המרכזית - Diythemes.com .
מה שהרשים אותי ביותר הוא תשומת לב לפרטים, הידידותיות למשתמש ובעיקר - תכונות SEO, כי הם חשבו כך היטב.
חברות תוסף MemberWing תוכנן מהיסוד עבור אתרי החברות כי היה צריך למשוך כמה שיותר מיץ SEO. אז שילמתי המון תשומת לב המון SEO שיפורים השלמות ב MemberWing. רבים מהלקוחות שלי הם שואלים על נושאים שונים לשימוש שיש נושא זה היה כל כך טוב SEO אופטימיזציה מבפנים עמוק יהיה בכושר מצוין עבור יזמים פורטל החברות.

שילוב כוחות של קידום אתרים SEO MemberWing עם סמכויות של נושא התזה היה נותן את הטוב ביותר הזדמנויות הדירוג ללקוחות שלי. אז קיבלתי תזה ושיחק בו במשך יום אחד.

זהו נושא מעולה בכל הדרכים. החלק של ניווט זה אף הוא קצת מוגבל בתפקוד. החל מ תזה 1.5 + הוא אחד התפריטים ברמה בלבד. הרצון הרגיל שלי היא להיות מסוגל להתאים אישית את הניווט ככל הדרוש. באתרים יש כמה עמודים בלבד, ועוד רבים אחרים יש טונות של דפים סטטיים + מיליארדים של מאמרים / הודעות + המון קטגוריות.
אז בעולם אידיאלי שיש סיכוי ליצירת נחמד למראה מאורגנים באופן היררכי תפריט ידידותי למשתמש ניווט הוא חובה. נכון תזה את בת יש ניווט נראה טוב אבל שמתי לב שכל התזה מבוססת אתרים מחפשים כמו תאומים. התאמה אישית של תפריט ניווט תזה לא קל ממש כך שרוב האנשים פשוט להשאיר אותו כפי שהוא. אין דרך לשנות את הסדר של קטגוריות בתפריט או מיקום אותם בין הדפים. ושוב, את היכולת ליצור מבנים תפריט מקונן חסר. אז החלטתי לראות מה אפשר לעשות בקשר לזה.
לאחר שניסה כחצי תריסר תפריט / ניווט תוספים הקשורות אני מגדיר את הבחירה שלי על NAVT Wordpress Plugin רשימת ניווט .
תוסף NAVT היא למעשה רשימה מסודרת גנרטור סופר מפואר עם קצת שקשה למצוא ממשק admin מסורתי. מה מטעה על כך היא שזה לא ממש מחפשים ליצור תפריטים מפואר בפני עצמו. זה עושה את החלק הקשה של העבודה אף - נותן לך יכולת ראייה למשוך ביחד, ליצור רשימה לא מסודרת - השלד של התפריט שלך לעתיד. ואתה יכול ליצור תפריטים רבים מדי. אתה יכול למשוך כל סוג של חומר Wordpress לתוך תפריט ניווט: דפים, הודעות, מאמרים, קטגוריות, משתמשים, קטעי קוד, קישורים חיצוניים, חוצצים, מפרידי ו לערבב ומתאימים ואת הקן לארגן ולהתאים אותם במבנה עץ כמו שאתה רוצים.
NAVT מייצר עבורך הביא HTML רשימה לא מסודרת. יופי של NAVT השנייה היא שזה עוזר לך להכניס לתפריט החדש שלכם לתוך הנושא שלך דרך ההיגיון JQuery המפורסם מבוסס אך ללא צורך לשנות שום קוד! NAVT מאפשר לך לציין: "להחליף את האלמנט הזה # עם תפריט NAVT החדש שלי". # אלמנט יכול להיות id או מעמד של נתיב התפריט הקיים או רכיב תג div כי הוא להיות שנוצר על ידי נושא הנוכחית שלך. אז NAVT עושה זאת ללא תחליף אתה מכריח אותך להיכנס קוד הנושא ולהפוך אותו מבולגן יותר ממה שהוא כבר נמצא. אם כל זה נשמע כמו ג'יבריש - אל תדאג - אני מדריך אותך צעד אחר צעד בקרוב. החלק המאתגר של NAVT לכולם היא תצטרך לבוא עם CSS בפועל + תמונות + קוד javascript התפריט שלך בעצמך. וזה תלוי בך כדי להבין היכן וכיצד לשלב את הקבצים הללו ולעשות את הדברים האלה כמו שצריך להתחבר יחד.
בכבוד רב בלי לדעת כמה JQuery + + PHP + CSS בעל ניסיון הגון עם Wordpress - הדבר הזה הוא קשה למשוך.
בשמחה אני יודע את החומר הזה קצת אז החלטתי לבלוע את הגלולה האנושות מדריך לחופש בבניין הטוב ביותר של תפריטי ניווט הטובה ביותר עבור Wordpress. אני רק צריך לגלות מקורות כמה תפריטים נחמדים אופקי מחפש CSS. הרמתי האתר כונן דינמי עבור הבחירות הטוב ביותר שלהם, הדגמות ומקורות.

הקדשתי יום ללמוד תזה ולשחק עם תוסף NAVT. בסוף אני בגאווה יצר מותאם אישית, גמיש, SEO אופטימיזציה, מבנה מדורגת, nagivation מקוננות עבור אתר וורדפרס + שלי תזה מבוססת.

רשימת התכונות של תפריט מדורגת, מקוננת ניווט עבור Wordpress Theme תזה
(אתה חייב לאהוב את החומר הזה):

• מקצועי, מראה נקי ותחושה.
• תמיכה עבור כל הדפדפנים המודרניים, כולל 6,7 MSIE, אופרה, ספארי, פיירפוקס 3.x, Google Chrome הן javascript ולא javascript מצבי.
• Downgradable בחן שאינם javascript הדפדפנים. אתה התפריט יהיה שמיש, דומה ויזואלית ועבודה אפילו עבור דפדפני javascript נכים (אם כי רק הניווט ברמה העליונה תהיה גלוי flyouts לא יקרה, כמובן, כפי שהם מבוצעים על ידי javascript).
• תכונות SEO ידידותית - לא מסודרת התפריט קוד הרשימה נוצר בתוך HTML. גוגל ושאר מנועי החיפוש יוכלו מדד מבנה הניווט שלך למצוא קישורים לדפים הפנימיים.
• תמיכה עבור רמות קינון sublevels בלתי מוגבל.
• תמיכה עבור כל הזמנה או דפים, הודעות (המוגדרים על ידי המשתמש באמצעות URIs), קטגוריות, משתמשים, גושי קוד מותאמים אישית קישורים חיצוניים בתוך התפריט.
• תמיכה של טקסט, כמו גם התמונה מבוססי אלמנטים בתפריט. (יש לי עדיין לנסות את אלה אם).
• מבנה תפריט תוכן מתכווננת ויזואלית דרך אזור admin NAVT.
• קומפקטי: flyouts מבוסס JQuery רמות מקוננות.
• מהיר: JQuery את התפריט נטען מ-Google שרתים (אני אשמח תזה עצמו לעשות את אותו הדבר במקום למשוך אותו באופן מקומי). זה היה לזרז מעט את הדברים.
• יכולת הרחבה - זה סוג של תפריט ניתן לעריכה להגדרה בכל עת דרך ההגדרות תוסף NAVT ללא כל צורך של קידוד בכל מקום.

השתמשתי בתפריט זה מעולה מכונן דינמי הפורטל כבסיס. הייתי צריך להתאים את קוד javascript קצת כמו גם כוללים נתח של PHP לתוך custom_functions.php כדי לגרום לזה לעבוד עם תזה. כמו כן במספר קיימים עמודים, קטגוריות הודעות מהאתר שלי היו רגילים להרכיב מבנה התפריטים. פרטי האתר שלך יהיה שונה - אבל המושגים יהיה אותו דבר.
אז בואו להתקדם, בסדר?

שלב שלב לפי ההוראות להתקנה NAVT מבוססי מקוננות, הניתנים להתאמה אישית, מדורגת, ידידותית SEO
ופשוט מגניב תפריט ניווט פשוט מחפש Wordpress ו תזה נושא

1. עבור פאנל הניהול וורדפרס. Plugins-> הוספת חדשה, חפש "navt". התוסף יוצגו. לחץ על [התקן], [התקן כעת], "הפעלת Plugin".
2. Tools-> רשימות NAVT, בתוך "ניווט הקבוצה" שטח למצוא "שם הקבוצה" והזן: "menu1" בשדה, לחץ על כפתור [יצירת]. "Menu1" שטח המלבן יש יצר.
   זה "menu1" באזור תהיה מגרש המשחקים העיקרי לבניית התפריט. אתה תהיה גרירה ושחרור כאן אלמנטים בתפריט שלך.
3. ב "נכסים" שטח למצוא שדה בחירת מורחב "אחר" ולחץ על הבחירה "דף הבית". מהמה שמו "בית" תופיע בתוך שטח "לא מסומנים". מוזר, אה? אל דאגה, כל עוד זה עובד - וזה יהיה עבורנו.
4. גרור מהמה שמו "בית" מאזור "נכסים" לשטח מלבן "menu1". זה יהיה "בית" פריט בתפריט.
   • חזור על שלבים 3-4 עבור כמה דפים מאזור "דפים", כמו גם עבור קטגוריות באזור "קטגוריות". גרור כל פריט אחר שאתה רוצה להיות בתפריט שלך בתוך המלבן "menu1". אתה יכול ללחוץ על דפים, קטגוריות, משתמשים כמה אלמנטים מותאמים אישית, כגון "מחלק רשימת" ו "גוש הקוד". קוד לחסום דרך מגניב להוסיף קטעי מותאם אישית בתוך התפריט.
   • אתה יכול לגרור פריטים בתפריט בתוך השטח "menu1" לסדר מחדש את הסדר שלהם.
   • ניתן להתאים את מיקום היררכי של כל פריט עם תפריט "<" ו - ">" חצים.
   • לחיצה על שם טקסט של כל פריט בתפריט - פותח משגע לי את השכל שיח התאמה אישית נוספת עבור פריט זה. אני בעיקר בשימוש המחדל אבל מבחינה טכנית אתה יכול להשתגע ולהתחיל לעשות התמונה מבוססי אפשרויות התפריט ולהוסיף חתיכות קוד HTML לתוך זה. זהירות אף.
   • עבור תפריטי משנה unclikable linkless שישמש "ההורים" עבור אחרים "תת הילדים" פעם הייתי "בלוק קוד" סוג. לדוגמה, כאשר התאמה אישית של פריט כזה גוש הקוד נכנסתי עבור "פריט תפריט הכינוי" "MemberWing" = עבור "הזן את גוש הקוד:" = "href='#'> MemberWing <a </ a>". לאחר href = "#" תעשה את זה לא ללחוץ אבל מתנהג כמו בחירה תקפה "הורה" בתפריט.
5. הנה כמה "menu1" NAVT שלי לבנות מבנה שנראה כמו כמעט הושלמה:
   
6. סיום הבנייה הראשונית ולאחר מכן לחץ על הסמל "ציוד" כדי להתאים אישית את מבנה התפריט שלך:
   
7. זה יהיה שיח פתוח עם 4 כרטיסיות: אפשרויות תצוגה, CSS, ערכת נושא.
   1. עבור ללשונית "אפשרויות" ולוודא שהכל אינה מסומנת "שם הקבוצה", אומר: "menu1"
   2. יש להקליק על "תצוגה" לשונית ולעשות הכל על בטוח "קבוצה ניווט הצג על ..." שטח מסומנת [x]. השאירו את ברירות המחדל של מנוחה בבית.
   3. עבור לכרטיסייה "CSS" ובחר בלחצן (x) "אל חלים מחלקות CSS".
   4. עבור לכרטיסייה "Theme" ולמלא אותה כך:
      
      הכנס לתוך "הוספת תגים לפני ..." בתחום זה הקוד:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      הכנס לתוך "הוספת תגים אחרי ..." בתחום זה הקוד:
      <br style='clear: left' /></div>
   5. לחצו על [שמור / קרוב] כפתור
8. באותו הבניין הזה מתוך נקודת תפריט אפשרויות NAVT תוסף תושלם.
   עכשיו זה הזמן לעשות מנגינה קטנה בשביל הנושא תזה כדי לקבל את זה מוכן. בשביל זה אנחנו צריכים להוסיף קבצים מותאמת אישית כמה - CSS ו-javascript השייך התפריט custom_functions.php תזה "עדכון
9. הורד את סט שלם של קבצים כאן .
10. Unzip בארכיון. אם עדכנת custom_functions.php שלך עם ההתאמות האישיות שלך - אתה צריך למזג אותם עם הדברים שלי. אני אשאיר את זה תלוי בך.
    אם לא נגעה בו - אל תהסס להחליף אותו עם שלי. שימו לב: העדפתי למקם תפריט תחת הכותרת באתר (ברירת המחדל היא לעיל) - כך ההסתגלות שלי כללו העדפה זו גם כן.
11. טען הארכיון כולל את כל תיקיות המשנה והקבצים שלך תחת נושא התזה מדריך "מותאם אישית", כמו זה:
    .../themes/THESIS-DIR/custom/custom_functions.php
.../themes/THESIS-DIR/custom/jquerycssmenu/...
    לא נגעתי custom.css - אני מעדיף לשמור על תפריט ספציפי CSS תחת המיקומים שלהם כדי למנוע יצירת בלאגן בתוך custom.css
12. בשלב זה אתה עשוי לטעון מחדש את אתר האינטרנט שלך ולראות יפה חדש חדש מדורגת, תפריט מקונן, SEO אופטימיזציה.
13. תוכל תמיד לחזור להגדרות NAVT ולהתאים אישית בתפריט שלך עם מבחר גדול יותר או למקם כל דבר. זה יבוא לידי ביטוי באתר הפעיל באופן אוטומטי.

הדרך קדימה ...

הדרכה זו כללה למשל יצירתי של סוג אחד של תפריט. שיחקתי עם עוד אחד - רק כדי לראות איך אפל תפריט צבעוני ייראה:

נושא התזה - תפריט מדורגת מקוננות CSS - צבעים כהים

אני חושב שזה די נחמד. ישנן דוגמאות רבות נוספות ניווט זמין ב Dynamic Drive - כל אחד מהם אפשר להתאים אישית עבור תזה ושאר נושאים Wordpress עם קצת מאמץ:

כונן תפריטים דינמי אופקי

אני מקווה תמצאו במדריך זה מועיל ושימושי. כפי שאמרתי, אפשר להתאים אישית כל התפריטים האלה תזה - שניתן זמן ורצון לגרום לזה לקרות.

יכולתי לעשות את העבודה הזאת בשבילך על בסיס חוזה. רק לבחור את התפריט שאתה רוצה, צרו איתי קשר ואני אעבוד על הקוד והוראות עבור אתר האינטרנט שלך.

20 $

וכמובן, אם אתה עד לבניין העל SEO אופטימיזציה wordpress פרמיה לחברות הפורטל - הפתרון הטוב ביותר לכך:
נושא תזה + חברות MemberWing תוסף + Wordpress באירוח עצמי כמובן.

שתייגת כמו: תפריט CSS עבור wordpress , נושא לתזה , נושא התזה תפריטים היררכיים , נושא התזה תפריט מדורגת , נושא nagivation התזה , נושא התזה מקוננות בתפריטים , נושא התזה הדרכה , css wordpress תפריט , תפריט wordpress מקוננות