⇨ Cómo arreglar el desagradable efecto de scroll en los links de amazon

Tabla de contenidos

Al copiar y pegar un enlace de amazon (link + imagen) a veces aparece un efecto de scroll muy desagradable. Para arreglarlo hay que seguir estos 4 sencillos pasos:

Ve a tu artículo o página
Localiza el código de amazon, pulsa en el bloque y elige la vista HTML
Localiza la etiqueta <figure> y </figure> y elimínala.
Añade el código adicional
Guarda los cambios y publica.

Vista de los anuncios de amazon con un scroll que entorpece la navegabilidad en la web. Si quieres quitar scroll iframe sigue leyendo. — A esto es a lo que me refiero, es muy molesto.

Ve al artículo o página

Lo primero que hay que hacer es entrar a editar el artículo o página donde está el problema. Yo lo tengo en mi TSA/TSR todoenmodelismo. Al principio pensé que era un error del navegador, pero al verlo también en mi móvil y en otros teléfonos me di cuenta de que el problema estaría en el código HTML.

Localiza el código de amazon, pulsa en el bloque y elige la vista HTML

Entonces, una vez abierta la página o post, iremos directamente al código HTML, debería venir seleccionado por defecto, pero si no viene es tan fácil como darle al botón HTML.

Imagen del código HTML donde está el problema del scroll en los enlaces de amazon — Tendríais que verlo así

Localiza la etiqueta <figure> </figure> y elimínala

Aquí está el problema, has de editar el contenido del código HTML y eliminar el texto <figure> al principio y </figure> al final. Este texto no forma parte del anuncio, sino que lo mete wordpress de manera automática cuando pegas código sin haber seleccionado la vista HTML.

Vista del código del anuncio Amazon sin el scroll — Así debería quedar, con la etiqueta <iframe>

Añade el código extra

Hay que añadir un código adicional delante del atributo src. Este código es el que le dirá al navegador que no pinte el scroll y que el contenedor ha de tener un ancho y alto determinado.

style=»width:120px;height:240px;» marginwidth=»0″ marginheight=»0″ scrolling=»no» frameborder=»0″

Recuerda ponerlo delante del atributo src dentro de la etiqueta <iframe> para que quede como en la figura.

Código HTML de amazon sin scroll y con los atributos correspondientes — Así debería quedar, fíjate en que el nuevo código está delante del atributo src.

Guarda los cambios y publica

Ahora solo hay que pulsar el botón azul de Actualizar y ya estaría resuelto. No olvides actualizar la página con f5 o ctrl+R para ver los cambios.

Vista final del código del anuncio de amazon sin scroll — ¡El desagradable scroll ya no está!

La combinación más barata de hosting y dominio

¡Hola aprendices! Hacía tiempo que no posteaba pero no me he olvidado del blog, solo que ahora estoy ampliando mucho ...

Alojar varias web en un mismo hosting, ¿es posible? Tutorial 2022

Cuando uno empieza en el mundo del posicionamiento web, es normal que poco a poco vaya creando más proyectos. Todos ...