Jak zmienić wygląd niektórych elementów na fakturze?

Utworzono: 2016-12-24 Liczba odwiedzin posta: 13612

Uwaga! Proszę pamiętać, że poniższe zmiany są widoczne jedynie na wydruku lub wygenerowanym PDF z systemu.
Podane instrukcje dotyczą wyłącznie szablonu domyślnego - default.

Aby zmienić jakiś element faktury na wydruku np. napis oryginał/kopia  trzeba w menu USTAWIENIA >  WYDRUKI ( zakładka ), a następnie  na dole strony wypełnić pole  Konfiguracja wydruku przez CSS ( wedle schematu jak poniżej )

 

czesciowa-edycja-wygladu-faktury

( na powyższym zrzucie ekranu widać jedynie prezentację okna) 

 

Aby np. zwiększyć wielkość tekstu na całej fakturze trzeba wpisać poniższy kod (działa we wszystkich szablonach):

 

 

.invoice_outline * {
    font-size: 12px;
}

 

 

Aby tekst był jeszcze większy trzeba wpisać wartości wyższe, a aby był mniejszy niższe.

 

 

Analogicznie można wpływać na wielkość innych pól na fakturze.

 

Aby zmienić kolor i wielkość innych elementów na wydruku/pdf faktury trzeba zastosować bardziej zaawansowany css:

 

zmiana koloru i wielkości czcionki w sekcji sprzedawca

 

table.clean.to_half > tbody > tr > td:first-child p + p + p {
color: red !important;
font-size:1.4em;
}

 

table.clean.to_half > tbody > tr > td:first-child p + p + p + p{
color: #000 !important;
}

 

table.clean.split_half > tbody > tr > td:first-child p:last-child{
color: red !important;
font-size:1.4em;
}

 

 

Po wpisaniu powyższego kodu na czerwono zaznaczą się nam linie na dokumencie jak na zrzucie poniżej ( ten styl CSS działa tylko w szablonie DEFAULT )

 

Aby zwiększyć w szablonie BLUE pole termin płatności trzeba zastosować poniższy kod:

 

.additional_data p + p + p {
color: red !important;
font-size:1.4em;
}

 

-------------------------

 

Jak zwiększyć wielkość nazwy faktury:

 

.invoice_title strong { font-size: 3em; }

 

Jak zwiększyć wielkość numeru faktury:

.invoice_title > span { font-size:2em; display:block; margin-top:10px; }

 

Zwiększając wielkość font-size czcionka numeru będzie się powiększać.

 


 

 

Jak zwiększyć wielkość nazwy Faktura VAT ( szablon blue i old ):

 

 

 

.invoice_title h1 {    
    font-size: 5em;
}

 

 

w szablonie default poniżej:

( pierwszy kod zwiększa sam napis faktura, a drugi numer faktury )

 

1.

 

.invoice_outline  .clean.to_half td p.invoice_title strong{
   font-size:4em !important;
}

 

2.

 

.invoice_outline  .clean.to_half td p.invoice_title span {
   font-size:2em !important;
}

 

 

 

Zwiększając wielkość font-size czcionka nazwy faktury będzie się powiększać.

 

 


 

 

Jak usunąć z wydruku pieczęć Opłacono (działa we wszystkich szablonach)

 

html body .invoice_outline {
    .invoice_outline { background-image: none !important; }
    #paid_mark { display: none; }
}

 

 

 

 


 

Aby w szablonie Default przenieść część informacji na prawą stronę wydruku ( jak na zrzucie poniżej ) ...

 

 

... należy skorzystać z poniższego kodu:

 

 

table.clean.to_half td {
width:100%;
}

 

table.clean.to_half td p {
text-align: right;
}

 

table.clean.to_half td.logo_inside,
table.clean.to_half td.logo_inside p {
padding:0;
margin:0;
width:1px !important;
}

 

 


 

 

Aby zmodyfikować nagłówki podpisów na dole faktury (dodać do nich dopiski) trzeba zastosować poniższy kod ( wpisane treści są przykładowe) :

 

.split_three tr td:first-child strong:before {
    content: Oświadczenie i ;
    margin-bottom: 5px;
}

 

.split_three tr td:last-child strong:after {
    content: - osoby upoważnionej do wystawiania faktury VAT;
    margin-bottom: 5px;
}

 

Jak zmienić marginesy drukowanego dokumentu:


@page {
    size:  8.5in 11in;  /* pierwsza wartość dotyczny szerokosci a druga wysokosci kartki */   
    margin-top: 0.5in;
    margin-right: 0in;    
    margin-bottom: 0.5in
    margin-left:0.5in;
}

.invoice_outline {
    margin-top: 0.5in;
    margin-right: 0.5in;    
    margin-bottom: 0.5in
    margin-left:0.5in;
    
}

 

Powyższe wartości można zmieniać w zależności od potrzeb.

 

Poniżej przykład jak zupełnie wyeliminować marginesy z faktury:

 

.invoice_outline {
margin: 0 !important;
padding: 0 !important;
}    


@page{size:portrait;margin:0;padding:0;}

 

-------------------------------------------

Jak zamienić miejscami logo i dane wystawcy w szablonie default

table.clean.to_half tbody tr td {
float: right;
width: 45%;
}

table.clean.to_half tbody tr td.logo_inside {
float: left;
width: 45%;
display: inline-block;
}

 

---------------------------------------------

Więcej na ten temat można przeczytać na tej stronie: http://www.tutorialspoint.com/css/css_paged_media.htm


 

Na tej stronie http://pomoc.fakturownia.pl/Wyglad-faktur-i-pola-na-fakturze/144204-Jak-zmienic-polozenie-nabywcy-by-pasowal-do-koperty-z-okienkiem-  można dowiedzieć się jak zmienić położenie adresu nabywcy by pasował do koperty z okienkiem.

 

podpowiedź do tego rodzaju CSS można znaleźć np. tu - http://algorytmy.pl/doc/xhtml/index.php?c=0&q=child

 


Do poznania klasCSS  i ID CSS różnych elementów na fakturze można kliknąć 2 przyciskiem myszy na fakturze i wyświetlić jej źródło. Można również skorzystać z narzędzia FIREBUG - do zainstalowania pod tym linkiem https://addons.mozilla.org/en-us/firefox/addon/firebug/


Więcej na temat CSS można przeczytać na tej stronie http://algorytmy.pl/doc/xhtml/?id=102

 



Powrót


Komentarze

Avatar sugester medium
Piotr
Witam! Używam niżej załączonego szablonu. Świetnie pasuje do koperty z okienkiem.
czy mogę jego mieć jako mój szablon? Niestety nie znam się na CSS. Ale jak próbowałem coś tam robić w moim szablonie, który założyłem, to później nie mogłem go zastosować. W edycji faktury niema opcji mój szablon. Tylko default, old, blue.
Proszę o pomoc. Chce już zapłacić i mieć to z głowy, ale żaden szablon Państwa mi nie pasuje. Mógł bym używać blue ale drukując na czarno-biało (bo mam taką drukarkę), niebieski kolor słabo widoczny.
Please Help
Pozdrawiam

lukaszk
lukaszk
Piotrze, jak możesz prześlij wzór faktury na nasz adres helpdesk@fakturownia.pl

2013-02-04 15:33

Zgłoś naruszenie zasad

ud@194538
d@yveo.pl
Chciałbym zmienić jednocześnie 3 rzeczy: zwiększyć teksy na całej stronie np: do 120%, dopasować nabywce do kopert DL, oraz obniżyć pieczęć o 5 cm.

Znalazłem te 3 "kody" i jak je dodałem jeden pod drugim to żadne nie działa, co mam zrobić aby działały wszystkie 3 lub kolejne inne jeśli będę chciał je uruchomić w przyszłości?

2013-08-13 17:06

Zgłoś naruszenie zasad

michal
michal
Odpowiedź główna   Kody wklejone kolejno jeden pod drugim powinny zadziałać. Proszę pamiętać aby odpowiednio zamykać i otwierać nawiasy. Czyli wklejone kody powinny wyglądać następująco:

.invoice_outline {
font-size: 120%;
}


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

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

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

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

#custom_stamp {
background-position: 100% 94% !important;
}

2013-08-14 10:37

Zgłoś naruszenie zasad

michal
michal
Odpowiedź główna   Trzeba wkleić kod bez dopisku "@media all "

2013-09-05 14:04

Zgłoś naruszenie zasad

uir211422
irek.tarka@interia.pl
.invoice_outline {
font-size: 120%;
}

2013-11-13 21:52

Zgłoś naruszenie zasad

uir211422
irek.tarka@interia.pl
html body .original_copy {
font size:3.2em;
}

2013-11-13 21:55

Zgłoś naruszenie zasad

firewall-it
firewall-it
Witam, chciałbym się dowiedzieć jak można zmienić kolory w szablonie blue, wszystkie te co są na niebiesko na inny kolor. Pozdrawiam i dzięki za odpowiedź.

2014-01-05 21:21

Zgłoś naruszenie zasad

michal
michal
Odpowiedź główna   aby zmienić kolor niebieski na inny trzeba w polu CSS wpisać poniższy kod (wartość koloru zamieniając inną wartością ):

table th, strong {
color: #00A6F0;
}



2014-01-07 10:51

Zgłoś naruszenie zasad

ubi219285
biuro@mtap.pl
Jak zmienić wysokość położenia podpisu na dole strony (numer strony oraz "wygenerowano w Fakturownia.pl")?
Posiadam papier firmy z stopką oraz nagłówkiem i potrzebuje przesunąć automatycznie generowaną stopkę o kilka centymetrów do góry.
Zmiana rozmiaru marginesów działa na górną część dokumentu ale dolny margines jedynie wydłuża stronę a podpis dalej pozostaje na tym samym miejscu.
Własny szablon także nie działa ponieważ system automatycznie dodaje stopkę.

2014-03-13 15:36

Zgłoś naruszenie zasad

lukaszk
lukaszk
Obecnie nie posiadamy funkcji która umożliwia zmniejszenie czcionki w uwagach drukowanych na drugiej stronie faktury.W druku zamówienia moze Pan wprowadzić dane i nabywcy i wystawcy dokumentu

2014-04-07 16:01

Zgłoś naruszenie zasad

Yoshihiro
Yoshihiro
Witam. Czy mógłbym prosić o pomoc. Chciałem przenieść nabywcę na prawą stronę, tak, aby pasowała do koperty z okienkiem.

Prosiłbym o wskazanie, którego kodu powinienem użyć.

Pozdrawiam

2014-04-15 16:31

Zgłoś naruszenie zasad

uma231051
masterg@interia.pl
POMIJAJAC FAKT ZE PROGRAM JEST ZAJEBISTY TO CHCIALBYM O DOPRACOWANIE...
1. CZY DA SIE W DEFAULCIE WWW I MAILA UPCHAC W JEDNEJ LINI?
2, JESLI UPCHAM DO JEDNEJ LINI TO CHCIALBYM ZWIEKSZYC CZCIONKE
3.CZY MOZNA TEL ZMIANIC NA "MOBILE, HANDY, LUB PHONE"?
4. CZY MOZNA DAC TROSZKE KOLOROW? NP JAK W BLUE NIEBIESKIE LINIJKI ?

2014-04-26 13:00

Zgłoś naruszenie zasad

Avatar sugester medium
Jakub
Witam,
używam szablonu blue. Chciałem zmienić kolor niebieski na #5D1349 .
Zastosowałem taki kod:

table th, strong {
color: #5D1349; important!;
}

Po wstawieniu niestety nie zmienia koloru czcionki, bardzo proszę o pomoc!

2014-08-06 14:20

Zgłoś naruszenie zasad

piotr.wajs
piotr.wajs
Odpowiedź główna   Witam,
przed słowem "important" nie powinno być średnika i wykrzyknik powinen znaleźć się przed słowem a nie po nim.

2014-08-06 15:01

Zgłoś naruszenie zasad

usz309501
szwalek.k@gmail.com
Jak zwiększyć czcionkę na fakturze dla: Wartość netto, Wartość VAT, Wartość brutto

2015-01-28 15:39

Zgłoś naruszenie zasad

ubi175770
biuro@eco-light.com.pl
witam, jak zmienić logo na fakturze??

2015-04-20 22:33

Zgłoś naruszenie zasad

piotr.wajs
piotr.wajs
Odpowiedź główna   Witam ,
należy wejść w zakładkę Ustawienia>Ustawienia konta>Wydruki>Logo na fakturze i skorzystać z przycisku "Przeglądaj", należy wybrać nowe logo i zapisać zmiany.

2015-04-21 14:04

Zgłoś naruszenie zasad

Avatar sugester medium
Maniek
Witam,

Chciałbym zapytać, czy jest możliwość dostosowania wydruku do drukowania na drukarce fiskalnej ? Wymiar 57 mm. Pozdrawiam

2015-05-16 13:01

Zgłoś naruszenie zasad

Avatar sugester medium
piotr.wajs
Nie obsługujemy wydruków faktur na drukarkach fiskalnych.

2015-05-18 11:44

Zgłoś naruszenie zasad

Avatar sugester medium
Alina
Chciałabym żeby numer telefonu i email nabywcy wyświetlał się na zamówieniu i na fakturze. W tej chwili nawet gdy wpisuję nr tel to i tak go na zamówieniu i fakturze nie widać. Czy jest opcja by go dodać?

2015-06-19 11:34

Zgłoś naruszenie zasad

Avatar sugester medium
piotr.wajs
Witam,
informacje, których Pan potrzebuje na fakturze proszę wpisać w rubryce "Dodatkowy opis", wtedy pojawią się one na fakturze.

2015-06-29 10:03

Zgłoś naruszenie zasad

uol230025
old2014-pawelw.poland@wp.pl
Nie mogę powiększyć loga...wydaję mi się,że wpisuję poprawny kod a logo pozostaje tego samego rozmiaru.Chciałbym powiększyć logo na już stworzonej fakturze.Proszę o pomoc...

2015-09-14 17:57

Zgłoś naruszenie zasad

Avatar sugester medium
ujastek
metodą prób i błędów zrobiłem szablon o nazwie mój. Jest nawet OK.
Niestety przerasta mnie zrobienie szablonu do e-listów, który jest w formacie wysłanym w pliku. Oczywiście można wejść na stronę e-listy i tam zobaczyć jaki wymagają format. Potrzebuję tego ponieważ większość moich klientów nie ma e-maila i muszę wysyłać ręcznie przez pocztę. Zgłosiłem w sugestiach ale widzę, że to potrwa a taki szablon pozwolił by mi poczekać aż Państwo zaimplementują taka funkcję.

2015-09-28 06:05

Zgłoś naruszenie zasad

Avatar sugester medium
ujastek
Zrzut ekranu 2015 09 28 o 05.54.26
metodą prób i błędów zrobiłem szablon o nazwie mój. Jest nawet OK.
Niestety przerasta mnie zrobienie szablonu do e-listów, który jest w formacie wysłanym w pliku. Oczywiście można wejść na stronę e-listy i tam zobaczyć jaki wymagają format. Potrzebuję tego ponieważ większość moich klientów nie ma e-maila i muszę wysyłać ręcznie przez pocztę. Zgłosiłem w sugestiach ale widzę, że to potrwa a taki szablon pozwolił by mi poczekać aż Państwo zaimplementują taka funkcję. Nie dodałem załącznika. Przepraszam.

piotr.wajs
piotr.wajs
Odpowiedź główna   Witam,
opowiadając na pytanie co do wielkości logo na fakturze. Proszę o wysłanie w korespondencji prywatnej adresu konta zarejestrowanego w serwisie Fakturownia, oraz przysłać w załączniku plik pdf z wyglądem logo na fakturze.

2015-09-28 12:01

Zgłoś naruszenie zasad

piotr.wajs
piotr.wajs
Odpowiedź główna   Odnośnie tworzenia własnego szablonu dostosowanego do wysyłki e-listów. Niestety nie świadczymy pomocy technicznej przy szablonach stworzonych przez Użytkownika w ramach wykupionych pakietów abonamentowych. Może Pan jednak skorzystać ze wsparcia technicznego odpłatnie. Informacje o kosztach znajdzie Pan pod adresem:
http://radgost.com/wsparcie-techniczne.

2015-09-28 12:19

Zgłoś naruszenie zasad

Avatar sugester medium
Daniel
Witam czy w szablonie plain black można dokonywać zmian? Chciałbym powiększyć wielkość tekstów oraz imię i nazwisko odbiorcy i wystawiającego przenieść trochę niżej.

2015-10-20 13:16

Zgłoś naruszenie zasad

Avatar sugester medium
Konrad Cieciera
Chciałbym podmienić na fakturze walutowej (np.EUR) w linii "Do zapłaty": kwotę (wartość) + opis słowny do zapłacenia na PLN.
Dlaczego? Produkty wymienione na fakturze oferuje i kontraktuje w walucie producenta (EUR) i w takiej walucie fakturuje, jednak płatność wśród polskich odbiorców jest w PLN, więc pomimo zastosowanego jako opcja przelicznika EUR->PLN wg NBP mylnie sądzą, że mają zapłacić w EUR, ponieważ taka jest informacja "do zapłaty: xxx,xx euro, xx, cents". Nie jest to jakiś trudny kod, a jedynie należy podmienić miejsce skąd powinny byc pobierane wartości. Czy możecie Państwo pomóc?

2016-04-21 10:56

Zgłoś naruszenie zasad

ufi290847
firma@incerbo.pl
Dzień dobry!
Zmodyfikowałem szablon black i wszystko gra pięknie tylko nie wyświetla się linia z numerem zaimportowanego zamówienia. W szablonie "default" wyświetla się bez problemu. Mogę wiedzieć jaka zamienna odpowiada za wyświetlanie tego elementu? Z góry dziękuję!

2016-08-01 11:26

Zgłoś naruszenie zasad

piotr.wajs
piotr.wajs
Odpowiedź główna   Witam , czy w zakładce Ustawienia> Ustawienia konta> Wydruki jest zaznaczone okno 'Wstaw numer zamówienia".

2016-08-02 09:56

Zgłoś naruszenie zasad

Avatar sugester medium
Tomek
Witam, jak zmienić tytuły/nazwy generowanych pdf ? faktura, WZ itp.

2016-11-06 22:37

Zgłoś naruszenie zasad

Dodaj komentarz