Sekcja profilu

Sekcja Profil to idealny sposób na przedstawienie ludzi stojących za Twoją pracą. Niezależnie od tego, czy budujesz strona o nas, prezentacja zespołu lub sekcja biografii, ten układ pozwala na prezentację osób w sposób elegancki i przejrzysty.

Podkreśl każdą osobę zdjęcie, imię, rola i historia W formacie, który jest osobisty i angażujący. Od zespołów kreatywnych i współpracowników, po prelegentów, mentorów i współpracowników, Sekcja Profilu pomaga budować głębsze więzi z odbiorcami, przedstawiając twarze Twojej marki lub projektu.

Dzięki prostym opcjom personalizacji i przejrzystemu, responsywnemu projektowi Sekcja Profilu ułatwia prezentację osób, dzięki którym Twoja praca jest możliwa.


W tym artykule:

  1. Czym jest sekcja Profil?
  2. Dodaj sekcję profilu
  3. Dodawaj i edytuj elementy listy
  4. Elementy listy sekwencjonowania
  5. Usuwanie elementów listy
  6. Zarządzaj elementami
  7. Zmiana układu sekcji
  8. Opcje stylu

Sekcja profilu

Sekcja profilu to zbiór indywidualnych profili, w których możesz dodać zdjęcie, imię i nazwisko, rolę lub stanowisko oraz krótki opis. Możesz również dodać link lub przycisk kierujący odwiedzających do szczegółowych stron lub linków zewnętrznych powiązanych z każdym profilem.


Dodaj sekcję profilu

  • Do strony można dodać sekcję. Możesz dodać sekcję do już istniejącej strony lub utwórz nową stronę w Twojej witrynie.
  • Na Twojej stronie, Kliknij na niebieski + ikona dodać Nowa sekcja do Twojej strony.

  • Teraz zobaczysz kategorie sekcji po lewej stronie.
  • Wybierz Profil i biolinki (1) kategoria i kliknij na Profil zakładka (2), w której możesz wybierać różne układy ukończenia Profil (3) sekcja.

Note

  1. Możesz zarządzać szerokością sekcji z poziomu ustawienia sekcji i szerokość zawartości od styl treści.
  2. Idealny rozmiar obrazu, który musisz przesłać w tej sekcji, będzie zależał od liczby kolumn. Dowiedz się więcej.
  3. Tytuły, napisy i opisy powinny być krótkie i wyraźne.
  4. W polu opisu naciśnij Wchodzę przycisk, aby dać koniec linii i Shift + Enter przycisk, aby rozpocząć od następnej linii.


Dodawaj i edytuj elementy listy

Dodaj element listy

Po dodaniu sekcji:

  • Kliknij na Edytuj listę obrazów (1), aby otworzyć panel pozycji listy.

  • Kliknij na Dodaj przedmiot (2) przycisk, aby dodać nowy element listy.
  • Możesz wybrać Dpowielić lub usunąć (3) elementy listy.


Edytuj element listy

Kliknij element listy, który chcesz edytować. Spowoduje to otwarcie opcji edycji poszczególnych elementów listy.

Stąd możesz:

  • Prześlij/Usuń obraz główny i dodatkowy (1)
    Możesz przesłać plik Obraz wtórny oraz Obraz podstawowy dla każdego elementu listy. Gdy użytkownik najedzie kursorem na element, zostanie wyświetlony obraz drugorzędny, zastępując obraz główny. Dodatkowo możesz ustawić Kolor akcentu obrazu, który będzie wyświetlany po najechaniu kursorem na obrazek.
  • dodaj Tytuł (2), Podtytuł (3)i Opis (4) pozycji listy.
  • W zależności od wybranego układu opcja napisów i opisu może nie być dostępna w poszczególnych elementach listy.
    Przed dodaniem opisu sprawdź to artykuł.

5. Akcja po kliknięciu

Możesz dostosować zachowanie kliknięcia poszczególnych elementów w Profil sekcja. Poniżej znajdują się dostępne opcje:

  • Przejdź do linku
    Wybranie tej opcji otwiera Kreator linków, co pozwala na dodanie hiperłącza do tego elementu. Link może kierować użytkowników do innej strony w obrębie Twojej witryny lub zewnętrznego adresu URL. Dowiedz się więcej Parę słów o Kreator linków.
  • Otwórz w Lightboxie
    Ta opcja wyświetla element w powiększeniu Lightbox widok po kliknięciu. W tym trybie, Podtytuł oraz OPIS powiązane z elementem nie będą wyświetlane w widoku siatki, ale będą widoczne w trybie Lightbox.
  • Brak akcji
    Wybierz tę opcję, aby uczynić element nieklikalnym. Po wybraniu tej opcji kliknięcie na element nie wywoła żadnej akcji.

6. Otwórz link w nowym oknie: Ustaw łącze tak, aby otwierało się w a nowej karcie lub w tej samej karcie. Będzie to widoczne tylko wtedy, gdy Przejdź do linku opcja jest wybrana pod Akcja po kliknięciu menu.

7. Przyciski i ikony: Dodaj dowolny typ Połączyć do elementu listy. Możesz dodać Przycisk/Link do Obrazu/Ikonę Społecznościową/Link Tekstowy. Zobacz więcej.

8. Zastąpienie stylu karty

Możesz zastąpić globalne ustawienia stylu karty z sekcji Ustawienia stylu i spersonalizuj kartę każdego elementu indywidualnie w sekcji Profil. Dzięki temu możesz zastosować unikalne style do różnych elementów listy, aby zapewnić lepszą personalizację.

Zobacz więcej o opcji Karty w sekcji dynamicznej.

9. Nadpisanie stylu kształtu

Użyj opcji Nadpisz, aby przypisać każdemu obrazowi w sekcji Profil indywidualnie inny kształt. Dzięki temu zyskasz większą kontrolę nad stylem wizualnym każdego elementu. Zobacz więcej o Shape Mask.

10. Zapisz: Po wprowadzeniu zmian zapisz je.

Note

  • umożliwiać Kartki okolicznosciowe opcja z Ustawienia stylu aby zastąpić i dostosować karty do poszczególnych pozycji.
  • umożliwiać Maska kształtu opcja z Ustawienia stylu aby stylizować kształty oddzielnie dla każdego elementu.


Zobacz edytowanie elementu listy obrazów w akcji:


Elementy listy sekwencji

  • Możesz łatwo przeciągać i upuszczać elementy listy, aby zmienić kolejność.

Zobacz sekwencjonowanie elementów listy obrazów w akcji: 


Usuń element listy

Po dodaniu elementu listy możesz go edytować i usuwać.

  • Kliknij na Usunięcia obok elementu listy obrazów.
  • Tne, kliknij na Usunięcia w wyskakującym okienku potwierdzenia.
  • Wreszcie, zapisać Twoje zmiany.

Zobacz usuwanie elementu listy obrazów w akcji: 


Note

Usuniętych elementów listy nie można odzyskać.


Zarządzaj elementami sekcji profilu

Sekcja listy obrazów zawiera Karta Elementy co pozwala na łatwe zarządzanie widocznością różnych elementów w sekcji. Za pomocą prostych przełączników możesz włączać lub wyłączać określone elementy bez konieczności usuwania lub modyfikowania samych elementów.

  • Kliknij na Edytuj listę obrazów (1) przycisk.

  • Wybierz Elementy (2) zakładka.
  • Po wprowadzeniu zmian naciśnij Zapisz (3) przycisk.

Opcje sekcji

  1. Pokaż nagłówek: Włącz lub wyłącz widoczność nagłówka sekcji Lista obrazów.
  2. Pokaż przyciski: Steruj wyświetlaniem przycisków na poziomie sekcji.

Opcje elementów

  1. Pokaż obraz:Przełącz widoczność obrazów.
  2. Pokaż tytuł: Kontroluje, czy tytuł jest wyświetlany.
  3. Pokaż napisy: Włącz lub wyłącz napisy.
  4. Pokaż opis: Zarządzaj widocznością opisów przedmiotów.
  5. Pokaż przyciski:Zdecyduj, czy mają być wyświetlane przyciski dla poszczególnych elementów.


Układ sekcji

  • Kliknij na Edytuj listę obrazów (1) przycisk.

  • Wybierz układ (2) zakładka.
  • Wybierz układ dla Twojej sekcji i Zapisz (3) zmiany.

 

Pro Tip

Aby utworzyć sekcję o pełnej szerokości/sekcję listy z zakładkami, wybierz dowolny układ w zakresie od 25 do 29.

Komentarz

  • Możesz łatwo dodać do swojej strony układ listy z zakładkami.
  • Masz możliwość wyboru układu z zakładkami poziomymi lub pionowymi.
  • Pomaga w tworzeniu sekcji opartej na porównaniu.


Stylizuj swoją sekcję

  • Kliknij na Edytuj listę obrazów (1) przycisk.

  • Wybierz Styl (2) patka.
  • Zmień styl elementów przekroju i Zapisz (3) Twoje zmiany.


Będziesz mieć wiele opcji stylu dla sekcji: 

  1. Opcje wyświetlania
  2. Wyświetlacz mobilny
  3. Spójność
  4. Rozmiar tekstu
  5. Rozstaw zębów
  6. Nagłówek sekcji
  7. Opcje obrazów
  8. Maska kształtu
  9. Opcje przesuwania obrazu
  10. Ramka obrazu
  11. Opcje kart
  12. Opcje cienia
  13. Przyciski i linki

Wyświetlacz 

  1. Wybierz, aby Pokaż przedmioty in wiersze i kolumny or karuzela 
    • Jeśli wybrałeś wiersze i kolumny opcji, elementy listy zostaną ułożone w wiersze i kolumny. W takim przypadku musisz określić liczbę wierszy i kolumn.
    • Jeśli wybrałeś karuzela opcja, elementy listy zostaną przedstawione jako pokaz slajdów. Dowiedz się więcej.
  2. Ustaw Liczba kolumn dla listy obrazów. Możesz wybrać od 1 do 10 kolumn.
  3. Określ Przestrzeń Między Kolumnami z pozycji listy.
  4. Określ Przestrzeń Między Rzędami z pozycji listy.

Jeśli w kroku 1 wybrano opcję Karuzela, zobaczysz następujące dodatkowe opcje:

  1. Włącz płynne przewijanie:Umożliwia ciągłe przewijanie elementów w karuzeli, zapewniając płynne i atrakcyjne wizualnie wrażenia.
  2. Automatyczne przesuwanie:Automatyczne przełączanie slajdów bez interakcji użytkownika.
  3. Pokaż postęp automatycznego odtwarzania: Wyświetla wskaźnik postępu, gdy aktywne jest automatyczne odtwarzanie, zapewniając lepszą widoczność.
  4. Opóźnienie automatycznego odtwarzania: Ustawia odstęp czasu między przejściami slajdów, gdy włączone jest automatyczne odtwarzanie.
  5. Pętla karuzeli:Umożliwia ciągłe powtarzanie slajdów, dzięki czemu karuzela płynnie uruchamia się ponownie po ostatnim slajdzie.
  6. Sterowanie karuzelą: Wybierz Sterowanie nawigacjąMożesz wybierać pomiędzy opcjami Brak sterowania, Strzałki – Dolny środek/Górny prawy/Dolny prawy, Szewron, Kropki i Przewijanie poziome.
  7. Wyblakłe krawędzie: Zastosuj subtelny efekt zanikania na krawędziach karuzeli. Ulepsza to doświadczenie użytkownika poprzez delikatne łączenie obrazów, gdy wchodzą lub wychodzą z widoku.


Wyświetlacz mobilny

  1. Ustaw liczbę Kolumny siatki dla urządzeń mobilnych. Można ustawić maksymalnie 3 kolumny.
  2. Zdefiniuj Rozstaw zębów pomiędzy siatkami (w pikselach).

Układ kolumn specyficzny dla urządzenia na podstawie ustawień Studio:


Spójność

  1. Wyrównać zawartość poziomo na liście obrazów. Możesz ustawić je tak, aby były wyrównane do lewej, prawej lub do środka.
  2. Wyrównać zawartość w pionie na liście obrazów. Można je ustawić tak, aby były wyrównane do góry, do środka i do dołu.
  3. Wybierz Kolejność treści tj. obrazy elementów listy, które mają być wyświetlane jako pierwsze, lub związany z nimi tekst.


Rozmiar tekstu

  1. Kliknij na Zmień styl tekstu przycisk, aby odwiedzić Wnętrze sekcji i zarządzaj rozmiarami i stylami czcionek. 
  2. Ustaw Tytuł styl czcionki dla elementów listy w sekcji.
  3. Ustaw Podtytuł styl czcionki dla elementów listy w sekcji.
  4. Ustaw wartość domyślną OPIS styl czcionki dla elementów listy w sekcji.
  5. Włącz tę opcję, aby animować dowolne liczby obecny w Tytuł oraz Podtytuł Pola. Po włączeniu tej opcji wartości liczbowe będą wyświetlane z dynamiczną animacją liczenia, co sprawi, że będą bardziej atrakcyjne wizualnie.


Rozstaw zębów

  1. Określ Szerokość obrazu dla elementów listy.
  2. Określ Szerokość treści dla pozycji listy.
  3. Określ Spacja pod nagłówkiem sekcji w pikselach
  4. Określ Miejsce pod obrazami pozycji na liście (w %).
  5. Określ Spacja pod tytułami pozycji na liście (w %).
  6. Określ Miejsce pod napisami pozycji na liście (w %).


Nagłówek sekcji

  1. Wyrównaj poziomo tekst nagłówka sekcji. Można ustawić go na Lewo, Środek i Prawo.
  2. Włącz/wyłącz dzielnik między nagłówkiem sekcji i jej zawartością.
  3. Ustaw grubość przegrody (w pikselach).
  4. Określ Kolor rozdzielacza z próbnika kolorów.
  5. Wybierz Styl dzielnika z listy rozwijanej.
  6. Ustaw Szerokość nagłówka aby określić szerokość tytułu sekcji, zaczynając od minimum 50%.


Obrazy 

  1. Wybierz Iuprawa maga dla elementów listy. Można ustawić obrazy jako kwadratowe, okrągłe, poziome, pionowe i oryginalne.
  2. Wybierz wspólny promień narożnika lub inny promień narożnika dla każdej strony elementów listy i ustaw liczbę (w pikselach) dla Cpromień ornera obrazów elementów listy. Dowiedz się więcej.

Wskazówka

Korzystanie z promień narożnika możesz tworzyć różne kształty obrazów elementów listy. Jeśli określisz tutaj 500 pikseli, obrazy będą wyświetlane w kształcie koła.

  • Jeśli wybrałeś narożniki dzielone, możesz ustawić inny promień narożnika dla każdego narożnika.


Maska kształtu

  1. Maska kształtu: Włącz ten przełącznik, aby zastosować maskę kształtu do obrazów w sekcji Lista obrazów. Po włączeniu wybrany kształt wizualnie przytnie obraz do tego formularza.
  2. Wybierz kształt: Wybierz spośród różnych predefiniowanych kształtów, które chcesz zastosować do swoich obrazów. Pozwala to na kreatywne stylizowanie treści poprzez wyświetlanie obrazów w unikalnych formach, takich jak zaokrąglone, diamentowe, kroplone itp.
  3. Rozciągać: Włącz tę opcję, aby rozciągnąć wybrany kształt, aby lepiej pasował do kontenera obrazu. Dzięki temu kształt wypełni dostępną przestrzeń proporcjonalnie, zwiększając wizualne wyrównanie na różnych rozmiarach ekranu.

Komentarz

  • Opcja rozciągania jest zależna od układu – Może nie pojawiać się w niektórych układach. W układach, w których tekst, taki jak tytuł lub podtytuł, jest wyświetlany nad obrazem, opcja całej maski kształtu może być niedostępna.
  • Ustawienie rozciągania zależy od wielu czynników - włącznie z rozmiar obrazu, wyrównanie, ustawienia przycinania zdefiniowano na karcie Styl.
  • Jeśli opcja Przycinanie obrazu jest ustawiona na Oryginał, rzeczywiste wymiary obrazu decydują o tym, czy zostanie on rozciągnięty w pionie czy w poziomie.


Po najechaniu na obraz 

  1. Wybierz Kolor po najechaniu na obraz być kolor akcentu albo być określony. Jeśli wybrałeś kolor akcentu, a następnie określ nieprzezroczystośćMożesz określić kolor akcentu dla każdego elementu z Edytuj element płyta.
  2. Jeśli wybrałeś określ kolor opcję, a następnie ustaw Nałóż kolor i krycie.
  3. Ustaw Nałóż kolor tekstu który pojawia się po najechaniu kursorem.
  4. Wybierz, aby Animuj obrazy elementów listy po najechaniu myszką, klikając Tak. Sprawdź tę funkcję na aktywnej stronie.
  5. Wybierz Styl animacji dla obrazów po najechaniu na nie kursorem.
  6. Wybierz, czy chcesz zezwolić na Przejście obrazów niezależnie od tego, czy najedziesz kursorem, czy nie.
  7. Wybierz Styl przejściowy dla przejścia hover. Dostępne opcje to Fade i Flip.


Ramka obrazu

  1. Włącz / wyłącz granicę wokół obrazów, przełączając przełącznik.
  2. Wybierz opcję posiadania wspólna granica po wszystkich stronach obrazów lub możesz określić granice osobno dla każdej strony.
  3. Określ szerokość granicy. Jeśli jest ustawiona na 0, ramka nie będzie widoczna. Możesz także ustawić szerokość obramowania indywidualnie dla każdej strony obrazu.
  4. Wybierz Kolor ramki z próbnika kolorów.
  5. Wybierz preferowany Styl graniczny z listy rozwijanej.
  6. Określ szerokość obramowania dla urządzeń mobilnych urządzeń, dopasowując ją do szerokości wybranej dla komputera stacjonarnego.


Kartki okolicznosciowe


Shadow

  1. Wyświetlacz – Wybierz wyświetlanie cienia za elementami listy zawsze lub tylko po najechaniu myszką.
  2. Styl – Wybierz spośród istniejących ustawień wstępnych lub utwórz niestandardowy cień.
    Jeśli wybrałeś opcję Niestandardowa, odwiedź tę stronę Generator cieni pudełkowych , aby utworzyć niestandardowy cień. Na koniec skopiuj i wklej plik CSS cienia pudełka.
  3. Jeśli wybrałeś opcję ustawień wstępnych, to Wybierz Style cieni z listy rozwijanej.


Przyciski i linki

  1. Zobacz jak zarządzać stylizacją Przyciski i łącza.
  2. Zapisz wszystkie zmiany stylu.


Nie możesz znaleźć tego, czego szukasz?

Skontaktuj się z Ekspertem Pixpa.

Pixpa Studio właśnie przeszło modernizację. Aktualizujemy obecnie wszystkie zrzuty ekranu z artykułów pomocy.