תזה נושאים - multilevel, מקוננת, תפריט ידידותי SEO - מדריך

תזה נושאים הדרכה - הוספת multilevel, תפריט מקונן, SEO ניווט ידידותי Wordpress

לפי gesman על 8 יולי 2009

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

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

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

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

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

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

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

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

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

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

  1. עבור פאנל הניהול וורדפרס. Plugins-> Add החיפוש החדש, עבור navt ". תוסף יוצג. לחץ על [התקן], [התקן כעת], "להפעיל תוסף".
  2. Tools-> NAVT רשימות, בתוך "הניווט קבוצת" שטח למצוא "שם קבוצה" והזן: "menu1" בשדה, הקש [יצירת כפתור]. "Menu1" שטח המלבן יש יצר.
    זה "menu1" השטח יהיה מגרש המשחקים העיקרי לבניית התפריט. אתה תהיה גרירה ושחרור כאן אלמנטים בתפריט שלך.
  3. ב "נכסים" באזור מוצא "listbox אחרים" ולחץ על הבחירה "," הבית. "הבית" thingie יופיע בתוך "מוקצים" באזור. מוזר, הא? אל דאגה, כל עוד זה עובד - וזה יהיה עבורנו.
  4. גרור את "הבית" thingie מ "נכסים" אזור לאזור "menu1 מלבן. זה יהיה "הבית" פריט בתפריט.
    • חזור על שלבים 3-4 עבור כמה דפים מן השטח "," דפים, כמו גם עבור קטגוריות ב "קטגוריות" באזור. גרור כל פריט אחר שאתה רוצה להיות בתפריט שלך בפנים "menu1" מלבן. אתה יכול ללחוץ על דפים, קטגוריות, משתמשים ועוד כמה אלמנטים מותאם אישית, כגון מחיצת "הרשימה" ואת "הבלוק הקוד". בלוק קוד מגניב דרך להוסיף קטעי טקסט מותאמות אישית בתוך התפריט.
    • אתה יכול לגרור פריטים בתפריט הפנימי "menu1" השטח כדי לארגן מחדש את סדר שלהם.
    • ניתן להתאים את מיקום היררכי של כל פריט בתפריט עם "<" ו - ">" חיצים.
    • לחיצה על שם הטקסט של כל פריט בתפריט - פותח את המוח משגע שיח התאמה אישית נוספת עבור פריט זה. השתמשתי בעיקר ברירות מחדל, אבל מבחינה טכנית אתה יכול להשתגע ולהתחיל החלטות בתפריט מבוססות תמונה ולהוסיף חתיכות של קוד ה-HTML לתוך זה. להתקדם בזהירות אף.
    • עבור תפריטי משנה unclikable חוליות כי ישמש "ההורים" על "משנה אחרים, הילדים" נהגתי "בלוק קוד" סוג. לדוגמה, כאשר התאמה אישית של קוד כזה לחסום פריט נכנסתי עבור "המכונה בתפריט" = "MemberWing" ועל "הכנס לחסום את הקוד:" = "<a href='#'> MemberWing </ a>". לאחר href = "#" תעשה את זה לא ללחוץ, אבל מתנהג כמו חוקי ההורה "" בחירה בתפריט.
  5. הנה כמה "menu1 NAVT 'שלי לבנות מבנה שנראה כמו כמעט הושלמה:
    navt_building_icon
  6. המבנה הראשוני על סיום ולאחר מכן לחץ על הילוך "" סמל להתאים אישית את מבנה התפריט שלך:
    navt_customize_menu
  7. זה יפתח דיאלוג עם 4 כרטיסיות: אפשרויות, תצוגה, CSS, נושאים.
    1. יש להקליק על "אפשרויות" לשונית ולוודא שהכל אינה מסומנת "שם קבוצה", אומר: "menu1"
    2. יש להקליק על "תצוגה" הכרטיסייה לוודא שהכול על "קבוצת ניווט הצג על ..." הוא בדק את השטח [x]. השאירו את השאר על ברירת המחדל.
    3. עבור לכרטיסייה "" ו CSS לחצן הבחירה לבחור (x) "לא יחולו שיעורי CSS".
    4. עבור אל "נושאים" הכרטיסייה ולמלא אותו ככה:
      navt_configuration_theme_tab_icon
      הכנס לתוך "הוספת תגים לפני ..." האזור הזה קוד:
      <div id='myjquerymenu' class='jquerycssmenu' style='margin-top:5px;'>
      הכנס לתוך "הוספת תגים אחרי ..." האזור הזה קוד:
      <br style='clear: left' /></div>
    5. עיתונות [לשמור / קרוב] כפתור
  8. בבניין הזה בתפריט הצבע מבפנים NAVT אפשרויות תוסף תושלם.
    עכשיו זה הזמן לעשות מנגינה קטנה בשביל כדי לקבל את זה מוכן. בשביל זה אנחנו צריכים להוסיף קבצים מותאמת אישית כמה - CSS ו-JavaScript השייך לתפריט ולעדכן custom_functions.php "תזה
  9. הורד את סט שלם של קבצי כאן .
  10. לפתוח הארכיון. אם עדכנת 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 ולהתאים אישית בתפריט שלך עם הבחירה או יותר למקם כל דבר. זה יבוא לידי ביטוי באתר הפעיל באופן אוטומטי.

את הדרך ...

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

Thesis theme - multilevel nested CSS menu - dark palette

- מקוננות התפריט CSS multilevel - כהה צבעים

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

Dynamic Drive Horizontal Menus

Dynamic Drive תפריטים אופקי

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

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

$ 20

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

השאירו תגובה

קודם לכתוב:

ההודעה הבאה: