Przycisk i ikony

Za pomocą opcji Przycisk i linki możesz dodać dowolny typ linku (1) do sekcji. Możesz dodać przycisk, link tekstowy, link graficzny, ikonę lub separator.

Możesz zduplikować (2), edytować (3) lub usunąć (4) istniejący przycisk/link.

W tym artykule:

1. Dodaj przyciski/linki
2. Przyciski/Linki stylu

---

Dodaj przyciski/linki

• Aby dodać dowolny rodzaj linku do sekcji, kliknij na + Dodaj przycisk opcja.

Opcja „+ Dodaj przycisk” oferuje cztery sposoby dodania linku. Oprócz tego możesz również dodać separatory , aby dodać odstęp między przyciskami/linkami. Oto dostępne opcje:

• Przycisk
• Styl przycisku
• Link tekstowy
• Obraz
• Ikona
• Separator

---

Przycisk

Dodaj przycisk do elementu listy.

Będziesz mógł aktualizować:

1. Etykieta przycisku – Określ widoczny tekst na Twoim przycisku. To właśnie zobaczą i klikną użytkownicy.
2. Przycisk Link – Określ Adres URL lub akcja przycisk powinien zostać uruchomiony po kliknięciu.
3. Okno docelowe – Wybierz, czy link ma się otwierać w ta sama zakładka lub nowa karta.
4. Styl przycisku – Wybierz styl przycisku, który ma być domyślny (ustawiony w pliku Przyciski i linki w sekcji Projekt), Bryła, Kontur lub Łącze tekstowe.

• • Zaniedbanie: Dostosowuje się do ustawień motywu Twojej witryny.
  • Solidny: Pogrubiony, wypełniony przycisk.
  • Outline: Przezroczyste tło z obramowaniem.
  • Link tekstowy: Prosty, przejrzysty styl, wyłącznie tekstowy (bez pola przycisków).

5. Kształt przycisku – Ustaw niestandardowy kształt dla każdego pojedynczego przycisku w sekcji. Pozwala to zastąpić globalny kształt przycisku zdefiniowany w sekcji Ustawienia projektowe, co daje Ci większą kontrolę nad wyglądem każdego przycisku. Dostępne kształty to: kwadratowy, zaokrąglony i pigułkowy.
6. Kolor przycisku – Dostosuj schemat kolorów przycisku:

• • Zaniedbanie: Dziedziczy ustawienia motywu.
  • Odwracać: Odwraca kolory tekstu/tła przycisku.
  • Nietypowe: Umożliwia wybór konkretnego koloru tekstu i tła.

7. Tekst Przycisk – Jeśli używasz Niestandardowy kolor przycisku, możesz ustawić kolor tekstu (etykiety) stąd.
8. Tło przycisku – Opcja ta jest również dostępna w sekcji Niestandardowe i pozwala ustawić kolor tła przycisku. Połącz ją z kolorem tekstu, aby zapewnić maksymalną czytelność i styl.
9. Ikona przycisku – Dodaj ikonę obok etykiety przycisku. Możesz wybierać spośród różnych opcji ikon.
10. układ – Kontroluj położenie ikony względem etykiety. Dostępne opcje układu to:

• • Etykieta + Ikona: Najpierw pojawia się tekst, a następnie ikona.
  • Ikona + etykieta: Najpierw pojawia się ikona, potem tekst.
  • Etykieta + Ikona (szeroka): Tekst i ikona rozmieszczone z większym wyścieleniem, odpowiednim do szerszych przycisków.
  • Ikona + etykieta (szeroka): Najpierw ikona, szersze wypełnienie.

11. Kolor ikony – Wybierz kolor ikony przycisku. Możesz ustawić go na Tekst Przycisk kolor lub Marka kolor.

---

Ustawienia stylu przycisków

Te ustawienia znajdziesz w zakładce „Styl” w sekcjach. Ustawienia te pozwalają na precyzyjne dostrojenie wyglądu, odstępów i układu przycisków w witrynie Pixpa, co zapewnia lepszą kontrolę nad projektem i responsywność:

1. Rozmiar guzika – Wybierz rozmiar przycisku (np. Mały, Średni, Duży). To dopasuje odstęp i rozmiar czcionki do Twojego projektu.
2. Odstęp między przyciskami – Kontroluje odstępy poziome między przyciskami. Możesz użyć jednostek vw (szerokość obszaru widoku) do określenia odstępów responsywnych.
3. Miejsce nad przyciskami – Dodaje odstęp pionowy nad przyciskiem/przyciskami. Pomaga to oddzielić je od zawartości powyżej, mierzony w %.
4. Link tekstowy – Dostosowuje rozmiar czcionki dla linków tekstowych przycisków (przydatne zwłaszcza w przypadku używania stylu „Link tekstowy” zamiast tradycyjnego przycisku).
5. Obraz jako przycisk (rozmiar) – Jeśli używasz obrazu zamiast tradycyjnego przycisku, to ustawienie definiuje rozmiar wyświetlania obrazu (w pikselach).
6. Szerokość przycisku – Wybierz, jak szeroki ma być przycisk:

• • Zaniedbanie: Standardowa szerokość oparta na zawartości przycisku
  • Duży / Bardzo duży: Szersze przyciski dla większego nacisku
  • Pełna szerokość: Przycisk rozciąga się na całą szerokość kontenera

---

Link tekstowy

Dodaj link tekstowy do elementu listy.

Będziesz mógł aktualizować:

1. Ustaw etykieta tekstowa.
2. Określ link tekstowy.
3. Okno docelowe – Wybierz, aby otworzyć stronę w tym samym lub nowym oknie.

---

Obraz

Dodaj obraz i połącz go z dowolną stroną.

• Po przesłaniu obrazu wyświetla się on w ten sposób. Kliknij link, aby go edytować.

• Stąd możesz:
  1. Prześlij/Zmień obraz.
  2. Przycisk Link – Określ łącze.
  3. Okno docelowe – Wybierz, aby otworzyć stronę w tym samym lub nowym oknie.

---

Ikona społecznościowa

• Dodaj ikonę społecznościową do elementu listy.

Możesz zarządzać:

1. Ikona społecznościowa do połączenia.
2. Określ odpowiednią ścieżkę profilu społecznościowego.
3. Okno docelowe – Wybierz, aby otworzyć stronę w tym samym lub nowym oknie.

---

Separator

Opcja Separator umożliwia wstawienie odstępu między przyciskami lub linkami.

Przydaje się to do wizualnego oddzielenia przycisków umieszczonych blisko siebie. Możesz dodać separator z panelu Przyciski i linki, tak jak dodajesz inne przyciski.

• Odstęp między przyciskami jest kontrolowany przez Wyściółka – góra ustawienie w Separatorze. Dostosowanie tej wartości zwiększa lub zmniejsza odstęp pionowy między przyciskami umieszczonymi blisko siebie.

 

---

Opcje stylu dla przycisków i linków

Opcje stylu będą dostępne na karcie Styl podczas zarządzania sekcją.

Będziesz mieć wiele opcji stylu dla przycisku i linków w następujący sposób:

Przycisk i linki

1. Określ Przestrzeń między przyciskiem/linkami które zostały dodane.
2. Określ Spacja nad przyciskiem/linkami.
3. Wybierz Efekt aktywowania dla przycisku/łączy.

Rozmiar guzika 

---

Przykład

Załóżmy, że dodałeś link społecznościowy Amazon w sekcji Przycisk/Linki i określiłeś kolor ikony jako czerwony , a kolor tła ikony jako zielony. Ikona wyświetli się w następujący sposób: