Jak zmienić położenie adresu nabywcy by pasował do koperty C5 162x229 (z okienkiem)?

Utworzono: 2014-06-18
Ostatnia aktualizacja: 2025-04-02
Liczba odwiedzin posta: 6042

W Fakturowni możesz dostosować wygląd faktury do swoich potrzeb, korzystając z kodów CSS. Dzięki temu masz możliwość zmiany położenia adresu nabywcy tak, aby idealnie pasował do okienka koperty C5 (162x229). W tym artykule znajdziesz odpowiedni kod CSS oraz instrukcję, jak go zastosować w ustawieniach konta.

Jak zmienić położenie adresu nabywcy by pasował do koperty C5 162x229 (z okienkiem)?


Aby adres odbiorcy faktury mieścił się w okienku koperty C5 162x229 z oknem prawym jak poniżej:

Biała koperta C5 z okienkiem, idealna do korespondencji biznesowej i dokumentów o standardowych rozmiarach.

  1. przejdź do zakładki Ustawienia > Ustawienia konta > Wydruki

    Panel ustawień konta w Fakturowni z zaznaczoną sekcją „Wydruki” do konfiguracji wyglądu dokumentów i drukowania.
     
  2. następnie przejdź do sekcji Konfiguracja i znajdź pole Konfiguracja wydruku przez CSS

    Ekran konfiguracji wydruków w aplikacji fakturowania z opcją edycji CSS i formatem waluty ustawionym na PLN.
     
  3. w dedykowane pole wklej kod CSS, który znajdziesz poniżej;
  4. zatwierdź zmiany przyciskiem Zapisz na dole strony. 
 
UWAGA! Aby zweryfikować z jakiego szablonu korzystasz, przejdź do zakładki Ustawienia > Ustawienia konta > Szablony lub sprawdź szablon wybrany w ustawieniach działu, jeśli korzystasz z opcji domyślnego szablonu dla działu

Kod CSS działa dla szablonu Default:


td.logo_inside img {
    max-height: 139px;
}

hr {display:none}

table.clean.split_half {
    margin-top:0;
}

table.clean.to_half td p,
table.clean.to_half td,
table.clean.to_half {
   margin-top:0;
   margin-bottom:0;
}

table.clean.split_half th + th,
table.clean.split_half td + td{
    width:25%;
}

.invoice_outline > .clean.to_half + hr {
    margin: 0px auto;
}

 

Możesz również spróbować zmieniać wartości w kodzie CSS.

Położenie w pionie zmienia ten fragment kodu (im mniejsza wartość width, tym napis przesuwa się w lewo):

table.clean.split_half th + th,
table.clean.split_half td + td{
    width:25%;
}


Natomiast położenie w poziomie zmienia ten fragment kodu (im wartość max-height większa, tym adres przesuwa się bardziej do dołu):

td.logo_inside img {
    max-height: 139px;
}

Poniżej przedstawiamy przykład zmiany położenia adresu Nabywcy dla szablonu default.

WAŻNE! Pamiętaj, że zmiany wprowadzone kodem CSS widoczne będą dopiero na wydruku faktury lub pobranym PDF.

Porównanie domyślnego i zmodyfikowanego CSS-em położenia danych nabywcy na fakturze wygenerowanej w systemie Fakturownia.
 

Sprawdź również:
Jak zmienić położenie adresu nabywcy, by pasował do Koperty DL 110x220?
Jak zmienić wygląd niektórych elementów na fakturze?
Konfiguracja wydruku przez CSS



Powrót


Komentarze

Avatar sugester medium
Michal
Witam,
proszę o info, jak przesunąć dane odbiorcy na fakturze bardziej na lewo. Próbowałem powyższy kod, ale nie działa. Dziękuję.

2021-07-16 12:14


Avatar sugester medium
Michal
Tylko dodam - na fakturze blue. Dzięki

2021-07-16 12:15


Kacper_Seta
Kacper_Seta
Odpowiedź główna   Dzień dobry,
niestety podany wyżej kod nie jest przystosowany dla szablonu blue, nie mamy przygotowanego kodu CSS dla tego szablonu.

Podany kod prawidłowo przemieszcza dane Nabywcy na wydruku / w PDF dla szablonu default.

Pozdrawiam
Kacper

2021-07-16 12:55


Kacper_Seta
Kacper_Seta
Odpowiedź główna   Dzień dobry,
niestety dla szablonu Blue nie ma możliwości przesunięcia danych Nabywcy za pomocą kodu CSS wklejanego w Wydrukach. Takie przesunięcie można wykonać jedynie tworząc nowy szablon faktury na podstawie kodu szablonu Blue, można to zrobić od planu Standard w Ustawienia -> Ustawienia konta -> Szablony -> Dodaj nowy szablon, wczytująć kod szablonu Blue.

W edycji nowego szablonu, w polu css należy odnaleźć:
@media print {
kod css
}

Wewnątrz tego tagu, przed domknięciem klamry (około 280 linii), należy wkleić:
table.clean.split_half thead tr th:last-child {
padding-left: 106px;
}

table.clean.split_half tbody tr td#buyer {
padding-left: 106px;
}

.clean.split_half {
margin-top: 34px;
}

Pierwsza część odpowiada za przesuwanie słowa nabywca w poziomie, druga za przesuwanie adresu nabywcy w poziomie, trzecia część to przesuwanie całego wiersza ze sprzedawcą i nabywcą w pionie. Podane wartości marginów i paddingów są tylko przykładem. Należy samodzielnie dobrać odpowiednie wielkości do wyrównania względem rozmiarów koperty - dla ułatwienia warto użyć cm zamiast px (na przykład padding-left: 5cm).

Padding-left - im większa wartość tym większe przesunięcie w prawo
margin-top - im większa wartość tym przesunięcie jest większe do dołu
Analogicznie można też użyć właściwości padding-right i margin-bottom. Wartości paddingów nie mogą być ujemne.

Pozdrawiam
Kacper

2021-07-20 14:28


Dodaj komentarz