לחצי על סוג הפילטר שתרצי לדעת פרטים עליו:)

SMART FILTER

הצגת דוגמאות לסוגי פילטרים

Learning

is fun

היי אלופות!
התחלנה לראות את הפילטרים בלייב:)

קטגוריה
קטגוריה
מה התקציב שלך?
מה התקציב שלך? - slider
מה התקציב שלך? - inputs
₪
₪
שנות אחראיות
שנות אחראיות - slider
0 — 3
מותג
מותג
צבע
צבע

שעון ורוד יפיפה ומגניב

מבצע!

שעון זהב עם לוחית כחולה ויפה מאוד

₪250 – ₪500

מבצע!

שעון זהב עם שחור

המחיר המקורי היה: ₪250.המחיר הנוכחי הוא: ₪180.

מבצע!

שעון ורוד יפיפה ומגניב לכל מי שרוצה יכול עכשיו במחיר השקה

המחיר המקורי היה: ₪550.המחיר הנוכחי הוא: ₪360.

מבצע!

שעון כסף מטורףף על היד

המחיר המקורי היה: ₪260.המחיר הנוכחי הוא: ₪230.

מבצע!

שעון עם לוחית ורודה

המחיר המקורי היה: ₪650.המחיר הנוכחי הוא: ₪580.

פירוט כללי על הסוג פילטר

פילטר עם אפשרות סימון בחירה

קטגוריה
קטגוריה

שם הפילטר:

checkboxes list

פתיחת הפילטר בוורדפרס

ניתן שם לפילטר שלנו
filter label – קטגוריה
Active Filter Label – קטגוריה
filter type – סוג פילטר בשם checkboxes list
texonomies – Data Source
texonomy – קטגוריות מוצרים
union- Relational Operator
(יש אפשרות לבחור גם בבחירה השניה בשם intersaction – מה שזה אומר שכשאבחר 2 קטגוריות, יופיעו לי רק המוצרים שמשוייכים ל2 הקטגוריות שסימנתי לפלטר על פיהם ואילו union –  יציג לי גם מוצרים מקטגוריה x וגם מוצרים מקטגוריה y
Show empty terms – תציג לי גם את הקטגוריות הריקות ( הכוונה שלא משוייך אליהם שום מוצר, יש אפשרות להציג ויש אפשרות להסתיר)
(Show only childs of current term – אפשרות להציג רק את תתי הקטגוריות (שימושי בדף קטגוריה))
Group terms by parents – תציג לי את הקטגוריות והתתי קטגוריות בצורה הררכית ( בפרונט באתר ע״י הוויג׳ט)
(Is Checkbox Meta Field (Jet Engine) – יש אפשרות שהפילטור יהיה מיתוך שדות מותאמים, שהם מסוג שדה checkbox (כמובן ע״י שנכניס את הid של השדה ))
(Exlude/include – כאן אני יכולה להחליט אם אם להחריג או להציג רק קטגוריות מסוימות)

זהו סיימנו:)
אפשר ללכת לאלמנטור ולגרור וויג'ט תואם לפילטר שלנו בשם checkboxes filter

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

הצגת הפילטר באלמנטור

בכדי לראות את הפילטר שפתחנו בוורדפרס, נגרור וויג'ט באלמנטור תואם לפילטר שלנו בשם checkboxes filter:

קוד css עבור

יש להכניס את הקוד css בוויג'ט, במתקדם css מותאם
מה הוא עושה:
1. מסדר רווח בין התיבות סימון לבין הקטגוריה
2. נותן רווח יותר גדול בין קטגוריה לתת קטגוריה, שההיררכיה תהיה בולטת
3. מדגיש את הקטגוריות הראשיות

פירוט כללי על הסוג פילטר

טווח מחירי מוצר

מה התקציב שלך?
מה התקציב שלך? - slider
מה התקציב שלך? - inputs
₪
₪

שם הפילטר:

RANGE

פתיחת הפילטר בוורדפרס

ניתן שם לפילטר שלנו
filter label – מה התקציב שלך
Active Filter Label – מחיר 
filter type – סוג פילטר בשם Range
Inputs enabled – אפשרות שהמחירים יהיו בתוך ריבוע עם חיצים
Values prefix -ש"ח ( קידומת שתופיע לפני הערך)
(Min Value  – מה ערך המינימלי שתרצה שיופיע בטווח
max  Value – מה הערך המקסימלי שתרצה שיופי)
Get min/max dynamically  woocommerce min/ max price (הכוונה תשאב לי את מחירי המוצר, בצורה דינאמית, מהמוצר הזול ביותר ועד המוצר היקר ביותר, (יש עוד אפשרות תחת הגדרה זו של: get from query meta key תשאב לי ערך מינימלי ומקסימלי מיתוך שדה מותאם)
Step –  מספר הצעד 50 שח
price – Query Variable –
נתתי ערך של מחיר מוצר בכדי שיידע את מה לסנן לי, לפי איזה שדה (יש שדות של ווקומרס, שמופיעות למטה, ויש שדות מותאמים של ג'ט אנג'ין) (יש הסבר על השדות של ווקומרס בוויג'ט checkboxes list)

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

 

 
הצגת הפילטר באלמנטור

בכדי לראות את הפילטר טווח מחירים
נגרור פילטר תואם בשם Range filter

 

פירוט כללי על הסוג פילטר

פילטר טווח ע"פ שדה מותאם

שנות אחראיות
שנות אחראיות - slider
0 — 3

שם הפילטר:

RANGE

פתיחת הפילטר בוורדפרס

ניתן שם לפילטר שלנו
filter label – שנות אחראיות
Active Filter Label – 
filter type – סוג פילטר בשם Range
(Inputs enabled – אפשרות שהערכים יהיו בתוך ריבוע עם חיצים)
(Values prefix -קידומת שתופיע לפני הערך
(Min Value  – מה ערך המינימלי שתרצה שיופיע בטווח
max  Value – מה הערך המקסימלי שתרצה שיופי)
Get min/max dynamically 
get from query meta key
תשאב לי ערך מינימלי ומקסימלי מיתוך שדה מותאם בשם "שנות אחריות"
(woocommerce min/ max price הכוונה תשאב לי את מחירי המוצר, בצורה דינאמית, מהמוצר הזול ביותר ועד המוצר היקר ביותר) 
Step –  מספר צעד 1
responsibility – Query Variable
נתתי id של השדה "שנות אחריות" בכדי שיידע את מה לסנן לי, לפי איזה שדה (יש שדות של ווקומרס, שמופיעות למטה, ויש שדות מותאמים של ג'ט אנג'ין, יש הסבר על השדות של ווקומרס בוויג'ט checkboxes list)

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

 

 
הצגת הפילטר באלמנטור

בכדי לראות את הפילטר טווח שנות אחראיות
נגרור פילטר תואם בשם Range filter

 

פירוט כללי על הסוג פילטר

פילטר המאפשר לנו להציג או תמונות או צבעים

מותג
מותג

שם הפילטר:

Visual

פתיחת הפילטר בוורדפרס

ניתן שם לפילטר שלנו
filter label – קטגוריה
Active Filter Label – מותג
filter type – סוג הפילטר visual 
texonomies – Data Source
texonomy – טקסונומיה בשם מותגים
Show empty terms – תציג לי גם את הקטגוריות הריקות ( הכוונה שלא משוייך אליהם שום מוצר, יש אפשרות להציג ויש אפשרות להסתיר)
Type – סוג הויזואל: תמונות(יש אפשרות לבחור צבעים)
Behavior – איך אני רוצה שיתפקד לי כמו checkboxes או  Radio שההבדל בינהם אפשרות של כמה בחירות סינון או אפשרות בחירה אחת (שיציג לי מוצרים רק ממותג אחד)
(Is Checkbox Meta Field (Jet Engine) – יש אפשרות שהפילטור יהיה מיתוך שדות מותאמים, שהם מסוג שדה checkbox (כמובן ע״י שנכניס את הid של השדה )
Options List – נתחיל להוסיף ידנית את שם הקטגוריה והתמונה שלה, נילחץ על NEW OPTION ויפתח לנו חלונית:
Label – שם הקטגוריה
Value – בחירת הקטגוריה שלנו (הערך) מיתוך רשימה שנפתחת
Image – הוספת תמונה

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

הצגת הפילטר באלמנטור

בכדי לראות את הפילטר  שפתחנו בוורדפרס, נגרור וויג'ט באלמנטור תואם לפילטר שלנו בשם visual filter

בקרוב...

פירוט כללי על הסוג פילטר

פילטור ע״פ ווריאצית צבע (אפשרי להציג כל ווריאציה שתרצו

צבע
צבע

שם הפילטר:

Visual

פירוט כללי על הסוג פילטר

פילטר חיפוש חופשי

שם הפילטר:

SEARCH

פתיחת הפילטר בוורדפרס

ניתן שם לפילטר שלנו
filter label – חיפוש
Active Filter Label – המילים שהקלדת
filter type – סוג הפילטר search
Placeholder – הכותרת שתופיע בשדה החיפוש (כמו כאן, חיפוש חופשי)
Search by – איפה אני רוצה שהחיפוש התבצע:
 defoult wordpress search – חיפוש דיפלוטיבי של וורדפרס, בדר"כ זה בשמות המוצרים, אפשר להרחיב את החיפוש לפי תגיות ועוד ע"י התקנת תוספים
(by custom field from query varible – חיפוש לפי שדות נוספים כמובן שאצטרך לשים את הid של השדה בquery varible)

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

הצגת הפילטר באלמנטור

בכדי לראות את הפילטר  שפתחנו בוורדפרס, נגרור וויג'ט באלמנטור תואם לפילטר שלנו בשם Search Filter

קוד css עבור

במידה ובחרתן בשיטת סינון של ajax on typing
יש להשתמש בקוד זה
יש להכניס את הקוד css בוויג'ט, במתקדם css מותאם
מעביר את טעינת החיפוש ואת הx לצד שמאל של השדה חיפוש

פירוט כללי על הסוג תוית

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

שם הפילטר:

Active
Tags

הצגת הפילטר באלמנטור

קוד css עבור

יש להכניס את הקוד css בוויג'ט, במתקדם css מותאם
פעולות שהקוד עושה:
1. מטפל בהדגשה של הטקסט המקדים
2.הופך לנו את הוויג'ט מצד ימין לשמאל ומימלא הכפתור נקה הכל יבוא מיצד שמאל של הטאבים
3.מבטל את הx בכפתור נקה הכל
4. מטפל בעיצוב הכפתור נקה הכל – הופך את המעבר צבע לרך יותר
שמנה לב! ברגע שנכניס את הקוד כל הוויגט התיישר לשמאל, בכדי ליישר לימין יש ללכת לסגנון נמצא תחת tabs list > Alignment ושם ניישר לימין

פירוט כללי על סוג הפילטר

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

שם הפילטר:

SORTING
FILTER

הצגת הפילטר באלמנטור

בקרוב...

פירוט כללי על הסוג הוויג׳ט

אפשרות לעבור למוצרים הבאים או הקודמים

שם הפילטר:

Pagination

בקרוב! התווספו עוד סוגי פילטרים

כל הזכויות שמורות לאפרת אסולין השימוש בדף זה הוא לבנות הקורס בלבד!

שם פרטי*
שם משפחה*
עיר מגורים*
טלפון*
מה האימייל שלך*
שם משתמש*
סיסמה*
אימות סיסמה*