Cómo cambiar algunos elementos en factura utilizando códigos CSS
Última actualización: 06/11/2023
La instrucción se refiere solo a la plantilla por defecto - default.
Para cambiar algún elemento en la copia impresa, por ejemplo la inscripción original/copia hay que entrar en Ajustes de cuenta > Ajustes de impresión y en la parte inferior de la página rellenar el campo Personalizar impresión con CSS (según el siguiente esquema)
Para cambiar el tamaño del texto en toda factura hay que introducir el siguiente código (funciona con todas plantillas):
.invoice_outline * {
font-size: 12px;
}
Para que el texto este incluso más grande hay que introducir valores mayores, para el tamaño más pequeño - menores.
Analógicamente se puede afectar a los campos de factura.
Para cambia el color y el tamaño de otros elementos en la impresión o PDF hay que utilizar el código CSS más avanzado:
Cambio del color y el tamaño de fuente en la sección
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;
}
Después de introducir este código la fecha del pago y número de cuenta bancaria aparecerán en rojo y en fuente más grande (solo en plantilla default)
Para ampliar el campo con el termino de pago en la plantilla BLUE hay que utilizar el siguiente código:
.additional_data p + p + p {
color: red !important;
font-size:1.4em;
}
Para aumentar el tamaño del nombre de factura:
.invoice_title strong { font-size: 3em; }
Para aumentar el tamaño del numero de factura:
.invoice_title > span { font-size:2em; display:block; margin-top:10px; }
Cambiando el número de font-size cambiamos el tamaño de letra.
Para aumentar el tamaño del nombre Factura IVA (plantilla blue y old):
.invoice_title h1 {
font-size: 5em;
}
en plantilla default:
(primer código cambia el tamaño de la inscripción, el segundo el número de factura)
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;
}
Cambiando el número de font-size cambiamos el tamaño de letra.
Para eliminar de la impresión el sello Pagado ( todas plantillas)
html body .invoice_outline {
.invoice_outline { background-image: none !important; }
#paid_mark { display: none; }
}
Para trasladar una parte de información a la parte derecha de impresión en plantilla Default hay que utilizar el código siguiente:
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;
}
Para modificar los titulares de las firmas en la parte inferior de factura (añadir unas inscripciones) hay que utilizar este código (el contenido es solo un ejemplo):
.split_three tr td:first-child strong:before {
content: declaración i ;
margin-bottom: 5px;
}
.split_three tr td:last-child strong:after {
content: - persona autorizada para expedir factura;
margin-bottom: 5px;
}
Para cambiar los márgenes del documento:
@page {
size: 8.5in 11in; /* primer valor - anchura, segundo valor - altura de la hoja */
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;
}
Se puede cambiar los valores según las necesidades.
Para eliminar los márgenes de factura:
.invoice_outline {
margin: 0 !important;
padding: 0 !important;
}
@page{size:portrait;margin:0;padding:0;}
Para cambiar de lugar el logotipo y datos de emisor en la plantilla 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;
}
Atrás
viernes, 26 de junio de 2020 16:11:15 +0200