"למעלה" כפתור עבור האתר: איך לעשות את זה
פונקציה זו, כמו כפתור "למעלה" עבור אתר,עושה את משאב האינטרנט נוח יותר עבור המבקרים שלה. זה עוזר לעבור בקלות מכל מקום בדף הדף שלה. זה רק הכרחי עבור חנויות מקוונות ואתרים עם מאמרים גדולים הדורשים ארוך לגלול למטה.
בשביל מה?
כרגע על רוב האתרים כגוןפונקציות, כמו כפתור "למעלה", לא, ואין שום דבר קריטי על זה. אבל השימוש בו יכול להביא pluses רבים הן עבור משאב האינטרנט, ועל המבקרים שלה.
הטבות למבקרים
זה קורה לעתים קרובות כאשר הדף של משאב האינטרנטהוא טעון בכבדות עם כמות של מידע כאשר מאמר מידע תופסת הרבה מקום ואתה צריך לגלול את הדף עם גלגל העכבר. בנוסף לכך, בסוף המאמר יש תגובות רבות לכך.
כאשר מבקר קורא מאמר, שום דברמייגע לגלילה למטה הדף לא, אבל כאשר הטקסט הגיע לקצה יש צורך לנוע כלפי מעלה, זה מתחיל צמיג קצת. רוב האנשים פשוט להיות עצלן מדי להוביל מגילה ארוכה, והם פשוט לסגור את האתר, במקום לטייל עדיין דרך המרחבים שלה.
באמצעות הלחצן כדי לעבור באופן מיידי לראש הדף עושה בילוי באתר נוח יותר.
יתרונות למשאב אינטרנט
הצדדים החיוביים עבור המשאב עצמו באמגורמים קודמים, משום שתנועה פשוטה באתר משפרת גורמים התנהגותיים, שכן כל המבקרים יהיו פעילים יותר במעשיהם ויעברו לדפים אחרים.
לפיכך, גורמים התנהגותיים אלה משפיעים על היחס של כל מנועי החיפוש לאתר ומובילים לשיפור במיקום של תוצאות החיפוש.
כיצד להפוך את הכפתור "למעלה" באתר בעצמך
אנו מבינים עוד. לחצן גלילה למעלה עבור אתר על כל אחד CMS תמיד יכול להיעשות על ידי עצמך, רק כמה צעדים פשוטים מאוד:
- יצירת תמונה;
- יצירת תסריט;
- יצירת סגנון כפתור;
- הוספת לאתר.
תמונת לחצן
כדי להוסיף כפתור "למעלה" באתר, עבוריהיה עליך לבצע את הסמל עצמו, כאשר לוחצים עליו, המשתמש יעביר את הדף. לשם כך, ניתן להשתמש באפשרויות מוכנות, וביניהן ניתן תמיד לבחור את המתאים ביותר.
כדי לשפר את המראה של הכפתור, אתה צריך לעשות כמה שיפורים, כלומר, לעשות שדון, המאפשר לך לשלב תמונות רקע על בסיס CSS, ובכך ליצור אנימציה מהם.
עבור יצירות גרפיות, ניתן להשתמש בכל עורך. אבל האפשרות הנוחה ביותר תהיה PIXLR שירות מקוון, כפי שאתה לא צריך להוריד שום דבר כאן ואתה יכול להשתמש בו נכון בדפדפן שלך.
כדי להתחיל לעבוד בחלון העריכה שמופיע, בחר בשדה "העלה תמונה מהמחשב". כדוגמה, לקחת את התמונה של הרקטה.
אם גודל הסמל הנבחר גדול מדי, אם כןיהיה עליך לבצע התאמה קטנה לגודל. כדי לעשות זאת, עבור אל התפריט העליון ובחר את "ערוך" השדה, ולאחר "חינם להפוך ..."
ליד התמונה יש מיוחדסמנים, על ידי הזזת אשר, ניתן לשנות את גודל התמונה. כדי לשמור את הפרופורציות, אתה יכול להשתמש במקש Shift, על ידי clamping אותו, אתה צריך להעביר את סמנים כחולים. בתום פעולות אלה מתקבלת תמונת הרקטה.
השלב הבא הוא ליצור עותק של השכבה.
עכשיו אתה צריך להעביר את התמונה רקטה משכבה חדשה קצת למעלה. כדי לעשות זאת, זה יהיה נוח להשתמש בכלי להעביר, הנמצא בעמודה השנייה של התפריט השמאלי, ואת החץ "למעלה" על המקלדת.
עכשיו אתה צריך לעשות את התמונה העליונה בשחור לבן. זה יכול להיעשות באמצעות "תיקון" - "הגוון / הרוויה" פריט בתפריט העליון. לשינוי צבע מלא, יש להגדיר את מחוון הרוויה ל -100. פעולה זו תעשה את האפקט כי כפתור "למעלה" יהפוך שחור ולבן לצבע בעת ריחוף זה.
המגע הסופי הוא הסרת שטח עודףסביב שתי תמונות. לשם כך, בחר את הפריט "חתוך" מהתפריט השמאלי ובחר רק שני טילים במלבן. כדי לבצע את החיתוך, הקש על מקש Enter.
התוצאה היא תמונה שאין בה מרחב עודף. זה יהיה צורך להקליט את רוחב וגובה של התמונה המתקבלת, שכן נתונים אלה יהיו שימושיים בשלב הבא.
כדי לשמור עליך ללחוץ על "קובץ" -"שמור", שם בחלק השמאלי של "המחשב שלי" אנו רושמים את שם התמונה (רק פריסה אנגלית), בחר את הפורמט (במקרה זה, PNG) ולחץ על הלחצן "כן".
קובץ עם סקריפט כפתור למעלה
כתיבת תסריט במקרה זה אינה הכרחית. ניתן יהיה להשתמש באופציה הזמינה לציבור, ולבצע כמה תיקונים לקוד הסתיים.
לשם כך, עליך להוריד כל עורך קוד. האפשרות הפופולרית ביותר בחינם הוא Notepad + +. לאחר התקנתו, עליך להעתיק ולהדביק את כל הקוד לתוכה:
| <script type = "text / javascript"> $ (מסמך).($) $ ($) $ ($) $ ($) ($) ($) ) ($) ($) ($) ($ body, html). );}); </ script> |
לאחר מכן, לחץ על התפריט העליון "קובץ" - "שמורכמו ... ", ולאחר מכן נשמור את הקוד בפורמט .js. לאחר מכן, תוכל להשתמש בקוד זה באתר האינטרנט שלך על ידי העלאת קבצי Script ותמונות אליו באמצעות חיבור FTP.
התקנה באתר
כדי להגדיר את לחצן הגלילה עבור האתר, עליך למקם את הקוד במיקום הרצוי. עליך להזין אותו לפני התג </ body>.
יצירת סגנון כפתור ב- CSS
לרוב, כפתור "למעלה" עבור האתר ממוקם בתחתית ("מרתף").
יש להזין את הקוד הבא בקובץ style.css של האתר:
"/ * לחצן למעלה * / .scrollTop { |
במקרה זה, אנחנו צריכים את הנתונים רוחב וגובה של התמונה. זה נשאר רק להזין את הנתונים בקוד, ואת כפתור "למעלה" עבור האתר יהיה מוכן! מה עוד?
לחצן למעלה עבור אתר Wordpress
עבור CMS זה, כפתור "Up" יכול להיעשות באמצעות plug-ins, כמו גם באופן עצמאי.
השיטה עם תוספות הוא הכי נוח וקל להתקנה, כמו זה אתה רק צריך ללחוץ על כפתור ההתקנה ולהגדיר את כל הפונקציונליות בתפריט התוספת.
על ידי בחירת האחרון צריך לבוא עםזהירות, כי עם זה אתה יכול בקלות לרכוש וירוס באתר. האפשרות הפופולרית והמוכרת ביותר היא תוסף שנקרא Scroll Back To Top. אתה יכול להוריד אותו באמצעות חיפוש רגיל תוסף Wordpress.
לתוסף זה יש מספרפונקציונליות, וזה יהיה קל מאוד להתאים אישית את כפתור "למעלה" עבור אתר Wordpress. אין צורך לשנות את כל הערכים, אתה רק צריך להגדיר את המראה והמיקום של הכפתור בדף האתר.
כפי שאתה יכול לראות, הגדרת כפתור למעלה עםplugins היא פשוטה מאוד. אבל יש ניואנס אחד חשוב, אשר מורכב בעובדה שכל תוסף מותקן טוען את CMS. זה עשוי להשפיע על המהירות של משאב האינטרנט. לכן רוב בעלי האתר מנסים לבצע את כל השינויים ישירות בקוד, ולא בעזרת הרחבות של צד שלישי. אתה יכול לעשות את הכפתור "למעלה" עבור האתר ב- HTML, אשר יהיה למזער את המשאבים הנצרכים.
לפני שינוי כל קבצי מערכת Wordpress, עליך לגבות אותם. לאחר מכן תוכל לבצע את כל השלבים ליצירת לחצן משלך, המתואר למעלה.
דפוק על ג 'ומלה -
ג 'ומלה CMS תומך גם התקנה plugin, בדיוק כמו Wordpress. האפשרות המוצלחת ביותר עבור לחצן למעלה עבור אתר ג'ומלה 3 היא הרחבה בשם הדף של הדף.
ב CMS זה, כל התוספת ניתן להתקין באמצעות "מנהל הרחבה". בשביל זה אתה צריך:
- להוריד את הפלאגין באינטרנט;
- לחץ על כפתור "עיון" במנהל התוסף;
- בחר את הארכיון שהורד;
- לחץ על "הורד" והתקן.
עכשיו אתה צריך להפעיל אותו "מנהל Plugin". לשם כך, עבור לסעיף זה, מצא את הפלאגין והפעל את המצב למצב "פועל".
הבא מגיע תצורה של כל הפרמטרים הרחבה באמצעות אותו סעיף שבו אתה צריך למצוא את "הפרמטרים העיקריים" זה התוספת בצד ימין.
בחלק העליון של הדף יש את הפונקציונליות הבאה:
- הפעל / מנהל - לאפשר את האפשרות לא רק על המשאב באינטרנט, אלא גם בלוח CMS Joomla עצמו.
- כפתור לחשוף את המיקום - כמה פיקסלים המשתמש צריך להירגע על מנת לחצן למעלה יופיע.
- בטל טקסט לחצן - נוכחות של טקסט על הכפתור.
- תמיד בראש הדף - דף האתר יוצג כל הזמן מתחילתו. בעת שימוש בעוגנים כדי לגלול למקום מסוים בדף, אפשרות זו לא צריכה להיות מופעלת.
- גלילה חלקה - הופך את הדף לגלילה חלקה יותר.
- משך גלילה - הזמן שאחריו הדף מועבר במלואו לתחילתו.
- מעבר גלילה - מוסיף אפקטים חזותיים גדולים של גלילה.
- מעבר הקלות - "הקלות" מעבר לראש הדף.
- מיקום הקישור - מיקום הסמל. לפי התקן, הלחצן נמצא בפינה הימנית התחתונה.
- 'סגנונות שימוש' הוא סגנון לחצנים בודדים שניתן להגדיר בשדה למטה. אם עבר לערך שלילי, כל הפרמטרים של סגנון יילקחו מהנושא הפעיל של האתר.
- סגנון קישור - שדה להזנת פרמטרים של סגנון כפתור משלך.
עבור כוונון עצמי את הסגנון של כפתור "למעלה", אתה חייב להיות לפחות ידע מינימלי של CCS. אחרת, יש צורך להחליף את הערך של הפרמטר הלפני אחרון "לא".
עוד ניואנס חשוב זההכיתוב הרגיל על הסמל מכיל את הטקסט באנגלית: חזרה למעלה. באתר בשפה הרוסית, טקסט כזה לא יכול להיות נוכח, אז אתה צריך פשוט להשבית אותו הגדרות plugin או לשנות את זה לרוסית.
כדי לשנות את הכתובת הזו, עליך לעבור אל הכתובתשרת האתר באמצעות FTP או מנהל הקבצים מוטבע אירוח. הבא, בספרייה "/ מנהל / שפה / en / GB /", אתה צריך למצוא קובץ בשם "en-GB.plg_system_topofthepage.ini".
לפני שינוי הטקסט, שנה את הקידוד של מסמך זה ל- utf-8. זה יעשה תצוגה נורמלית של אותיות רוסיות.
לאחר מכן, אנו מוצאים את השורה הבאה:
| "PLG_SYS_TOPOFTHEPAGE_GOTOTOP =" חזור למעלה "" |
ולשנות את הביטוי ציטוטים לרוסית. ניתן להשתמש בביטויים כגון "Up!", "Top!" או "Up!".
בסופו של דבר יהיה עליך לשמור את הקובץ שונה לבדוק את הנוכחות של כפתור "למעלה" עבור אתר ג'ומלה.
כפתור Ucoz למעלה
את הכפתור למעלה עבור האתר Ucoz יהיה צורך לעשות זאתבאמצעות הזרקת קוד, מאז plug-ins לא יכול להיות מחובר CMS זה. עם זאת, זה לא לוקח זמן רב כדי ללמוד את הקבצים של המערכת ולחפש את השורות הנדרשות, אתה רק צריך להכניס קוד קטן במקום הנדרש.
עבור ההתקנה נצטרך:
- עבור אל "לוח הבקרה -> עיצוב -> ניהול עיצוב (תבניות) -> החלק התחתון של האתר;
- להוסיף סקריפט (ניתן למצוא באתר הרשמי של הפרויקט ומשאבים צד שלישי).
מסקנה
לאחר מכן, יופיע סמל בפינה הימנית התחתונה, ויעביר את המשתמש לחלק העליון של הדף.
כפי שניתן לראות, את ההתקנה של כפתור "למעלה" עבורכל CMS לא היה קשה במיוחד. ניתן להשתמש בשיטת התקנה אוטומטית (plug-ins), וכן ידנית. עם זאת, האפשרות השנייה נותרת המתאימה ביותר, שכן היא אינה משפיעה לרעה על מהירות האתר.
ניתן להשתמש בלחצן למעלה עבור אתרHTML כדי למזער את צריכת המשאבים של האתר, שכן מספר רב של הרחבות יכול להיות בעל השפעה שלילית על המהירות של המשאב. תקע אחד של הלחצן "למעלה" לא יוכל להשפיע באופן משמעותי על זמן הטעינה של דפי האתר, אך ברוב המקרים למשתמש יש לפחות עשרה יישומי פלאגין מותקנים במערכת CMS. במקרה זה, כל תוסף יכול להשפיע לרעה על הביצועים של דפי האתר.
</ p>>
