פיתוח תוכן לפורטל באמצעות כלי העריכה של הדף

הדף הזה רלוונטי ל-Apigee ול-Apigee Hybrid.

לעיון במסמכי התיעוד של Apigee Edge

באמצעות כלי העריכה של הדף, מגדירים את תוכן הפורטל באמצעות Markdown או HTML.

הסבר על עורך הדפים

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

עורך הדפים ייפתח:

כדי לראות תמונה גדולה יותר, לוחצים עליה

בעורך הדפים אפשר:

עריכת תוכן בעורך הדפים

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

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

כדי לראות סיכום מהיר של תחביר Markdown, בסרגל הכלים של העריכה המהירה, לוחצים על סמל המידע.

מוצג מדריך מקוצר לתחביר Markdown.

כדי לבטל או לבצע מחדש את העריכה האחרונה, מקישים על Command+z או על Command+Shift+z, בהתאמה.

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

   <p class="class1">

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

מידע על תגי HTML זמין במפרט HTML5.

הוספת רכיבים של Angular Material

‫Angular Material מספקת ספרייה מתקדמת של רכיבי ממשק משתמש. רכיבי Angular Material מאפשרים לכם ליצור במהירות ובקלות ממשקי משתמש עקביים, רספונסיביים ונגישים, תוך שימוש בעקרונות עיצוב מודרניים.

רכיבים זמינים

חוויית השימוש בפורטל מבוססת על Angular Material, ואפשר להשתמש בקבוצה מוגבלת של רכיבי Angular Material בדפים. סיכום של הרכיבים האלה מופיע בטבלה הבאה.

רכיב דוגמה
לחצנים הקוד הבא יוצר כפתור מלבני עם הגבהה.
<a mat-raised-button
   href="quickstart">
   Quick Start
</a>

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

<button mat-icon-button
   color="warn">
   <mat-icon aria-label="Example warning">warning</mat-icon>
</button>
כרטיס הקוד הבא יוצר כרטיס. הכרטיס כולל רכיבי לחצן וסמל, וגם כותרת וגוף הטקסט. הצבע של הכפתור מוגדר באמצעות לוח הצבעים הראשי.

<mat-card
   href="apis">
   <mat-card-header
      color="primary">
         <mat-icon>
            class
         </mat-icon>
         <h1>
            APIs
         </h1>
   </mat-card-header>
   <mat-card-content>
      <p class="home-page-card-content-text">
         Learn about and try our APIs.
      </p>
   </mat-card-content>
   <mat-card-actions>
      <button mat-button>
          View APIs
      </button>
   </mat-card-actions>
</mat-card>
סמל הקוד הבא יוצר סמל של וי. רשימה מלאה של הסמלים הנתמכים זמינה במאמר Material Design – Icons.
<mat-icon>
   check_circle
</mat-icon>
סרגל הכלים הקוד הבא יוצר סרגל כלים פשוט עם טקסט וסמל של עגלת קניות. 
<mat-toolbar color="primary">
   <span>My Store</span>
   <span class="space-buffer"></span>
   <mat-icon>add_shopping</mat-icon>
</mat-toolbar>

ניהול ההגדרה 'גלוי לכולם' בדף בפורטל

הסבר על ניהול ההרשאות לגישה לדף בפורטל מופיע במאמר ניהול ההרשאות לגישה לדף בפורטל.

תצוגה מקדימה של תוכן הפורטל

כדי לראות תצוגה מקדימה של תוכן הפורטל:

  1. ניגשים לעורך הדפים כמו שמתואר במאמר ניהול הדפים בפורטל.

  2. בודקים את התצוגה המקדימה של הדף.

    1. לוחצים על Save.
    2. לוחצים על תצוגה מקדימה.

פרסום תוכן בפורטל

הסבר על פרסום תוכן בפורטל וביטול הפרסום שלו מופיע במאמר פרסום תוכן בפורטל.

מחיקת דף

הסבר על מחיקת דפים מהפורטל מופיע במאמר מחיקת דפים מהפורטל.