דוגמא לשינוי Rollover Button בעמוד האתר

 

 

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  1

rollover button הוא סוג של קישור אשר משנה את עיצובו (צבע, צורה) כאשר עוברים עם סמן העכבר מעליו.

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

לכן בכדי לשנות את עיצוב הקישורים אנו צריכים בעצם לשנות את עיצוב התמונות האלה.

תמונות הלינקים ככל התמונות צריכות להימצא בתיקיית התמונות של האתר (תיקיית images).

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  2

 

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

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  3

ניתן לפתוח את התמונה ע"י קליק ימני עליה ובתפריט 'פתח באמצעות' לבחור את תוכנת Photoshop.

אפשר גם לגשת אל התמונה דרך התפריט 'File' ולבחור ב 'Open' בפוטושופ עצמה.

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  4

כעת נפתח גם את תמונת ה rollover בפוטושופ.

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  5

פתחנו את שתי התמונות (כל אחת בנפרד) בפוטושופ.

המדריך המקיף לבניית אתר - איך לשנות Rollover Button באתר -  6

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

 

להמשך המדריך -

לעמוד הבא במדריך עמוד 1

 

 

המדריך לבניית אתר - העמוד הראשי

 

1. ההכנות לבניית האתר

2. כתיבת תוכן האתר

חזרה למעלה

3. חזרה למדריך עיצוב תבנית האתר

4. המשך תהליך בניית האתר

5. סיום תהליך הקמת האתר

 

 

 

 

 

document translation responsive_wp_250x250 300X250_01