כפתור קרא עוד – אלמנטור
לפעמים אנחנו נרצה להציג תוכן בטקסט שהוא מעט ארוך. אבל אנחנו לא רוצים שכל הטקסט יהיה גלוי אלא רק לאחר לחיצה על כפתור קרא עוד.
ככה נבצע את זה שלב אחר שלב
איך עושים כפתור קרא עוד?
כאן רושמים הרבה טקסט כדי שיהיה לנו הרבה תוכן שנוכל לסגור את התוכן בלחיצה על כפתור קרא עוד. אנחנו נרשום עוד תוכן על מנת לעבות את התוכן קצת יותר 🙂 והשלבים הבאים חשובים להמשך התהליך
בשלב הראשוני נגרור אלמנט של עורך טקסט של אלמנטור ונשים בCSS Classes את הטקסט הבא –
elementor-text-editor
בצורה הבאה:
לאחר מכן נגרור וידג'ט של HTML בדיוק מתחת לטקסט ונדביק את הקוד הבא
כרגע הטקסט יוצג לכם עם כפתור של קרא עוד ברגע שתשמרו שינויים ותצפו בעמוד.
בשורה הבאה תוכלו לשנות את מספר התווים שהטקסט יהיה גלוי
truncatedText.innerHTML = originalContent.slice(0, 200) + '…';
חפשו את השורה הזאת ותשנו את ה200 ל300 למשל אם תרצו ש300 תווים יהיו גלויים.
וככה זה אמור להראות: