ינשוף קרוסלה: התקנה וקישוריות

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

מה זה ומדוע כדאי לבחור את המחוון הזה?

ינשוף קרוסלה, אשר ההגדרה תהיהנחשב במאמר זה, הוא מאוד יעיל התוספת מוסיף לדף שלך מחוון נחמד ונוח זה יהיה מאוד להקל על העבודה שלך באתר, ומאפשר לך לחסוך הרבה זמן, מאמץ וכסף. מהם היתרונות של תוסף זה, כי יש הרבה מחוונים באינטרנט? העובדה היא כי המחוון הזה מציע לך כמה עשרות אפשרויות התאמה אישית, אשר יאפשר לך להפוך את הדף שלך ייחודי unrepeatable. זהו תוסף אדפטיבית כי יעבוד על כל הגירסאות של דפדפנים, וזה יכול בקלות להיות מחובר WordPress ו CMS פופולרי אחרים. באופן כללי, היתרונות של המחוון הזה הוא מאוד, אז אתה בהחלט צריך לעשות בחירה לטובתה. עם זאת, לפני שתתחיל הגדרת ינשוף קרוסלה, זה התוספת צריך להיות מוריד.

הורד

הגדרת ינשוף קרוסלה 2 אינו אפשרי אם לאלהוריד אותו למחשב שלך, ומכיוון שזו הוראה צעד אחר צעד, זה שווה להתחיל מההתחלה. אז, התוכנית ניתן להוריד בעזרת מנהלי החבילות, אבל אלה הם כלי פיתוח מתקדמים, אז הנה זה ייאמר איך להשיג תוסף זה בדרך סטנדרטית. אתה צריך ללכת לאתר הרשמי של תוסף ולהוריד את הגרסה האחרונה שלה. אחרי זה, את כל הקבצים שהורדו צריך להיות מועבר לספרייה של האתר שלך, הכנת תיקייה נוחה, אשר נקרא זהה plugin עצמו. שים לב כי תוסף זה משויך jQuery, אז אתה גם צריך ספריה זו זמינה. ובכן, כאשר אתה מוריד את התוספת, תצטרך לקחת את הצעד הבא, כלומר את המחוון הגדרה של ינשוף קרוסלה 2.

CSS

ב ינשוף קרוסלה 1.3 הגדרות נשארות כמעט זהות בגירסה השנייה החדשה, רק פונקציות חדשות מתווספות. עם זאת, המידע הבסיסי יהיה זהה, החל עם הוספת CSS למסמך שלך. לכן, הצעד הראשון הוא להוסיף שורה לקוד ה- HTML <link rel = "stylesheet" href = "owlcarousel / owl.carousel.min.css">. מה זה נותן לך? זוהי מחרוזת הטוענת את הסגנונות הדרושים באתר להצגת המחוון. על זה אתה יכול לסיים, לעשות עיבוד ויזואלי עצמך. עם זאת, יש פתרון נוח ומהיר יותר. ניתן גם להוסיף שורה <link rel = "stylesheet" href = "owlcarousel / owl.theme.default.min.css">, אשר גם טוען נושא רגילהמחוון, מה שהופך אותו מיד מוכן לשימוש. אתה יכול לערוך כמה סגנונות על ידי הפיכת המחוון שלך ייחודי יותר יוצא דופן, וגם מתאים יותר לתוכן שלך. באופן טבעי, ההגדרות של ינשוף קרוסלה ברוסית יהיה נוח מאוד, אבל כל אדם שיוצר אתרים, צריך להבין כי ללא ידיעת אנגלית, הוא לא יכול לעשות.

חיבור JavaSpript

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

ביצוע קוד HTML

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

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

התקשר אל הפלאגין

ובכן, הדבר האחרון שאתה צריך לעשות כדי האתר שלך יש המחוון המוכן היא להשתמש בלוק זה של קוד:

$ (document) .ready (function () {

$ (".wl-carousel").

});

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

התאמת המראה והפונקציונליות של המחוון

אז, מה פקודות אתה יכול להשתמש,כדי להתאים את המחוון? קודם כל, אתה צריך לזכור את הפקודה פריטים, שכן עם זה אתה יכול לציין מספר מסוים של שקופיות המחוון שלך. הפקודה לולאה מאפשרת לך לבחור אם לולאה את המחוון, או להפסיק את הגלילה על האלמנט האחרון. יש גם את הפקודה גרור, אשר יש כמה אפשרויות, למשל, עכבר ומגע. במקרה הראשון, אתה יכול לעשות את זה אלמנטים של המחוון ניתן לגלול עם עכבר מקוטע, ובמקרה השני - עם מגע (פקודה זו מתאימה למכשירים ניידים). פקודה חשובה נוספת היא Nav, הכולל את התצוגה של חיצי ניווט. יחד אתה יכול להשתמש בפקודה navText, הוספת תוויות ללחצני הניווט. כמו כן, אתה לא צריך לשכוח את הפקודה autoplay, אשר מאפשר לך להפעיל ולכבות את ההתחלה האוטומטית של שקופיות של המחוון שלך כאשר הדף נטען. יחד עם פקודה זו, אתה יכול גם להשתמש autoplayTimeout, שעבורו ניתן לציין ערך ספציפי של אלפיות השנייה אשר יקבע את הזמן בין היפוך אוטומטי של כל שקופית.

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