Cómo crear un botón de descarga: 11 pasos (con imágenes)

Tabla de contenido:

Cómo crear un botón de descarga: 11 pasos (con imágenes)
Cómo crear un botón de descarga: 11 pasos (con imágenes)

Video: Cómo crear un botón de descarga: 11 pasos (con imágenes)

Video: Cómo crear un botón de descarga: 11 pasos (con imágenes)
Video: Cómo Agregar un Contacto a mi Correo de Gmail - Fácilmente 2024, Mayo
Anonim

Un botón de descarga puede hacer que su sitio web se vea mucho más profesional que simplemente ofrecer su descarga a través de enlaces. Un botón proporciona una interfaz más limpia y, si desea diseñar el suyo propio, sus botones pueden ser parte integral del diseño de su página. Siga esta guía para crear botones HTML o hacer un botón con su propio diseño.

Pasos

Método 1 de 2: creación de un botón HTML

Crear un botón de descarga Paso 1
Crear un botón de descarga Paso 1

Paso 1. Cree el botón en un editor de código

Un editor de texto simple como Notepad o TextEdit funcionará perfectamente. Ingrese el siguiente código en el editor:

Crear un botón de descarga Paso 2
Crear un botón de descarga Paso 2

Paso 2. Sube el archivo a tu servidor

Si desea ofrecer un archivo para descargar, deberá alojarlo en su propio servidor o apuntar el botón al archivo en otro lugar de la web. Utilice un cliente FTP para cargar el archivo que desea que esté disponible en el servidor de su sitio web.

Crear un botón de descarga Paso 3
Crear un botón de descarga Paso 3

Paso 3. Asegúrese de tener el permiso del webmaster si desea vincular a un archivo que no está alojando usted mismo

Crear un botón de descarga Paso 4
Crear un botón de descarga Paso 4

Paso 4. Reemplace "Ubicación de descarga" con la URL de la descarga. Asegúrese de incluir las comillas simples alrededor de la dirección, así como las comillas dobles alrededor de "window.location = 'Download Location'". Incluya cualquier prefijo como HTTP: // o FTP: // y también incluya la extensión del archivo como como-j.webp" />

Crear un botón de descarga Paso 5
Crear un botón de descarga Paso 5

Paso 5. Etiquete el botón

Reemplace "Texto del botón" con las palabras que desea que aparezcan en el botón. Asegúrese de mantener las comillas dobles alrededor del texto. Mantenga el texto del botón pequeño para que el botón no parezca grande y difícil de manejar en la página.

Crear un botón de descarga Paso 6
Crear un botón de descarga Paso 6

Paso 6. Coloque el código en su página

Puede insertar el código del botón en cualquier lugar del cuerpo de su página web y el botón aparecerá en esa ubicación. Sube tu código de página web modificado y prueba tu nuevo botón.

Método 2 de 2: creación de un botón de imagen

Crear un botón de descarga Paso 7
Crear un botón de descarga Paso 7

Paso 1. Diseña tu botón de descarga

Utilice su editor de imágenes preferido y cree un botón que coincida con el estilo de su sitio web. Puede hacer que el botón sea tan pequeño o tan grande como desee.

Crear un botón de descarga Paso 8
Crear un botón de descarga Paso 8

Paso 2. Sube el archivo a tu servidor y la imagen del botón

Si desea ofrecer un archivo para descargar, deberá alojarlo en su propio servidor o apuntar el botón al archivo en otro lugar de la web. Utilice un cliente FTP para cargar el archivo que desea que esté disponible en el servidor de su sitio web.

Sube la imagen del botón a la misma ubicación en el servidor que la página en la que lo estás colocando

Crear un botón de descarga Paso 9
Crear un botón de descarga Paso 9

Paso 3. Crea tu código de descarga

Un botón de descarga representado por una imagen funciona de la misma manera que todos los demás enlaces funcionan en HTML. Copie el siguiente código en su editor preferido:

Crear un botón de descarga Paso 10
Crear un botón de descarga Paso 10

Paso 4. Ingrese la información de su archivo e imagen. Reemplace "Ubicación de descarga" con la URL completa de su descarga, incluidos los prefijos HTTP: // o FTP: //. Reemplace "Archivo de imagen" con el nombre de archivo de la imagen del botón de descarga. Si el archivo está en la misma ubicación que la página de su servidor, no es necesario que incluya la dirección completa.

  • Reemplace "Texto flotante" con cualquier texto que desee que aparezca cuando el usuario pase el cursor sobre la imagen.
  • Reemplace "X" e "Y" con el ancho y alto de la imagen, respectivamente, en píxeles.
  • Asegúrese de mantener las comillas dobles alrededor de cada entrada.
Crear un botón de descarga Paso 11
Crear un botón de descarga Paso 11

Paso 5. Ingrese el código en su página

Coloque el código donde desea que aparezca su botón. Cargue el nuevo código y luego cargue la página web para asegurarse de que el botón funcione. Compruebe que se cargue el texto flotante y que la imagen tenga el tamaño correcto.

Video: al utilizar este servicio, es posible que cierta información se comparta con YouTube

Advertencias

  • Cargar archivos en su propio servidor es una mejor manera de compartir archivos en línea en lugar de depender de otros sitios web para alojar los archivos. Si copia la ubicación de un enlace de otro sitio web, el botón de descarga que cree solo funcionará mientras la ubicación del enlace esté activa.
  • Nunca cargue archivos que infrinjan las leyes de derechos de autor, ya que podría dar lugar a fuertes multas o encarcelamiento.
  • Pruebe periódicamente su botón de descarga o el enlace de descarga en el sitio web del que obtuvo la ubicación del enlace para asegurarse de que los usuarios puedan descargar el archivo cuando hagan clic en el botón en lugar de ir a un enlace roto donde el archivo ya no existe.

Recomendado: