Metadáta stránky
Stránka DevSite je jedna jednotka obsahu na lokalite. Stránka môže mať názov, telo, prvky hlavičky a atribúty metadát, ktoré riadia funkcie lokality. Keď používateľ navštívi adresu URL stránky, lokalita vykreslí úplnú webovú stránku na základe vlastností stránky s obsahom, pričom pridá dynamické prvky, ako je hlavička, päta a bočný panel. Predvolené správanie je optimalizované pre stránky technickej dokumentácie, ale stránku možno nakonfigurovať aj na iné použitie, ako je marketing a vstupné stránky.
Štruktúra stránky
Stránka DevSite je webová stránka, ktorej všeobecný vzhľad a funkcie spravuje lokalita. Zobrazí sa stránka na Google Developers s niekoľkými spoločnými oblasťami. (Nie všetky stránky podporujú všetky funkcie.) Ak chcete zobraziť štítky, podržte kurzor myši nad diagramom.
site header
Logo lokality, miniaplikácia na prihlásenie, vyhľadávacie pole a horná navigácia. Spoločné na celom webe.
project bar
Názov projektu alebo produktu a widgety špecifické pre daný projekt (napríklad odkaz „Spätná väzba“). Táto oblasť je definovaná metaúdajmi projektu .
sidebar
Hierarchická navigácia v celej knihe. Táto oblasť je definovaná metadátami knihy .
body
Názov stránky a obsah stránky.
page footer ("last updated")
Miniaplikácie špecifické pre stránku (napríklad upozornenie „Posledná aktualizácia“). Môže obsahovať aj oznámenie o licencii CC, čo je atribút metadát projektu.
site footer
Odkazuje päta stránky, widget na výber jazyka. Spoločné na celom webe.
zdrojové súbory HTML
<html devsite>
<head>
<title>Page title</title>
<meta name="project_path" value="/path/to/_project.yaml" />
<meta name="book_path" value="/path/to/_book.yaml" />
</head>
<body>
<p>Body content goes here, implemented as HTML.</p>
</body>
</html>
Atribút devsite
prvku <html>
hovorí DevSite, že by sa to malo vykresliť ako stránka DevSite a nie doslovne ako prvok HTML. Ak sa vaša stránka zobrazuje bez formátovania, hlavičky či päty, skontrolujte, či sa v hornej časti súboru zobrazuje <html devsite>
.
Prvky <html>
, <head>
a <body>
sú povinné a musia mať otváracie a zatváracie značky.
Typická stránka musí mať aj prvok <title>
vo vnútri <head>
. Pozrite si názov stránky .
Špecifické <meta>
tagy ovládajú funkcie stránky. Tieto sú opísané v tomto odkaze. Typická stránka má metaznačku "project_path"
, ktorá odkazuje na súbor metadát _project.yaml
, a metaznačku "book_path"
, ktorá odkazuje na súbor metadát _book.yaml
. Pozrite si Projekty a knihy . Značky <meta>
, ktoré rozpoznáva DevSite, sa zvyčajne nezobrazujú na poslednej stránke.
Ostatné prvky v <head>
a všetky prvky v <body>
sa vykreslia na poslednej stránke.
Zdrojové súbory Markdown
Project: /path/to/_project.yaml
Book: /path/to/_book.yaml
# Page title
Body content, specified in Markdown, goes here.
Typická stránka musí mať nadpis (napr. # Page title
). Pozrite si názov stránky .
Funkcie stránky ovládajú špecifické metaznačky. Tieto sú opísané v tomto odkaze. Typická stránka má metaznačku Project:
ktorá odkazuje na súbor metadát _project.yaml
, a metaznačku Book:
ktorá odkazuje na súbor metadát _book.yaml
. Pozrite si Projekty a knihy. Metaznačky, ktoré rozpoznáva DevSite, sa zvyčajne nezobrazujú na poslednej stránke.
Projekty a knihy
Projekt je opísaný súborom metadát projektu s názvom _project.yaml
. Kniha je opísaná súborom metadát knihy s názvom _book.yaml
. Tieto súbory sú zverejnené na stránke spolu so súbormi stránok a aktív a možno ich preložiť do viacerých jazykov. Informácie o štruktúre a atribútoch týchto súborov nájdete v časti Metadáta projektu a Metaúdaje knihy .
Ak chcete priradiť stránku k projektu, zadajte atribút project_path
. Jeho hodnota je cesta k obsahu k súboru _project.yaml
.
HTML
<meta name="project_path" value="/path/to/_project.yaml" />
Markdown
Project: /path/to/_project.yaml
Ak stránka nemá atribút project_path
, bude vykreslená bez oblasti panela projektu a jej funkcií. Stránka nebude považovaná za súčasť projektu.
Ak chcete priradiť stránku ku knihe, zadajte atribút book_path
. Jeho hodnota je cesta k obsahu k súboru _book.yaml
.
HTML
<meta name="book_path" value="/path/to/_book.yaml" />
Markdown
Book: /path/to/_book.yaml
Názov stránky
<head>
<title>Page title</title>
...
</head>
Alebo použite prvok <h1>
s triedou page-title
v časti <body>
stránky.
HTML
<h1 class="page-title">Page title</h1>
Markdown
# Page title
Domovské stránky projektu nepotrebujú názvy,
HTML
<meta name="no_page_title" value="true" />
Markdown
no_page_title: true
V špeciálnych prípadoch, keď sa automatické <h1>
pre špeciálne rozloženie nevyžaduje, ale stránka stále potrebuje názov okna, môžete názov ponechať, ale skryť nadpis pomocou atribútu "hide_page_heading"
:
HTML
<title>Page title</title>
<meta name="hide_page_heading" value="true" />
Markdown
hide_page_heading: true
# Page title
Popis hlavičky
Mnohé lokality DevSite majú v hlavičke popis. Toto sa nastavuje v súbore metadát _project.yaml
a automaticky sa zobrazuje na vstupných stránkach DevSite. Inými slovami, stránky vytvorené pomocou šablóny _index.yaml
automaticky vykreslia popis v hlavičke, ktorý je nastavený v súbore _project.yaml
.
Tento popis je možné pre stránku prepísať nastavením description
v koreňovom adresári súboru _index.yaml
alebo potlačiť nastavením hide_description: true
v rámci objektu header
objektu landing_page
.
Rozloženie po celej šírke
Ak je potrebná väčšia kontrola nad rozložením, môžete povedať DevSite, aby sa vzdal kontroly nad rozložením pre oblasť pod hlavičkou lokality a panelom projektu a nad pätou lokality. Ak to chcete urobiť, nastavte atribút metadát "full_width"
na hodnotu "true"
.
HTML
<meta name="full_width" value="true" />
Markdown
full_width: true
Dátum poslednej aktualizácie
V predvolenom nastavení, s výnimkou stránok full-width
, oblasť päty stránky obsahuje automatické upozornenie „posledná aktualizácia“. Vo väčšine prípadov to dáva používateľom priamy signál o aktuálnosti obsahu na stránke.
V niekoľkých prípadoch môžu byť tieto informácie mätúce alebo môžu byť produktovým tímom považované za dôverné. Ak chcete zakázať upozornenie na poslednú aktualizáciu na stránke, nastavte atribút hide_last_updated
na true
:
HTML
<meta name="project_path" value="/time-travel/_project.yaml" />
<meta name="book_path" value="/time-travel/_book.yaml" />
<meta name="hide_last_updated" value="true" />
Markdown
Project: /time-travel/_project.yaml
Book: /time-travel/_book.yaml
hide_last_updated: true
Automaticky vypočítaný dátum „poslednej aktualizácie“ môžete prepísať nastavením metaznačky refresh_date na dátum vo formáte ISO 8601
:
HTML
<meta name="project_path" value="/time-travel/_project.yaml" />
<meta name="book_path" value="/time-travel/_book.yaml" />
<meta name="refresh_date" value="2017-03-27" />
Markdown
Project: /time-travel/_project.yaml
Book: /time-travel/_book.yaml
refresh_date: 2017-03-27
Popis stránky
Popis stránky je textové zhrnutie obsahu stránky. Ak chcete nastaviť popis stránky, zadajte prvok <meta name="description" content="DESCRIPTION" />
. Všimnite si, že text popisu sa nachádza v atribúte s názvom content
, nie value
; toto zodpovedá atribútu webového štandardu.
HTML
<meta name="description" content="It was the best of times, it was the blurst of times..." />
Markdown
description: It was the best of times, it was the blurst of times...
Nastavenie popisu stránky spôsobí, že na poslednej stránke bude zahrnutá značka <meta>
Cesta k obrázku
image_path
je cesta k obrázku, ktorý predstavuje túto stránku v sociálnych médiách a funkciách DevSite, ako sú recommendations
a dynamic content
. Po nastavení sa tento obrázok použije ako obrázok OpenGraph stránky, čím sa prepíšu nastavenia social media
projektu a nastavenia značky tenant site's
.
HTML
<meta name="image_path" value="/site-assets/developers_64dp.png" />
Markdown
image_path: /site-assets/developers_64dp.png
Kľúčové slová
Pole keywords
je čiarkou oddelený zoznam reťazcov, ktoré popisujú stránku a používajú sa vo funkciách vyhľadávania a objavovania, ako je vyhľadávanie na stránkach a Dynamic Content
.
Pole keywords
podporuje ploché kľúčové slová bez rozmerového priradenia (napríklad gettingstarted
) a štruktúrované kľúčové slová, ktoré používajú dimenzionálne menné priestory na vyjadrenie vzťahu medzi dokumentmi a entitami reálneho sveta, ako sú programovacie jazyky, produkty a udalosti (napríklad product:ComputeEngine
alebo language:Python3
). Oba typy keywords
môžete pridať do ľubovoľného poľa kľúčových slov.
Ak vytvoríte kľúčové slovo, ktoré nespĺňa požiadavky na formátovanie, vo výstupe nástroja, ktorý ste použili (zvyčajne nástroj príkazového riadka DevSite alebo vydavateľ obsahu DevSite), uvidíte varovanie so správne naformátovanou verziou kľúčového slova.
HTML
<meta name="keywords" value="spacetime,timetravel,product:Delorean" />
Markdown
keywords: spacetime, timetravel, product:Delorean