כיצד להוסיף תמונות ממוזערות כדי הודעות קשורות ב - WordPress
ש: האתר שלך מועיל לי מאוד. אתה יכול בבקשה להגיד לי איך לשלב את ההודעות הקשורות כמו באתר שלך שלי? ניסיתי הרבה חלופות, אתה יכול בבקשה להגיד לי איך אתה מוסיף כי הודעות הקשורות עם תמונות ממוזערות?
אם אתה גולש לעתים קרובות באינטרנט, תוכל להבחין כי בלוגים רבים מציגים תמונות ממוזערות של תמונות עבור סעיף הודעות קשורות, בדיוק כמו מה שעשינו ב Make Tech easyier. וורדפרס, ישנן מספר דרכים שניתן לעשות זאת. בוא נבדוק את זה.
באמצעות תוסף
הדרך הקלה ביותר ליישם את התמונה הממוזערת (ללא כל קידוד) היא באמצעות תוסף. LinkWithin הוא אחד כזה כלי שאתה יכול להשתמש. היתרון של LinkWithin היא שזה לא לוקח את כל שטח השרת ואת רוחב הפס (כדי לאחסן את התמונות הממוזערות) ויש מעט (או אפס) תצורות צריך להיעשות.
עבור אל LinkWithin. מלא את הפרטים בעמוד הראשון.
לחץ על קבל יישומון . לאחר מכן תועבר לדף שבו תוכל להוריד את הפלאגין.
התקן והפעל את הפלאגין. הפוסט הקשור לתמונה הממוזערת שלך יופיע מיד בבלוג שלך.
טוב כמו שזה יכול לקבל, יש כמה חסרונות והגבלת השימוש LinkWithin.
- יש שליטה מוגבלת עבור משתמש הקצה: אינך יכול להגדיר איזו תמונה ממוזערת שתוצג עבור כל פוסט.
- אתה לא יכול לשנות את הגודל ואת סגנון של יישומון.
- לא ניתן להגדיר את המיקום שבו יופיע הווידג'ט. ברירת המחדל היא שתופיע מיד לאחר סיום תוכן הפוסט, אך יש פעמים שבהן תרצה להוסיף פרטי מחבר או פרסומות לפני הפוסט הקשור. במקרה זה, זה לא שימושי.
פריצה קובץ הנושא WP
הדרך הטובה ביותר להתאים אישית את חוויית המשתמש היא להיכנס לקובץ הנושא ולעשות קצת פריצה. זה יחייב קצת ניסיון קידוד.
ראשית, באמצעות ההוראה כאן, להפעיל את התכונה תמונה ממוזערת (רק ישים ב WP 2.9 ומעלה).
לאחר מכן, להתקין ולהפעיל את עוד הודעות הקשורות plugin. מה אני אוהב על זה את היכולת להשתמש במערכת תבנית כדי לסדר את תוכן ההודעה בנושא.
בתיקייה תוסף YARPP, עבור לתיקייה yarpp-templates ולהעתיק את הקובץ "yarpp-template-thumbnail.php" לתיקיית הנושא שלך.
הבא בדף אפשרויות WordPress YARPP:
- בטל את הסימון של " הודעות הקשורות לתצוגה אוטומטית? "
- בחר את מספר ההודעות הקשורות שברצונך להציג
- בחר את yarpp-template-thumbnail.php מהרשימה הנפתחת של קובץ התבנית.
פתח את "yarpp-template-thumbnail.php" בעורך טקסט. החלף את הקוד הבא.
תמונות קשורות
has_posts ()):?>
- has_posts ()): $ related_query-> the_post (); ?>
אין תמונות קשורות.
מה קוד זה עושה הוא לבדוק אם יש תמונה ממוזערת עבור כל הודעה בנושא. אם כן, הוא יציג את התמונה הממוזערת ואת הקישור הקבוע.
לאחר מכן, בתיקיית הנושא, פתח את הקובץ " single.php " והוסף את השורה הבאה לחלק שבו ברצונך להציג את הפוסט הקשור:
לבסוף, אנחנו צריכים לעשות קצת סגנון. העתק והדבק את קוד הסטיילינג הבא לקובץ style.css שלך.
.related_posts ul {width: 100%; style-style: none; שוליים: 0; ריפוד: 0; } .related_posts li {display: inline; צף: משמאל; שוליים: 0; padding-left: 0; ריפוד-ימין: 10px; רוחב: 140px; / * שנה ערך זה בהתאם לתבנית שלך * /} .related_permalink {width: 140px; / * שנה ערך זה בהתאם לתבנית שלך * / text-align: left; font-size: 0.85em; padding-top: 5px; } .related_thumbnail {width: 140px; / * לשנות ערך זה בהתאם לגודל התמונות הממוזערות שלך * / height: 80px; overflow: hidden; text-align: center; }זהו זה.
קרדיט תמונה: wuzhao.album