Członkowie zespołu podstawowego mogą dodawać obrazy i tekst do witryny, używając następujących kart:
- Karta Wiersz — są to elementy składowe witryny. Każda karta musi być osadzona na karcie wiersza. Do kart wierszy można dodawać obrazy i kolory tła. Za pomocą tej karty można też utworzyć efekt paralaksy.
- Karta Tekst — tekst można dodać w dowolnym miejscu witryny, upuszczając tę kartę na kartę wiersza. Tej karty można także używać do dodawania przycisków, list, tabel i kodu niestandardowego do witryny.
- Karta Obraz — umożliwia dodawanie autonomicznych obrazów do dowolnej karty wiersza w dowolnym miejscu w witrynie.
Aby rozpocząć pracę, zaloguj się w oprogramowaniu ArcGIS Enterprise i wybierz opcję Witryny na stronie Przegląd w celu wyświetlenia listy witryn.
Wskazówka:
Witrynę możesz również edytować podczas przeglądania jej w przeglądarce. Pamiętaj, aby zalogować się, a następnie odszukać przycisk edycji po lewej stronie witryny.
Dodawanie i formatowanie tekstu
Tekst można dodawać w każdym miejscu witryny, gdzie znajduje się karta wiersza.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj do wiersza kartę Tekst.
- Dodaj tekst.
- Wybierz tekst, który chcesz sformatować. Dostępne są następujące opcje: styl (normalny, kod, nagłówki itp.), pogrubienie, kursywa i łącza.
- Aby zmienić wielkość tekstu, wybierz przycisk stylu i wybierz wielkość nagłówka.
- Aby skorygować wyrównanie tekstu, wybierz opcje akapitu i wybierz wyrównanie. Możesz także przenieść wiersz tekstu, wybierając opcję akapitu, a następnie opcję usunięcia lub wstawienia wcięcia.
Wskazówka:
Jeśli popełnisz błąd, naciśnij Command+Z lub Ctrl+Z na klawiaturze, aby wycofać zmiany. - Wybierz przycisk Zapisz.
Notatka:
Rozmiar podstawowej czcionki tekstu został zwiększony we wszystkich witrynach i na wszystkich stronach na przełomie 2021/2022 roku, aby poprawić czytelność i ułatwić dostęp osobom o różnych umiejętnościach.Szczegóły można znaleźć we wpisie w sekcji często zadawanych pytań dotyczącym nadchodzących zmian w podstawowym rozmiarze czcionki i jednostkach rem w witrynach Centrum ArcGIS Hub.
Zmiana koloru tekstu
Aby zastosować ten sam kolor do całego tekstu w witrynie, zmień kolor tekstu za pomocą ustawień Motyw witryny. Możesz też dostosować kolor tekstu przy użyciu ustawień wierszy.
- Otwórz witrynę lub stronę w trybie edycji.
- Aby skonfigurować kolor dla wszystkich tekstów w witrynie lub na stronie, otwórz panel boczny i rozwiń menu Motyw. Więcej informacji na temat motywów zawiera sekcja Znakowanie witryny za pomocą opcji nagłówka i motywu.
- Aby skonfigurować kolor dla konkretnego wiersza, wybierz ołówek edycji
obok danego wiersza. - Zmień kolor, wprowadzając szesnastkowy kod koloru lub wybierając kolor w oknie wyboru kolorów.
Wskazówka:
Kody szesnastkowe przydają się do zapewnienia spójności wizualnej marki w obrębie zasobów instytucji. Jeśli nie masz pewności co do parametrów marki instytucji, sprawdź, czy dostępna jest odpowiednia dokumentacja lub wytyczne dotyczące marki. - Wybierz przycisk Zapisz.
Zmiana czcionki
Korzystając z katalogu Google Fonts, można zmienić czcionkę tekstu nagłówków i tekstu podstawowego. Tekst podstawowy obejmuje cały tekst w kompozycji witryny. Ta czcionka jest też stosowana do wszystkich stron, które zostały dodane do witryny, stron podglądu elementu, do których uzyskuje się dostęp z wyników wyszukiwania w witrynie.
Więcej informacji na ten temat zawiera sekcja Formatowanie tekstu w witrynach Centrum ArcGIS Hub i ArcGIS Enterprise Sites.
Dodawanie listy wypunktowanej lub numerowanej
Utwórz listę, wykonując poniższe czynności.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj kartę Tekst do kompozycji witryny lub strony.
- Dodaj tekst lub zaznacz istniejący tekst.
- Wybierz opcję Lista nieuporządkowana, aby utworzyć listę wypunktowaną, lub Lista uporządkowana, aby utworzyć listę numerowaną.
- Wybierz przycisk Zapisz.
Tworzenie menu typu akordeon
Menu typu akordeon to przydatna opcja podczas dodawania często zadawanych pytań.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj do kompozycji kartę Tekst.
- Wybierz przycisk Wstaw, a następnie wybierz opcję Harmonijny.
- Dodaj i sformatuj tekst.
- Wybierz przycisk Zapisz.
Obsługiwane komponenty Calcite
Na karcie Tekst obsługiwane są poniższe komponenty systemu Calcite Design System. Ich opisy, optymalne wykorzystanie, przykłady i nie tylko można znaleźć w katalogu wszystkich komponentów Calcite.
|
|
|
Dodawanie autonomicznego obrazu
Dodaj obraz, przesyłając plik lub podając adres URL do hostowanego obrazu. Obrazy udostępniane wewnętrznie mogą oglądać tylko użytkownicy zalogowani i należący do zespołu podstawowego lub instytucji.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj kartę Obraz do istniejącego wiersza.
- Wybierz źródło obrazu w edytorze kompozycji. Możesz podać adres URL obrazu lub przesłać plik obrazu. W przypadku obu tych opcji obsługiwane są formaty JPG, JPEG i PNG.
- Aby podać adres URL, wybierz opcję Adres URL obrazu i wklej łącze do obsługiwanego obrazu w polu Adres URL.
- Aby przesłać plik, wybierz opcję Wczytaj obraz i przeciągnij plik do pola albo wybierz opcję Znajdź obraz, aby wskazać i dodać plik. Maksymalny rozmiar pliku wynosi 3 MB.
- Aby dostosować wczytany obraz, wybierz przycisk Przytnij obraz i przeciągnij uchwyt w celu zmiany rozmiaru ramki przycinania. Aby zmienić pozycję ramki przycinania, wybierz i przeciągnij linię kropkowaną. Aby dostosować powiększenie, przesuń suwak pod obrazem i zmień pozycję obrazu jeszcze bardziej, klikając w obrębie ramki przycinania.
- W menu Opcje podaj tekst alternatywny obrazu, aby pomóc użytkownikom niedowidzącym i zwiększyć dostępność witryny.
- Podaj hiperłącze obrazu i skonfiguruj łącze tak, aby było otwierane na tej samej lub na nowej karcie.
Notatka:
Wytyczne dotyczące dostępności (3.2.2 — On Input i techniki G201) zalecają, aby unikać otwierania łączy w nowych kartach lub oknach, chyba że użytkownik zostanie wcześniej ostrzeżony. - Podaj tekst dla opcji Legenda do obrazu i wybierz wyrównanie tekstu.
- Opcjonalnie wybierz opcję Skaluj obraz tak, aby wypełniał cały ekran, aby skonfigurować centralny punkt obrazu. Punkt centralny zapewni pożądane skupienie, gdy zajdzie potrzeba zmiany rozmiaru obrazu dla różnych ekranów.
- Wybierz przycisk Zapisz.
Tworzenie przycisku
Przycisk z łączem do innej lokalizacji, takiej jak sekcja lub strona, jest przydatnym narzędziem nawigacyjnym. Przyciski mogą również zawierać wezwania do działania.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj do kompozycji kartę Tekst.
- Wybierz przycisk Wstaw, a następnie wybierz opcję Przycisk.
- Edytuj tekst na przycisku, by zawierał wezwanie do działania.
- Wybierz właśnie dodany przycisk, a następnie przycisk łącza.
- Dodaj tekst w polu tekstowym Tekst do wyświetlenia, jeśli jeszcze tego nie zrobiono.
- W polu tekstowym adresu URL wklej łącze, na które mają być przekierowywani użytkownicy po wybraniu przycisku.
- Wybierz przycisk Wstaw łącze, by potwierdzić zmiany.
- Wybierz przycisk Zapisz.
Dodawanie obrazów tła i kolorów
Za innymi kartami można dodawać obrazy, używając karty Wiersz.
Wskazówka:
Jeśli tekst lub zasoby są wyświetlane nad obrazem, wybierz kontrastujący kolor tła. Jeśli na przykład używasz tekstu w jasnym kolorze lub wyświetlasz mapę w jasnym kolorze, wybierz ciemny kolor tła, na przykład czarny, aby tekst był wyraźny. Następnie dostosuj przezroczystość koloru, aby obraz był widoczny.
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj do kompozycji kartę Wiersz i określ formatowanie w obszarze Wygląd.
- W obszarze Obraz tła wybierz źródło obrazu. Możesz podać adres URL obrazu lub przesłać plik obrazu. W przypadku obu tych opcji obsługiwane są formaty JPG, JPEG i PNG.
- Aby podać adres URL, wybierz opcję Adres URL obrazu i wklej łącze do obsługiwanego obrazu w polu Adres URL.
- Aby przesłać plik, wybierz opcję Wczytaj obraz i przeciągnij plik do pola albo wybierz opcję Znajdź obraz, aby wskazać i dodać plik. Maksymalny rozmiar pliku wynosi 3 MB.
- Po dodaniu obrazu wybierz Kolor tła, wpisując kod szesnastkowy lub używając okna wyboru kolorów.
Notatka:
Kolory tła są obsługiwane tylko przez karty wierszy.
- Aby dostosować Przezroczystość obrazu, użyj suwaka lub wpisz wartość w polu określającym wartość procentową. W zależności od wybranego ustawienia rozjaśni to lub przyciemni kolor tła. Dzięki temu obraz i tekst będą lepiej dostępne dla użytkowników niewidzących.
- Wybierz przycisk Zapisz.
Wybór kompozycji obrazu na karcie wiersza
Każda karta wiersza ma dwie opcje kompozycji, które umożliwiają wybranie sposobu wyświetlania obrazu.
- Po dodaniu obrazu do karty wiersza można wybrać stałą lub szeroką kompozycję obrazu i innych zasobów wyświetlanych na karcie.
- Wybierz opcję Prostokąt, aby obraz był stały.
- Wybierz opcję Szeroki, aby obraz był wyświetlany na całej szerokości witryny.
- Skonfiguruj Centralny punkt obrazu, aby zapewnić pożądane skupienie, gdy zajdzie potrzeba zmiany rozmiaru obrazu dla różnych ekranów.
- Wybierz przycisk Zapisz.
Konfigurowanie tekstu przy użyciu kodu HTML
Jeśli chcesz użyć kodu HTML do skonfigurowania tekstu, możesz użyć następujących elementów tego kodu:
- Otwórz witrynę lub stronę w trybie edycji.
- Dodaj do kompozycji kartę Tekst i wybierz </> Edytuj w HTML.
- Wprowadź kod i wybierz Zapisz.
Uwaga:
Ze względów bezpieczeństwa na kartach Tekst nie jest obsługiwany wbudowany kod JavaScript. Znaczniki skryptu zostaną zignorowane.
Dozwolone są następujące elementy HTML:
'a', 'abbr', 'acronym', 'address', 'article', 'audio', 'b',
'bdi', 'bdo', 'big', 'blockquote', 'br', 'caption', 'center', 'cite',
'code', 'col',
'colgroup', 'datalist', 'dd', 'del', 'details', 'dfn', 'div', 'dl', 'dt',
'em', 'embed', 'fieldset', 'figcaption', 'figure', 'font',
'footer', 'frameset',
'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr',
'i', 'img', 'input', 'ins', 'kbd', 'keygen', 'li', 'link', 'main', 'map',
'mark', 'menu', 'meter', 'nav', 'ol', 'optgroup', option', 'output', 'p',
'param', 'pre', 'progress', 'q', 'rp', 'rt', 'ruby', 's', 'samp',
'section', 'small', 'source', 'span', 'strike', 'strong', 'style'
'sub', 'summary', 'sup', 'table', 'tbody', 'td', 'tfoot', 'textarea',
'th', 'thead', 'time', 'title', 'tr', 'track, 'tt', 'u','ul',Dozwolone są następujące atrybuty dla tych elementów:
All supported HTML elements allow : ['class', 'style'],
'a' : ['href', 'title', 'data-toggle', 'data-target', 'data-toggle',
'name', 'rel', 'style', 'target'],
'audio' : ['autoplay', 'controls', 'loop', 'muted', 'preload'],
'blockquote': ['cite'],
'button' : ['name', 'value', 'data-toggle', 'data-target',
'data-dismiss'],
'col' : ['span', 'width'],
'colgroup' : ['span', 'width'],
'div' : ['style', 'align', 'data-show', 'data-target', 'data-toggle']
'font': ['size', 'color', 'style'],
'img' : ['align', 'alt', 'border', 'height', 'style', 'src', 'title',
'width'],
'ol' : ['align', 'start', 'type'],
'p' : ['style'},
'q' : ['cite'],
'source' : ['media', 'src', 'type'],
'span' : [style],
'table' : ['border', 'cellspacing', 'cellpadding', 'class', 'height',
'style', 'summary', 'width'],
'td' : ['abbr', 'align', 'axis', 'colspan', 'height', 'nowrap',
'rowspan', 'style', 'valign', 'width'],
'th' : ['abbr', 'align', 'axis', 'colspan', 'height', 'nowrap',
'rowspan', 'style', 'valign', 'width']
'tr' : [alignt, 'height', style', valign'],
'ul' : ['type']