Obracanie elementu i odbicie lustrzane

Jeżeli chcesz obrócić dany element na Twoim landing page'u lub uzyskać efekt odbicia lustrzanego, możesz to zrobić na jeden z dwóch sposobów:

• obraz możesz odbić lustrzanie lub obrócić o 90, 180 i 270 stopni bezpośrednio w edytorze;
• odbicie i obrót ikony oraz niestandardowy obrót obrazu ustawisz za pomocą kodu CSS.

Odbicie i obrót obrazu w edytorze

W ten sposób obijesz i obrócisz obrazy także na pop-upie.

1. W edytorze dodaj widget Obrazek (1) i wgraj swoją grafikę (2).

2a. Dodając obraz opcją Wyślij obrazki, od razu możesz przejść do edycji grafiki – kliknij Edytuj obraz.

2b. Wybierając jedną z pozostałych opcji przesyłania obrazu, dodasz daną grafikę najpierw do galerii. W galerii najedź kursorem na obraz i kliknij Edytuj.

3. Zobaczysz okno edycji. Możesz w nim m.in. obrócić obraz (1), odbić go pionowo (2) lub poziomo (3). Aby zapisać zmiany, kliknij Dodaj.

Edytowany obraz zostanie dodany do galerii jako kopia. Teraz możesz go użyć na swojej stronie.

Niestandardowe odbicie i obrót

1. Przejdź do edytora wybranego landing page’a.

2. Odszukaj element, który chcesz obrócić. Kliknij w niego i z zakładki Inne po prawej stronie skopiuj numer ID.

2. Przejdź do Ustawień strony i kliknij Dodaj własny CSS.

W trakcie edycji do Ustawień strony wrócisz, klikając na strzałkę:

3. Skopiuj podany poniżej kod CSS i wklej go w zakładce Strona główna. Zamień IDelementu na wcześniej skopiowany numer ID.

UWAGA: Zmiana będzie widoczna dopiero na opublikowanym landing page'u.

Obracanie elementu

• Wartość rotate(45deg) oznacza, że element obróci się o 45 stopni zgodnie z ruchem wskazówek zegara. Jeżeli chcesz zmienić tę wartość, wpisz w nawiasie inny zakres stopni, np. rotate(90deg).
• Jeżeli chcesz obrócić wybrany element przeciwnie do ruchu wskazówek zegara, wówczas wpisz symbol minus „-” w nawiasie przy wartości stopni, np. rotate(-30deg).

#IDelementu {
transform: rotate(45deg);
}

Odbicie lustrzane

#IDelementu {
transform: scaleX(-1);
}

5. Kliknij Zapisz i zamknij. Następnie opublikuj swój landing page.