En este artículo te guiamos en la creación de un botón a través del HTML para tu página de reservas, de modo que puedas agregarlo a tu firma de Outlook o Gmail. En el primer paso crearemos el botón y le añadiremos la URL de la página de reservas y en el segundo paso lo añadiremos a tu firma de Outlook o Gmail. Te recomendamos pedir ayuda a tu departamento de TI para configurar esto.
*Nota: En este artículo, John Doe en la contabilidad XYZ es una persona y empresa ficticias creadas como ejemplo. Cualquier parecido con la realidad es pura coincidencia.
En este artículo encontrarás información sobre los siguientes argumentos:
- Crear el botón
- Añadirlo a tu firma de correo electrónico
- Outlook (¡a través del navegador!)
- Gmail
1. Crear el botón
- Copia el enlace de tu página de reservas en la página de tipos de citas.
Esto podría ser una página de reservas del equipo, una página de reservas personal o un enlace de tipo de cita. -
Pégalo en el siguiente código:
<a href="ENLACE DE LA PÁGINA DE RESERVAS" style="background-color:#FFFFFF; color:#FFFFFF; padding:10px 20px; text-decoration:none; border-radius:5px; display:inline-block; font-family:sans-serif;" target="_blank"> Texto del Botón </a>
-
Cambia el color de fondo del botón al código Hex que prefieras. ej. Negro: #000000
<a href="ENLACE DE LA PÁGINA DE RESERVAS" style="background-color:#000000; color:#FFFFFF; padding:10px 20px; text-decoration:none; border-radius:5px; display:inline-block; font-family:sans-serif;" target="_blank"> Texto del Botón </a>
-
Cambia el color del texto del botón al código hex que prefieras. ej. blanco: #FFFFFF
<a href="ENLACE DE LA PÁGINA DE RESERVAS" style="background-color:#000000; color:#FFFFFF; padding:10px 20px; text-decoration:none; border-radius:5px; display:inline-block; font-family:sans-serif;" target="_blank"> Texto del Botón </a>
-
Añade el texto del botón. Ej. Reservar una reunión
<a href="ENLACE DE LA PÁGINA DE RESERVAS" style="background-color:#000000; color:#FFFFFF; padding:10px 20px; text-decoration:none; border-radius:5px; display:inline-block; font-family:sans-serif;" target="_blank"> Reservar una reunión </a>
Así que un ejemplo de un botón podría ser:
<a href="https://meeting.teamleader.eu/book/my-team-name/u/username/t/meetingtype" style="background-color:#000000; color:#FFFFFF; padding:10px 20px; text-decoration:none; border-radius:5px; display:inline-block; font-family:sans-serif;" target="_blank"> Reservar una reunión </a>
Que se vería como:
2. Añadirlo a tu firma de correo electrónico
Una vez que se crea el botón, puedes añadirlo a la firma de correo electrónico. Te recomendamos que dejes que tu departamento de TI te ayude, pero en caso de que quieras hacerlo tú mismo, te indicamos los pasos a seguir a continuación.
- Outlook (¡a través del navegador!)
- Gmail
Outlook (¡a través del navegador!)
- Abre Outlook en tu navegador y inicia sesión.
- Ve a https://outlook.live.com/mail/0/options/accounts-category/signatures-subcategory o a través del icono de engranaje ==> Cuenta ==> Firmas
- En la ubicación donde deseas añadir el botón, escribe aaa:
- Haz clic derecho fuera(!) del cuadro de firma y selecciona Inspeccionar. Las herramientas de desarrollo se abrirán ahora en tu navegador.
- En las herramientas de desarrollo, haz clic en el icono de la parte superior izquierda (flecha apuntando dentro de una pantalla>
- Haz clic en el campo de firma donde has escrito aaa. Esto debería ser visible ahora en el código de las herramientas de desarrollo. Si no ves 'aaa', haz clic en la flecha junto al código y debería hacerse visible:
- Haz clic en la derecha en la parte del código en azul y selecciona Editar como HTML.
- Haz doble clic en aaa, elimina el texto y pega el código de tu botón:
- Haz clic en algún lugar junto a ese código en las herramientas de desarrollo y entonces deberías ver el botón aparecer en tu campo de firma.
- Haz clic en Guardar y envíate un correo de prueba. En el correo que has enviado, verifica que el botón te redirige a tu página de reservas al hacer clic en él.
*Nota: si la información anterior no es clara, te recomendamos que eches un vistazo a este video de Youtube. El propietario del video no está relacionado de ninguna manera con Teamleader Focus, pero la información es útil.
Gmail
- Abre Gmail en tu navegador y inicia sesión.
- Haz clic en el icono de engranaje ==> Ver toda la configuración ==> General ==> Firma (tendrás que desplazarte hacia abajo).
- En la ubicación donde deseas añadir el botón, escribe aaa:
- Haz clic derecho fuera(!) del cuadro de firma y selecciona Inspeccionar. Las herramientas de desarrollo se abrirán ahora en tu navegador.
- En las herramientas de desarrollo, haz clic en el icono de la parte superior izquierda (flecha apuntando dentro de una pantalla).
- Haz clic en el campo de firma donde has escrito aaa. Esto debería ser visible ahora en el código de las herramientas de desarrollo. Si no ves 'aaa', haz clic en la flecha junto al código y debería hacerse visible.
- Haz clic en la derecha en la parte del código en azul y selecciona Editar como HTML.
- Haz doble clic en aaa, elimina el texto y pega el código de tu botón.
- Haz clic en algún lugar junto a ese código en las herramientas de desarrollo y entonces deberías ver el botón aparecer en tu campo de firma.
- Haz clic en Guardar y envíate un correo de prueba. En el correo que has enviado, verifica que el botón te redirige a tu página de reservas al hacer clic en él.
*Nota: si la información anterior no es clara, te recomendamos que eches un vistazo a este video de Youtube. El video está en Outlook pero las acciones son las mismas en Gmail. El propietario del video no está relacionado de ninguna manera con Teamleader Focus, pero la información es útil.