---
url: "/pl/pixelay/upload-designs.md"
description: "Jak zaznaczyć ramki nadrzędne w Figmie, ustawić adresy URL, przesłać projekty i zarządzać linkami do porównań Pixelay."
---

# Przesyłanie projektów z Figmy do porównania

> Jak zaznaczyć ramki nadrzędne w Figmie, ustawić adresy URL, przesłać projekty i zarządzać linkami do porównań Pixelay.

## Przygotowanie projektów we wtyczce do Figmy {#preparing-designs-in-the-figma-plugin}

Pixelay przesyła przez wtyczkę do Figmy obrazy ramek nadrzędnych najwyższego poziomu z bieżącej strony w Figmie, a następnie w aplikacji webowej Pixelay nakłada je na adresy URL odpowiadających im podstron Twojej strony.

> **Note:** **Wymagane są ramki nadrzędne w Figmie**. Aby porównywać projekty, strona w Figmie musi zawierać co najmniej jedną „ramkę nadrzędną”, czyli ramkę umieszczoną _bezpośrednio_ na stronie.

### Zaznaczanie ramek z Figmy do porównania {#selecting-figma-frames-to-compare}

[Video](/assets/videos/pixelay/upload/selecting-frames.mp4)

Na początek zaznacz ramki z projektu w Figmie, które chcesz porównać z adresami URL wdrożonej strony.

Pixelay wczyta wszystkie „ramki nadrzędne” do wtyczki jako listę projektów, które możesz porównać ze stroną. Kliknij pole wyboru lub miniaturę dowolnej ramki, aby ją zaznaczyć (ponowne kliknięcie usuwa zaznaczenie).

> **Tip:** **Zaznaczanie ramek nadrzędnych bezpośrednio w Figmie**. Aby łatwiej wybrać ramki nadrzędne do porównania, kliknij lub zaznacz dowolne ramki na stronie w Figmie – lista dostępnych ramek we wtyczce Pixelay automatycznie zawęzi się do nich.

### Odświeżanie ramek nadrzędnych z Figmy {#refreshing-figma-parent-frames}

[Video](/assets/videos/pixelay/upload/refreshing-layers.mp4)

Jeśli wtyczka Pixelay jest już uruchomiona, a chcesz dodać lub usunąć ramki nadrzędne na bieżącej stronie w Figmie, wprowadź potrzebne zmiany, a potem kliknij przycisk z ikoną **Refresh frames** obok liczby zaznaczonych ramek we wtyczce Pixelay.

### Wpisywanie adresu URL strony {#entering-your-website-url}

[Video](/assets/videos/pixelay/upload/entering-url.mp4)

Domyślny adres URL, z którym chcesz porównać projekty, wpisz jako prawidłowy adres w polu **Base Website URL** u góry wtyczki Pixelay. Ten adres będzie domyślną stroną wczytywaną do porównania z zaznaczonymi projektami.

> **Note:** **Zainstaluj rozszerzenie Pixelay do Chrome**. Aby porównywać projekty z adresami URL w Pixelay, zainstaluj [wtyczkę Pixelay do Chrome](https://chrome.google.com/webstore/detail/pixelay-for-figma/gnbafbeabkbkecmbedfgebgboicpnkpp). Działa ona w tle i uruchamia Pixelay, gdy wykryje w przeglądarce adres URL z wtyczki.

> **Tip:** **Używaj adresów `https://`.** Pixelay wczytuje opublikowane strony i lokalne adresy deweloperskie tylko przez HTTPS.

#### Dodawanie adresów URL konkretnych podstron {#adding-page-specific-website-urls}

Jeśli porównujesz kilka ramek jednocześnie, możesz podać osobny adres URL _dla każdej ramki_. Na przykład dla projektu podstrony „O nas” możesz wpisać adres w rodzaju _https://yoursite.com/about/_. Taki adres zastępuje domyślny adres URL z paska narzędzi Pixelay.

### Dodawanie adresów URL kilku środowisk (opcjonalnie) {#adding-multiple-environment-website-urls-optional}

[Video](/assets/videos/pixelay/upload/add-environment-urls.mp4)

Jeśli Twoja strona ma kilka środowisk, dodaj dodatkowy bazowy adres URL dla każdej wersji deweloperskiej, stagingowej lub produkcyjnej. Między tymi środowiskami [przełączysz się](/pl/pixelay/compare-designs#toggling-between-environment-urls) w aplikacji webowej Pixelay.

Aby dodać kolejne adresy, kliknij przycisk z ikoną **Show extra website URLs** obok bazowego adresu strony, wpisz nowy adres w polu **Add Extra Base URL** (na przykład `https://dev.yoursite.com` lub `https://test.yoursite.com`) i kliknij przycisk **Add URL**, aby dodać go do listy bazowych adresów dodatkowych środowisk. Po ponownym przesłaniu projektów z wtyczki adresy te pojawią się na liście rozwijanej w aplikacji webowej Pixelay.

> **Tip:** Aby usunąć adres środowiska, wybierz go z listy rozwijanej, kliknij ikonę **Delete selected URL**, a potem potwierdź przyciskiem **Delete**. Prześlij projekty Pixelay ponownie, aby zmiana objęła bieżący link do porównania.

### Generowanie adresu URL porównania {#generating-your-comparison-url}

[Video](/assets/videos/pixelay/upload/compare-upload.mp4)

Gdy zaznaczysz ramki z Figmy do porównania i przypiszesz im adresy URL strony, kliknij przycisk **Compare Designs** we wtyczce Pixelay (pokazuje on, ile ramek zostanie porównanych). W panelu **Compare Figma Designs** kliknij przycisk **Upload Designs**, aby potwierdzić i rozpocząć przesyłanie.

> **Tip:** Jeśli przycisk **Compare Designs** jest niedostępny, najedź na niego kursorem, aby zobaczyć powód: najpierw wpisz bazowy adres URL strony albo zaznacz co najmniej jedną ramkę. W trybie darmowym można porównywać tylko ramki o szerokości do 430 px. Spowoduje to przesłanie obrazów zaznaczonych ramek z Figmy i wygenerowanie adresu URL prowadzącego do aplikacji webowej Pixelay.

> **Warning:** **Duplikat pliku Figmy ma ten sam adres URL co oryginał.** Aby wygenerować dla duplikatu inny adres, przy otwartej wtyczce wpisz kod Konami (**Up**, **Up**, **Down**, **Down**, **Left**, **Right**, **Left**, **Right**, **B**, **A**). Pixelay utworzy nowy adres URL, nie usuwając poprzedniego.

> **Note:** Jeśli przesyłanie lub odświeżanie ramek się nie powiedzie, Pixelay wyświetli błąd we wtyczce i zatrzyma wskaźnik postępu. Błąd przesyłania nie cofa ramek ani ustawień, które zostały już wysłane na stronę porównania.

### Otwieranie adresu URL porównania {#opening-your-comparison-url}

[Video](/assets/videos/pixelay/upload/copy-url.mp4)

Po przesłaniu wszystkich ramek zobaczysz potwierdzenie **Designs Uploaded Successfully!**, które informuje, że adres URL strony porównania jest gotowy.

Kliknij przycisk z ikoną **Copy link**, aby skopiować adres i wkleić go w przeglądarce (albo komuś udostępnić), lub kliknij link **Comparison URL** w potwierdzeniu. Otworzy to aplikację webową Pixelay w przeglądarce, w której możesz zacząć porównywać projekty z Figmy z deweloperskimi adresami URL strony.

Pamiętaj, że aby porównywać projekty z adresami URL w Pixelay, musisz zainstalować [wtyczkę Pixelay do Chrome](https://chrome.google.com/webstore/detail/pixelay-for-figma/gnbafbeabkbkecmbedfgebgboicpnkpp). Link do niej znajdziesz też w potwierdzeniu we wtyczce.

#### Ponowny dostęp do adresu URL porównania z wtyczki {#accessing-your-comparison-url-from-the-plugin-again}

Jeśli adres URL porównania został już utworzony we wtyczce, a chcesz go ponownie skopiować (bez ponownego przesyłania projektów), kliknij przycisk **Compare Designs** we wtyczce Pixelay. W panelu **Compare Figma Designs** pojawi się utworzony wcześniej adres. Aby go użyć, kliknij przycisk z ikoną **Copy link**, aby skopiować adres i wkleić go w przeglądarce (albo komuś udostępnić), lub kliknij link **comparison URL** w panelu.

### Ponowne przesyłanie projektów z Figmy pod adres URL porównania {#re-uploading-your-figma-designs-to-the-comparison-url}

[Video](/assets/videos/pixelay/upload/reupload-images.mp4)

Jeśli zaktualizujesz projekt, chcesz dodać lub pominąć inne ramki z Figmy albo zmienić adresy stron lub podstron w porównaniu, prześlij zaznaczone projekty ponownie pod ten sam adres URL porównania. Zrób to tak samo jak za pierwszym razem: kliknij przycisk **Compare Designs** we wtyczce Pixelay, ale tym razem wybierz przycisk **Update Designs**.

> **Note:** **Adres URL porównania nie zmienia się po ponownym przesłaniu projektów**. Każde kliknięcie przycisku **Update Designs** zastępuje wcześniej przesłane ramki i linki do stron, a wygenerowany wcześniej adres URL porównania Pixelay zostaje zaktualizowany o nowe projekty i linki.