Saltar al contenido

Precio Dinamico

Te comparto el codigo de un script que sirve para tener un precio dinamico en tu pagina de ventas en especial si usas para vender productos de hotmart.

HTML

font-weight, indica el grosos de la letra.
text-aling: center, es para que se centre el texto.
line height, es el salto de linea entre párrafos.

IMAGEN
https://cdn.ipwhois.io/flags/us.svg
Bandera: heigh 10 – Wight 247.
17 * 12.75

Imagen de Formas de Pago
tamano personalizado: width 200

Tipografía Fuente por defecto de ipwhois

https://fonts.googleapis.com/css?family=Roboto%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic%7CRoboto+Slab%3A100%2C100italic%2C200%2C200italic%2C300%2C300italic%2C400%2C400italic%2C500%2C500italic%2C600%2C600italic%2C700%2C700italic%2C800%2C800italic%2C900%2C900italic&display=swap&ver=6.1.1

PageSpeed

CLS

Los elementos de imagen no tienen width y height explícitos
Los elementos de imagen no tienen ningún atributo [alt] -Contraste
Los colores de fondo y de primer plano no tienen una relación de contraste adecuada.

Para saber si funciona el código

<div id=»pd1″ style=»font-size: 35px; text-align: center; color: #ffffff; font-weight: 900; line-height : 25px;»>
<del style=»font-size: 20px; font-weight: 200;»>$97,99usd</del><br> $49,99usd<br>
<font style=»font-size:12px; font-weight: 200;»>
<img src=»https://cdn.ipwhois.io/flags/us.svg» width=»17px» height=»12.75px» alt=»bandera»>
OFERTA DISPONIBLES HASTA HOY</font>
</div>
<script>
var precio = 97.99;
var descuento = 49.00;
var pd1 = document.querySelector(«#pd1»);
fetch(«https://ipwhois.app/json/»)
.then((response) => response.json())
.then((data) =>(pd1.innerHTML=’Descuento ‘+data.success));
</script>
///