אינטרנט ישראל
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
  • ראשי
  • אודות רן בר-זיק ואינטרנט ישראל
  • ערוץ טלגרם
  • מסטודון
  • התחברו אלי בטוויטר
  • התחברו אלי בלינקדאין
  • ספר ג'אווהסקריפט
ראשי » פיתוח אינטרנט » פתרונות ומאמרים על פיתוח אינטרנט » יצירת Static FBML Box לעמודי פייסבוק

יצירת Static FBML Box לעמודי פייסבוק

רן בר-זיק מרץ 14, 2010 7:48 am אין תגובות

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.

עדכון חשוב: פייסבוק הפסיקה לתמוך ב-Static FBML Box, את העמודים יש ליצור עם אפליקצית iFrame, זה יותר פשוט ממה שזה נשמע. הכנסו למאמר על יצירת אפליקצית iFrame עבור פייסבוק.

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

פייסבוק מאפשרת לנו להקים סוג של 'מיני אתרי אינטרנט' בשם pages שיכולים לשמש גם כבסיס לאפליקציה של פייסבוק. מעטים יודעים שלא חייבים אפליקציה ובלגנים על מנת לעצב עמוד יפה ואפקטיבי – אפשר לעשות את זה עם Static FBML Box ולעצב לשוניות יפות בעמוד עם תמונות, CSS ואפילו פלאש.

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

חשוב מאד!!! לא ניתן ליצור Static FBML Box ללא ידע סביר ומעלה ב-HTML וב-CSS. אם אין לכם כזה, אתם יכולים לפנות אלי.

יצירת עמוד

על מנת ליצור Static FBML Box בעמוד שלכם, אתם צריכים… עמוד של פייסבוק. יצירת עמוד בפייסבוק היא לא קשה במיוחד. לוחצים על Ad & Pages ומשם התהליך הוא פשוט למדי. בסופו צריך להיות לכם עמוד מאד בסיסי עם Wall.

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

התקנת אפליקצית Static FBML

מדובר באפליקציה של פייסבוק עצמה שמאפשרת את האינטגרציה של קוד ה-FBML בדפים שלנו. ההתקנה היא פשוטה מאד, פשוט מחפשים Static FBML (או נכנסים לקישור של האפליקציה). ובוחרים ב-Add to my page:

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

יצירת לשונית FBML

ניגשים שוב לדף שלנו ונלחץ על סימן ה-+ ליד הלשוניות ונוסיף לשונית של FBML:

לאחר ההוספה אנו נראה שיש לנו לשונית שנקראת FBML. אין טעם להכנס לתוכה כי היא ריקה, עלינו להכנס לתפריט העריכה:

אנו נראה רשימה של כל האפליקציה שלנו וגם לשונית ה-FBML:

אם נלחץ על Edit נוכל לשנות את שם הלשונית וגם את מה שיש בתוכה.

הכנסת תוכן ללשונית FBML

האמת שזה כבר די קל, יש לנו שני שדות – שם הלשונית (אפשר לכתוב מה שרוצים) וגוף הלשונית – לשם אפשר להכניס גם HTML רגיל וגם CSS. הכנסת CSS היא פשוטה למדי:


<link href="http://www.example.com/style-facebook.css" rel="stylesheet" type="text/css" />

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

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

הקוד שמשמש אותנו להצבת פלאש הוא:


<fb:swf swfsrc="https://internet-israel.com/internet_files/moshe.swf" width="400" height="200"  imgsrc="https://internet-israel.com/internet_files/moshe.jpg"> </fb:swf>

הוספת לשוניות נוספות

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

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

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

כדאי תמיד להשאר מעודכנים! אם יש לכם טלגרם, בדקו את ערוץ הטלגרם של האתר שבו אני מעדכן על פוסטים חדשים 🙂 אם אתם רוצים ללמוד תכנות באופן מקיף ומסודר, הצטרפו לאלפי הלומדים בפרויקט "ללמוד ג'אווהסקריפט בעברית" שמלמד לתכנת בג'אווהסקריפט, ב-Node.js ובריאקט וגם מלמד על תרומה לקוד פתוח. גם ספרים דיגיטליים וגם ספרים מודפסים. בשיתוף הקריה האקדמית אונו ובתמיכת חברות מובילות כגון Wix, Outbrain, Elementor, Iron Source, Chegg, Really Good ועוד.
פייסבוק פתרונות קידום אתרים
ללמוד ג'אווהסקריפט בעברית

ללמוד לתכנת ג'אווהסקריפט בעברית שגייס יותר משלוש מאות אלף שקל ולמעלה מ-2000 תומכים - בואו ללמוד עכשיו איך לתכנת.

רשימת הנושאים
  • מדריכים
    • ריאקט
    • טייפסקריפט
    • ECMAScript 6
    • ES20XX
    • Node.js
    • Express
    • רספברי פיי
    • Babel
    • docker
    • MongoDB
    • Git
    • לימוד MySQL
    • SASS
    • jQuery
    • CSS3
    • HTML 5
    • SVN
    • LESS
  • פיתוח אינטרנט
    • פתרונות ומאמרים על פיתוח אינטרנט
    • jQuery Scripts
    • jQuery למתקדמים
    • יסודות בתכנות
    • נגישות אינטרנט
  • חדשות אינטרנט
  • מידע כללי על אינטרנט
    • רשת האינטרנט
    • בניית אתרי אינטרנט
  • rss logo

    לכל המאמרים

    לכל המאמרים שפורסמו באינטרנט ישראל משנת 2008 ועד עכשיו.
  • rss logo

    RSS Feed

    משתמשים בקורא RSS? אם כן, עקבו אחרי אינטרנט ישראל באמצעות פיד ה-RSS!
    מה זה RSS?
  • Twitter logo

    עקבו אחרי בטוויטר

    בחשבון הטוויטר שלי אני מפרסם עדכונים מהירים על חדשות בתחום התכנות והיזמות, התרעות על מצבי חירום ורכילות בוערת על תחום הווב.
    מה זה טוויטר?
  • facebook like image

    ערוץ הטלגרם של אינטרנט ישראל

    בערוץ הטלגרם של אינטרנט ישראל אני מפרסם את הפוסטים של באתר וכן עדכונים טכנולוגיים נוספים.
    מה זה טלגרם?
  • github logo

    הפרויקטים שלי בגיטהאב

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

כל הזכויות שמורות לרן בר-זיק ולאינטרנט ישראל | מדיניות הפרטיות של אתר אינטרנט ישראל | אתר אינטרנט ישראל נגיש לפי תקן WCAG 2.0 AA | הצהרת הנגישות של האתר | אבטחת מידע ודיווח על בעיית אבטחת מידע

גלילה לראש העמוד