ווידג’ט תוכן מרוחק של Dynamic.ooo

Share on pinterest
Share on email
Share on whatsapp
Share on facebook
Share on linkedin

IFrame משובץ

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

עם הסרת הגבול של ה- iframe, התיבה תופיע בעמוד ותראה כמו תוכן מקורי בעמוד.

Web Scraping – חילוץ תוכן מאתר אחר על מנת להטמיע באתר שלכם

הגדר את דף ה- URL שברצונך לייבא והפעל את “שילוב בדף”.

באופן אוטומטי השרת שלכם ייבא את כל גוף הדף החיצוני ויכניס אותו לגוף הווידג’ט.
אם אתם זקוקים רק לאלמנט בודד של הדף אתם יכולים לסנן אותו תוך הגדרת “tag, id או class” הקשורים לאלמנט המבוקש באמצעות תחביר בורר jQuery.

דוגמה לבורר שתוכלו להשתמש בו:

  • Tags: לדוגמא- “quote”, “header”
  • ID: לדוגמא- “#footer”‘ “#my-content”
  • Class: לדוגמא- “.block”, “.site-body > .title

קראו עוד על הנושא כאן – https://www.w3schools.com/jquery/jquery_ref_selectors.asp

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

  • רק הראשון
  • את הכל
  • עשר התוצאות הראשונות

לדוגמא- כנסו ללינק על מנת לראות איך לשאוב מאתר וורדפרס ומאתר מבוסס אלמנטור: https://www.dynamic.ooo/demo/remote-content/

 

Rest API – השגת תוצאת נתוני JSON משירות מרוחק ופורמט תוכן מעוצב

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

אתם יכולים לנהל נתוני החזרה כ:

  • מבנה יחיד
  • בלוק שחוזר על עצמו בארכיון עם מבנה ראשוני

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

דוגמא:

EndPoint: https://www.dynamic.ooo/wp-json/wp/v2/dynamic_widgets/3798

דוגמא לנתונים חוזרים :

{"id":3798,"date":"2018-08-17T09:06:05","date_gmt":"2018-08-17T07:06:05","guid":{"rendered":"https:\/\/www.dynamic.ooo\/?post_type=dynamic_widgets&p=3798"},"modified":"2019-03-16T20:18:46","modified_gmt":"2019-03-16T19:18:46","slug":"remote-content","status":"publish","type":"dynamic_widgets","link":"https:\/\/www.dynamic.ooo\/widget\/remote-content\/","title":{"rendered":"Remote Content"},"excerpt":{"rendered":"<p>View DEMO<\/p>\n","protected":false},"author":3,"featured_media":3718,"parent":0,"menu_order":32,"template":"","_links":{"self":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/dynamic_widgets\/3798"}],"collection":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/dynamic_widgets"}],"about":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/types\/dynamic_widgets"}],"author":[{"embeddable":true,"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/users\/3"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/media\/3718"}],"wp:attachment":[{"href":"https:\/\/www.dynamic.ooo\/wp-json\/wp\/v2\/media?parent=3798"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

הדגמת קוד Representative HTML:

<div>
  <h3>[title.rendered]</h3>
  <div>[excerpt.rendered]</div>
  <a href="[link]">Read more</a>
</div>

תיקון קישור

אם לקוד ה- HTML הגרוט יש קישור יחסי, ההגדרה הזו תתקן אותו ותהפוך אותו לקישור מוחלט.

מטמון

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

לצפייה בכל הווידג’טים של dynamic.ooo הקליקו כאן

MOJOCODE

בונים אתרים עם אלמנטור ומראים לאלמנטור שהוא מסוגל ליותר ! הבילדר מספר 1 בעולם פוגש אנשים יצריתיים מאוד.

Share on facebook
Share on whatsapp
Share on pinterest
Share on linkedin

עוד פתרונות מעניינים

עקבו אחרינו

בניית אתר
קידום אורגני
ניהול אתרים
קידום ממומן

תשאירו פרטים ואנחנו נדאג לשאר