마지막 수정사항을 실행취소하거나 다시 실행하려면 Command+z 또는 Command+Shift+z를 각각 누릅니다.
형식 지정 워크플로를 단순하게 유지하려면 마크다운을 사용하는 것이 좋습니다. 하지만 HTML을 대체하지 않습니다. 마크다운에서는 할 수 없는 HTML로 할 수 있는 형식은 매우 다양합니다. 예를 들어 HTML에서는 요소에 대한 CSS 클래스를 지정할 수 있지만 마크다운에서는 이를 수행할 수 없습니다.
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["이해하기 어려움","hardToUnderstand","thumb-down"],["잘못된 정보 또는 샘플 코드","incorrectInformationOrSampleCode","thumb-down"],["필요한 정보/샘플이 없음","missingTheInformationSamplesINeed","thumb-down"],["번역 문제","translationIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2025-08-19(UTC)"],[[["\u003cp\u003eThis documentation pertains to both Apigee and Apigee hybrid platforms, offering guidance on managing portal content within these environments.\u003c/p\u003e\n"],["\u003cp\u003eThe page editor, accessible via the page list, allows users to edit content using Markdown or HTML, apply formatting via a quick edit toolbar, and manage page details and visibility.\u003c/p\u003e\n"],["\u003cp\u003eThe editor also supports the addition of Angular Material components to pages for a consistent, responsive UI, such as buttons, cards, icons, and toolbars, with examples provided in the documentation.\u003c/p\u003e\n"],["\u003cp\u003ePage visibility can be managed within the right pane of the page editor, allowing content to be either public, for authenticated users, or restricted to selected audiences, with the ability to manage these audiences.\u003c/p\u003e\n"],["\u003cp\u003eBefore making the content live, previewing your portal content is possible by using the "preview" button and this is recommended by Apigee to ensure that everything looks correct.\u003c/p\u003e\n"]]],[],null,["*This page\napplies to **Apigee** and **Apigee hybrid**.*\n\n\n*View [Apigee Edge](https://docs.apigee.com/api-platform/get-started/what-apigee-edge) documentation.*\n\n\u003cbr /\u003e\n\nUsing the page editor, you define your portal content using Markdown or HTML.\n\nExploring the page editor\n\nAccess the page editor by clicking the name of a page when viewing the list of pages, as described in [Managing the pages in your portal](/apigee/docs/api-platform/publish/portal/portal-pages).\n\nThe page editor opens: \n\nCloud Console UI\n\nClassic UI\n\nThe page editor lets you:\n\n- [Edit portal content](#edit-content) and [add Angular Material components](#angular-material) in the left pane\n- Use the quick edit toolbar to apply formats or insert Markdown tags quickly\n- Edit page details, such as name, path, and description, in the right pane\n- [Manage the visibility for a page](#visibility) in the right pane\n- [Preview the portal content](#preview)\n- Publish or unpublish a page (see [Publish your portal content](/apigee/docs/api-platform/publish/portal/portal-publish))\n- Manage the page in your navigation menus (see [Set up navigation](/apigee/docs/api-platform/publish/portal/portal-menus))\n- View the amount of time since the page was last published\n- [Delete a page](/apigee/docs/api-platform/publish/portal/portal-pages#delete-page)\n\nEditing content in the page editor\n\nMarkdown is a simple formatting language that uses plain text markup that is both easy to read and write. Its syntax is specified using punctuation characters. Markdown is converted to HTML before rendering in your browser.\n\nThe **quick edit toolbar** at the top of the page editor provides shortcuts for applying formats (such as bold, italic, and so on) or inserting Markdown tags (such as lists, images, links, and so on).\n\nFor a quick summary of Markdown syntax, in the quick edit toolbar: \n\nCloud Console UI\n\nClick the info_outline **Information** icon.\n\nClassic UI\n\nClick the bolt icon.\n\nThe [Markdown syntax quick reference](/apigee/docs/api-platform/publish/portal/markdown-reference) is displayed.\n\nTo undo or redo the last edit, press \u003ckbd\u003eCommand+z\u003c/kbd\u003e or \u003ckbd\u003eCommand+Shift+z\u003c/kbd\u003e, respectively.\n| **Note** : When adding links, note the following:\n|\n| - When adding links to other pages and images in your portal, it is recommended that you use relative paths rather than absolute paths to avoid broken links if you later decide to [customize your domain](/apigee/docs/api-platform/publish/portal/custom-domain).\n| - When adding links to sections within the portal, you need to include the page name followed by the anchor in your link definition. For example, \\[Link to anchor\\] (pagename#anchorname)\n\nMarkdown is recommended if you want to keep your formatting workflow simple. However, it is not intended to replace HTML. There is a wide range of formatting you can do in HTML that you cannot do in Markdown. For example, you can specify a CSS class for an element in HTML; you cannot do this in Markdown: \n\n \u003cp class=\"class1\"\u003e\n\nYou can insert HTML anywhere within the content body by simply entering the HTML tags.\n| **Note:** When using HTML, note the following:\n|\n| - Markdown syntax is not valid within HTML tags.\n| - You must add a line break between an HTML text block and the Markdown text block that follows it in order for the Markdown content to be formatted correctly.\n\nFor information about HTML tags, see the [HTML5 specification](https://www.w3.org/TR/html5/).\n\nAdding Angular Material components\n\n[Angular Material](https://material.angular.io/) provides a state-of-the-art UI component library. Angular Material components enable you to quickly and easily construct consistent, responsive, and accessible user interfaces utilizing modern design principles.\n\nAvailable components\n\nThe portal experience is built using Angular Material, and a limited set of Angular Material components may be used in pages, summarized in the following table.\n| **Note:** The Home page in the [sample portal](/apigee/docs/api-platform/publish/portal/build-integrated-portal#sample-portal) demonstrates how some of these components are used and rendered. A subset of the examples in the following table are based on the Home page contents, with some of the styling removed for readability.\n\n| Component | Example |\n|--------------------------------------------------------------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| [Buttons](https://material.angular.io/components/button/overview) | The following code creates a rectangular button with elevation. ``` \u003ca mat-raised-button href=\"quickstart\"\u003e Quick Start \u003c/a\u003e ``` The following code creates a circular button with a transparent background that includes the warning icon. The color of the button is defined using the [warn color palette](/apigee/docs/api-platform/publish/portal/api-portal-themes#color-palette). \u003cbutton mat-icon-button color=\"warn\"\u003e \u003cmat-icon aria-label=\"Example warning\"\u003ewarning\u003c/mat-icon\u003e \u003c/button\u003e \u003cbr /\u003e |\n| [Card](https://material.angular.io/components/card/overview) | The following code creates a card. The card includes button and icon components, as well as heading and body text. The color of the button is defined using the [primary color palette](/apigee/docs/api-platform/publish/portal/api-portal-themes#color-palette). \u003cmat-card href=\"apis\"\u003e \u003cmat-card-header color=\"primary\"\u003e \u003cmat-icon\u003e class \u003c/mat-icon\u003e \u003ch1\u003e APIs \u003c/h1\u003e \u003c/mat-card-header\u003e \u003cmat-card-content\u003e \u003cp class=\"home-page-card-content-text\"\u003e Learn about and try our APIs. \u003c/p\u003e \u003c/mat-card-content\u003e \u003cmat-card-actions\u003e \u003cbutton mat-button\u003e View APIs \u003c/button\u003e \u003c/mat-card-actions\u003e \u003c/mat-card\u003e |\n| [Icon](https://material.angular.io/components/icon/overview) | The following code creates a checkmark icon. For a complete list of icons that are supported, see [Material Design - Icons](https://material.io/icons/). ``` \u003cmat-icon\u003e check_circle \u003c/mat-icon\u003e ``` |\n| [Toolbar](https://material.angular.io/components/toolbar/overview) | The following code creates a simple toolbar with text and a shopping cart icon. ``` \u003cmat-toolbar color=\"primary\"\u003e \u003cspan\u003eMy Store\u003c/span\u003e \u003cspan class=\"space-buffer\"\u003e\u003c/span\u003e \u003cmat-icon\u003eadd_shopping\u003c/mat-icon\u003e \u003c/mat-toolbar\u003e ``` |\n\nManaging the visibility for a page in your portal\n\nManaging the visibility of a page in your portal is described in\n[Managing the visibility of a page in your portal](/apigee/docs/api-platform/publish/portal/portal-pages#visibility).\n\nPreviewing portal content\n\nTo preview the portal content:\n\n1. Access the page editor as described in [Managing the pages in your portal](/apigee/docs/api-platform/publish/portal/portal-pages).\n2. Preview the page.\n\n Cloud Console UI\n 1. Click **Save**.\n 2. Click **Preview**.\n\n Classic UI\n 1. Click **Preview** in the page editor toolbar.\n 2. Navigate through other pages in your portal to preview the content, as desired.\n | **Note:** Apigee recommends that you preview all portal content before you publish it.\n\nPublishing portal content\n\nPublishing and unpublishing portal content is described in [Publishing your portal content](/apigee/docs/api-platform/publish/portal/portal-publish).\n\nDeleting a page\n\nDeleting pages from the portal is described in [Deleting pages from your portal](/apigee/docs/api-platform/publish/portal/portal-pages#deleting_pages_from_your_portal)."]]
