WooCommerce מעונינת להחליף את המילה חיפוש לאיקון זכוכית מגדלת. כיצד?

macro

משתמש צעיר
עיצוב גרפי
D I G I T A L
בעמוד הזה: http://organzaplus.s610.upress.link/המוצרים-שלנו/
בצד ימין בחלק נעליון מעל התפריט הצדדי מופיע תיבת חיפוש מוצרים
אני מעונינת להחליף את המילה חיפוש באיקון חיפוש- זכוכית מגדלת.

איך עושים את זה?
 

חנה 1

משתמש פעיל
D I G I T A L
בקלות באמצעות CSS. תוסיפי לקוד הCSS של האתר את הקוד הבא:
קוד:
.woocommerce-product-search button[type="submit"]:after {
    content: "\f002";
    font-family: FontAwesome;
    font-size: 13px;
    display: inline-block;
    text-rendering: auto;
    font-weight: normal;
    -webkit-font-smoothing: antialiased;
}
.woocommerce-product-search button[type="submit"]{
    font-size: 0;
}

אם את לא עושה שימוש בקובץ CSS משלך - כתבי לי ואשלח לך 2 דרכים להוסיף CSS לאתר.

בהצלחה רבה
 

macro

משתמש צעיר
עיצוב גרפי
D I G I T A L
תודה
הוספתי, וזה עובד מצוין.
אבל ההובר מילת החיפש מופיעה שוב
ולא הצלחתי לבטל אותה גם שם.

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

ShirStudio

משתמש סופר מקצוען
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
UX UI
D I G I T A L
עברתי
תודה
הוספתי, וזה עובד מצוין.
אבל ההובר מילת החיפש מופיעה שוב
ולא הצלחתי לבטל אותה גם שם.

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

3333

משתמש פעיל
עברתי

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

ShirStudio

משתמש סופר מקצוען
מנוי פרימיום
בוגר/תלמיד פרוג
עיצוב גרפי
UX UI
D I G I T A L
עונה בשמה, שכן תסתכלי,
טיפ אני בדרך כלל חופרת על אתרים לחיצה ימנית על האיקון ובדוק מרכיב תביא אותך ישר לשורת הקוד שלה ששם רואים שזה קובץ גיפ
זה משדרג מאוד
 

חנה 1

משתמש פעיל
D I G I T A L
תודה
הוספתי, וזה עובד מצוין.
אבל ההובר מילת החיפש מופיעה שוב
ולא הצלחתי לבטל אותה גם שם.

כנראה אני טועה משהו בקוד
אשמח לעזרתך...
חוסר שימת לב שלי.
את הקוד הזה:
קוד:
.woocommerce-product-search button[type="submit"]{
    font-size: 0;
}
תחליפי בזה:
קוד:
.woocommerce-product-search button[type="submit"]{
    font-size: 0 !important;
}
 

macro

משתמש צעיר
עיצוב גרפי
D I G I T A L
פי בזה:
.woocommerce-product-search button[type="submit"]{
font-size: 0 !important;
}

עובד מצוין.
תודה!


על האתר וממש אהבתי את הקו העיצובי הנקי
איך עשית את האייקונים בעמוד הבית עם ההנפשה? זה קובץ גיפ?

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

אולי מעניין אותך גם...

הפרק היומי

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


תהילים פרק קיט א'

א אַשְׁרֵי תְמִימֵי דָרֶךְ הַהֹלְכִים בְּתוֹרַת יְהוָה:ב אַשְׁרֵי נֹצְרֵי עֵדֹתָיו בְּכָל לֵב יִדְרְשׁוּהוּ:ג אַף לֹא פָעֲלוּ עַוְלָה בִּדְרָכָיו הָלָכוּ:ד אַתָּה צִוִּיתָה פִקֻּדֶיךָ לִשְׁמֹר מְאֹד:ה אַחֲלַי יִכֹּנוּ דְרָכָי לִשְׁמֹר חֻקֶּיךָ:ו אָז לֹא אֵבוֹשׁ בְּהַבִּיטִי אֶל כָּל מִצְוֹתֶיךָ:ז אוֹדְךָ בְּיֹשֶׁר לֵבָב בְּלָמְדִי מִשְׁפְּטֵי צִדְקֶךָ:ח אֶת חֻקֶּיךָ אֶשְׁמֹר אַל תַּעַזְבֵנִי עַד מְאֹד:
נקרא  36  פעמים

לוח מודעות

למעלה