טיפים להאיץ את תהליך העיצוב באמצעות Elementor

טיפים להאיץ את תהליך העיצוב באמצעות Elementor

זה לא סוד ש- Elementor הוא אחד מבוני הדפים הטובים ביותר בקהילת WordPress כיום. וזה כבר לא סתם בונה דפים. אלמנטור התפתחה עד כדי כך שתוכל לעצב אתרים המתפקדים במלואם אפילו עם נושא וורדפרס בסיסי בחינם מבלי לכתוב שורת קוד אחת!


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

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

התחל עם תבניות Premade

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

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

אוספי תבניות נפלאים וחינמיים נפלאים זמינים באינטרנט.

שוק אנוואטו

שוק אנוואטו

שוק Envato הוא כנראה השוק הפופולרי ביותר לא רק עבור תבניות Elementor אלא עבור נושאים ותוספים של WordPress.

TemplateMonster

TemplateMonster

TemplateMonster הוא ספק אחר של נכסי התבנית באיכות טובה, יש להם גם כמה תבניות בחינם.

ספריית תבניות אלמנטור

ספריית תבניות אלמנטור

ספריית תבניות Elementor – האם מחסן תבניות מקורי עבור Elementor, תבניות חדשות בחינם ו- Premium מופיעות לעתים קרובות מאוד.

השתמש במקשי מקשים

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

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

פעולות

לבטלCtrl / Cmd + Zבטל כל שינוי שבוצע בדף
בצע שובCtrl / Cmd + Shift + Zבצע מחדש את כל השינוי שבוצע בדף
עותקCtrl / Cmd + Cהעתק קטע, טור או ווידג’ט
הדבקCtrl / Cmd + Vהדבק קטע, עמודה או ווידג’ט
הדבק סגנוןCtrl / Cmd + Shift + Vהדבק את סגנון החלק, העמודה או הווידג’ט
מחקמחקמחק קטע / טור / ווידג’ט שעורך
כפילותCtrl / Cmd + Dשכפל קטע / עמודה / ווידג’ט שעורך
להצילCtrl / Cmd + Sשמור את הדף שלך בהיסטוריית הגרסאות

לך ל

לוח / תצוגה מקדימהCtrl / Cmd + Pעבור בין החלונית לתצוגה המקדימה
עריכה ניידתCtrl / Cmd + Shift + Mמעבר בין תצוגות שולחן עבודה, טאבלט ונייד
היסטוריהCtrl / Cmd + Shift + Hעבור לחלונית ההיסטוריה
נווטCtrl / Cmd + Iפותח את הנווט
ספריית תבניותCtrl / Cmd + Shift + Lפותח את המודול של ספריית התבניות שלנו
קיצורי דרך במקלדתCtrl / Cmd + ?פותח את חלון העזרה של קיצורי מקשים
צאיציאהפותח את ההגדרות וקופץ ליציאה ללוח המחוונים

CSS מותאם אישית לדפים

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

לשם כך, עליך רק להשתמש בווידג’ט HTML ובקטע הקוד הזה:

התבונן בדוגמה זו:

קוד מותאם אישית

סרגל החיפוש של Elementor Finder

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

למרבה המזל, ל- Elementor יש פיתרון מובנה להתייעלות ולהאצת תהליך העיצוב. במקום לעבור את כל הבעיות, תוכלו פשוט להשתמש ב- Elementor Finder. אתה יכול לקפוץ ישירות לכל הגדרה, תבנית, עמוד או חלק נושא על ידי חיפוש בסרגל החיפוש. ניתן לגשת אל Finder על ידי לחיצה על מקשי Cmd / Ctrl + E בכל מקום בלוח המחוונים של וורדפרס. עיין בסרטון וידאו זה כדי לראות את כל מה שאתה יכול לעשות עם Finder.

השתמש בנווט

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

Navigator שימושי במיוחד לדפים ארוכים או עמודים עם עיצוב מורכב רב שכבתי, ולאלמנטים המשלבים את ה- Z-Index, פחות שולי, מיקום מוחלט וכו ‘. זה מאפשר לך לגשת לידיות אלמנטים העשויות להיות ממוקמות מאחורי אלמנטים אחרים..

אתה יכול לגשת ל- Navigator באחת משלוש דרכים פשוטות:

  1. לחץ באמצעות לחצן העכבר הימני על כל רכיב ואז לחץ על Navigator. פעולה זו תפנה אותך אוטומטית לרכיב הספציפי בעץ הניווט.
  2. לחץ על כפתור האלמנטים בכותרת התחתונה של החלונית.
  3. השתמש בקיצור המקשים Cmd / Ctrl + I.

התבונן בסרטון וידאו זה כדי לראות אותו בפעולה:

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

הגדר את לוח הצבעים שלך

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

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

התבונן בסרטון זה:

סגנונות ותבניות מקדימים וניתנים לשימוש חוזר

Elementor הוא אחד מבוני הדפים הטובים ביותר, אבל האם חשבת על כפתורי ברירת המחדל והמכוערים? כרטיסיות? תפריטים? או כל ווידג’ט אחר? ווידג’טים המוגדרים כברירת מחדל נראים כאילו תוכננו לפני מספר שנים, או אולי רצית לעשות שימוש חוזר בווידג’ט שעיצבת בפרויקט A בפרויקט B?

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

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

קביעות מוגדרות מראש של WunderWP

באמצעות WunderWP, אתה יכול גם לשמור ולשתמש מחדש בקלות בסגנונות הווידג’ט שלך ב- Elementor. זה פשוט: סגנן יישומון, שמור אותו בענן WunderWP (שהוא בחינם!) והשתמש בו מאוחר יותר עבור ווידג’טים דומים. זה עובד עבור ווידג’טים פשוטים ומסובכים כאחד. לדוגמה, באפשרותך להשתמש בזה כדי לשמור ווידג’ט לכותרות המכיל ערכים טיפוגרפיים שונים או עבור ווידג’ט תמונה עם צלליות ירידה בהתאמה אישית..

סגנונות מותאמים אישית של WunderWP

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

תבנית מותאמת אישית של WunderWP

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

תבנית Premade של WunderWP

מסיימים

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

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

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map