5 דרכים לעצב כפתורי הנעה באלמנטור

5 דרכים לעצב כפתורי הנעה באלמנטור

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

מהם כפתורי הנעה לפעולה ומדוע הם חשובים?

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

דרכים לעצב כפתורי הנעה באלמנטור:

1 – הוספת כפתור צף:

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

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

כעת הוסיפו אלמנט של אייקון לבלוק זה. חזרו לעריכת הבלוק וקבעו שרוחב העמודה תהיה ברוחב מלא ולא BOXED. כעת חזרו לעריכת האייקון ובצעו יישור של האייקון לצד ימין. כעת שנו את האייקון לאייקון של טלפון ובחרו בתצוגה להגדיר את הכפתור עם רקע. תוכלו מתחת לאופציה זו לבחור את צורת הכפתור/הרקע. באזור הקישור הוסיפו tel: ואת מספר הטלפון עמו יצרו אתכם קשר וללא רווחים. לדוגמה: tel:054-7787787

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

טמפלטים

כפתור הנעלה לפעולה

2 – כפתור 2 צבעים:

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

לאחר שנכנסתם לעריכת הכפתור שלכם באלמנטור היכנסו ללשונית ה”סגנון” סדרו תחילה את הטיפוגרפיה שאתם רוצים: סוג הפונט, מרווח בין האותיות, עובי הפונט, גודל וכו’. כעת באזור הצללת הכפתור בחרו בצבע שאתם רוצים עם הגדרת capacity חצי שקוף. התאימו את הנתונים לפי הסדר הבא: -100, 20, 0, -59

כעת באזור ה”מעבר” הגדירו צבע רקע אחר שיופיע עכבר תשימו את העכבר. שמרו והכפתור מוכן.

 

3 – כפתור מעוגל פינות:

רוצים כפתור אליפסי יפה עם פינות מעוגלות? ובחן כדי לעשות זאת היכנסו לעריכת הכפתור. הגדירו בטיפוגרפיה את סוג הפונט וגודל הכפתור וגודל הכתב שאתם רוצים. לאחר מכן בחרו בצבע הכפתור שאתם חפצים בו. לאחר מכן באזור הרדיוס של הכפתור הגדירו 50 על הכול. מומלץ להגדיר ב”מעבר” תחת המאפיין “אנימציית מעבר” לבחור ב-shrink או כיווץ בעברית. הכפתור מוכן!

 

4 – כפתור פינות מחודדות עם אייקון:

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

בעריכת הכפתור בלשונית התוכן בחרו את הטקסט שתרצו מתוך הכפתור, בצעו יישור לטקסט כרצונכם וגם גודל הטקסט והכפתור. כעת בחרו את האייקון שתרצו שיופיע לצד הטקסט בתוך האייקון ואת הריווח שלו ביחס לטקסט. לאחר מכן עברו ללשונית “סגנון” ובהגדרות של עיגול פינות בחרו ב0 על הכול. מתחת לזה באזור השוליים הפנימיים בחרו ב15-30 כרצונכם.

כעת בחרו בלשונית “מעבר” ובחרו סוג מסגרת -> רגיל וברוחב בחרו ב-2 על הכול. כעת בצבע הטקסט בחרו בצבע של הכפתור (לדוגמה אם הכפתור היה ירוק במצבו הרגיל בחרו בצבע ירוק לצבע הטקסט), צבע הרקע הגדירו כלבן וצבע המסגרת כירוק בהמשך לדוגמה שלנו. לחצו על שמור וכעת נסו לעבור עם העכבר.

5 – כפתור לבן עם צל:

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