Con este widget, puedes añadir y editar textos dentro de tu proyecto. Para añadir un nuevo texto, usa el atajo T o haz clic en + (W) en la barra del widget y selecciona ‘Text’.

Haz clic una vez en el widget para abrir las opciones generales, los controles se mostrarán al lado derecho: con ellos podrás modificar la apariencia y presentación del texto. Puedes alinear, añadir animaciones, cambiar su posición, rotarlo o bloquearlo.

Al hacer doble clic en el widget, se abren los ajustes que permiten personalizar el propio texto: cambiar la tipografía y el color, añadir enlaces y símbolos especiales, sombras paralelas o dividir el texto en columnas.

Estilos

‘Styles’ facilita y agiliza la edición del texto. Para abrir la lista de estilos de Readymag, haz doble clic en el widget ‘Text’, selecciona ‘Typography’, aquí puedes utilizar uno de los estilos predefinidos, crear el tuyo propio o remover cualquiera al seleccionar ‘No style’. Para esto, haz clic en + en la parte inferior del panel, selecciona todas las propiedades y haz clic en ‘Save’. Para modificar un estilo, haz doble clic en su título o en los tres puntos que aparecen junto a él, y selecciona ‘Edit’.

Para fines de SEO, puedes aplicar etiquetas HTML, <h1>, <h2>, <h3> o <h4>, a cualquier estilo.  Si lo haces, el texto, en el código final, se envolverá con estas etiquetas. Por defecto, los estilos H1 y H2 se envuelven con <h1>...</h1> y <h2>...</h2>.

Para cambiar el orden de los estilos creados para tus textos en el widget, simplemente arrastra y suéltalos en el orden deseado. Esto funciona también para los estilos creados para hacer listas.

Para ver otros estilos, haz clic en los tres puntos de la parte inferior del panel y selecciona la vista deseada: ‘show all styles’ (todos los estilos), ‘only used once’ (los estilos usados una vez) o solo ‘unused’ (los estilos nunca usados). Aquí también puedes eliminar todos los estilos no utilizados a la vez.

Cuando añades un nuevo widget de texto, éste recuerda automáticamente el último estilo utilizado y lo aplica al nuevo fragmento de texto. Pero en algunos casos, la copia desde un editor de texto sofisticado puede arrastrar el formato del documento original. Para evitarlo, utiliza estos atajos:

En macOS:

• Cmd + C para copiar
• Cmd + Shift + V para pegar
  (Cmd + С/Cmd + Option + Shift + V en Safari)

En Windows:

• Ctrl + Shift + C para copiar
• Ctrl + Shift + V para pegar
  (Ctrl + С/Ctrl + Option + Shift + V en Safari)

 

Para copiar el estilo de otro widget, usa los accesos directos Cmd + Opt + C/V para macOS y Alt + Shift + Ctrl + C/V para Windows. Obtén más información sobre otros atajos útiles para trabajar con texto aquí.

Estilos Globales

Si creas un estilo global, aparecerá automáticamente en todos los proyectos de tu cuenta, tanto los existentes como los nuevos. Para hacerlo, cambia a la pestaña 'Global' en la configuración de estilo, haz clic en + y establece un estilo.

Los estilos de proyecto solo existen dentro del proyecto donde se crearon inicialmente.

Fuentes

Para agregar fuentes de Adobe Fonts (Typekit), Webtype, Google Fonts y type.today, haz clic en ‘Typography’ en los controles del widget, luego en el título de la fuente y selecciona ‘Library’.

Con los planes de pago, puedes cargar fuentes personalizadas en formato TTF, OTF, WOFF, o WOFF2 a tu biblioteca. Haz clic en ‘Upload’, escribe un nombre para la fuente, elige el peso de la misma, y carga el archivo.

Las fuentes personalizadas no se transfieren cuando un proyecto se transfiere a otra cuenta. El propietario de la cuenta de destino tendrá que volver a cargar las fuentes personalizadas para incluirlas en el proyecto transferido.

Además, puedes usar el Administrador de etiquetas de Google (Google Tag Manager) para agregar un código de seguimiento del proveedor de fuentes. Esta característica está disponible solo para proyectos con un nombre de dominio personalizado.

Si utilizas muchas fuentes, la opción de filtrado puede resultarte útil. Para acceder a esta opción, haz clic en los tres puntos de la esquina superior derecha del panel de fuentes. Aquí puedes eliminar todas las fuentes no utilizadas de una vez o seleccionar qué fuentes mostrar en los atributos de tu widget de texto: todas las fuentes añadidas, solo las utilizadas o solo las no utilizadas

Alineación

Haz clic en ‘Align’ para colocar el texto dentro del widget. Además de cuatro alineaciones básicas (a la izquierda, a la derecha, justificadas y centradas), también puedes seleccionar una orientación de derecha a izquierda (RTL) para el texto en la sección ‘Writing’.

Hay dos opciones de cambio de tamaño:

• Auto-height: la altura cambia automáticamente de acuerdo con la longitud del texto.
• Fixed size: establece un ancho y altura fijos para tu widget y usa flechas para seleccionar si el texto debe mostrarse en la parte superior o al fondo.

Tipografía avanzada

Haz doble clic en el widget para acceder a la configuración avanzada de tipografía, esta sección ofrece diferentes opciones para ayudar a afinar el texto.

Transform

Permite transformar todo el texto en mayúsculas o minúsculas, poner en mayúscula las primeras letras de cada oración o cambiar las fuentes a negrita o cursiva con solo un clic.

Decoration

Aplica sobre lineado, subrayado o tachado al texto.

Features

Convierte texto en subíndice o superíndice, crea fracciones, agrega versalitas, ligaduras o conjuntos estilísticos.

List

Habilita esta opción para convertir texto en una lista ordenada o desordenada. 

Los estilos de lista funcionan de la misma manera que los estilos de texto; puedes hacerlos globales y reorganizarlos arrastrando y soltando. Por defecto, todas las listas heredan el último estilo de texto utilizado. También puedes personalizar y crear tus propios estilos de lista. Para esto, haz clic en ‘Same as text’ en los atributos de la lista (Advanced Typography) y haz clic en +. La configuración de un nuevo estilo se abrirá automáticamente. Aquí puedes seleccionar la configuración de la tipografía y establecer el ancho de la columna de la lista.

La opción ‘Align’ define la posición de las líneas en un elemento de la lista. Cuando está activada, todas las líneas se alinearán con la primera línea. Cuando no está activada, las líneas (excepto la primera) se alinearán con las viñetas de la lista.

Para sustituir las viñetas por otros símbolos, haz clic en ‘Marker’ en la configuración del estilo de la lista y selecciona el glifo preferido. Esto mostrará los símbolos que hayas elegido.

Para alterar la posición de las viñetas (o glifos) y los márgenes del texto, cambia los parámetros de línea de base.

Outline

Agrega un contorno al texto; puedes especificar el ancho y el color.

Box color

Selecciona un color de fondo para el widget de texto y permite configurar su opacidad.

Selection color

Establece un color de visualización para cuando se selecciona texto en el proyecto publicado.

Espacio de no separación y guiones opcionales

Añadir un espacio de no separación (#nbsp;) evita que las líneas se rompan, es normalmente utilizado para mejorar la legibilidad. Para añadirlo a tu texto, utiliza estos atajos:

• En macOS: Alt + Espacio;
• En Windows: Ctrl + Shift + Espacio.

 

Por otro lado, un guion opcional (&shy;) crea una ruptura obligatoria dentro de una palabra o línea. Para ponerlo, utiliza el atajo Shift + Enter en macOS y Windows.

Enlaces

Puedes añadir enlaces en una o varias palabras usando el widget de texto o convertir el widget completo en un enlace.

Para hacerlo, selecciona el texto con el cursor y haz clic en el ícono de link en el menú de la derecha. 

Para configurar el estilo actual (Current Style), abre el panel de enlaces (Link panel), selecciona Edit Style del menú desplegable, y haz clic en la pestaña Actual (Current Tab).

Elige uno de los tipos de links predeterminados:

• Website URL. Enlace a un sitio web externo.
• Jump to Page. Enlace a cualquier página dentro del proyecto. Escribe el número de página o el enlace personalizado de la página. Estos enlaces se actualizan automáticamente cuando se reorganizan las páginas del proyecto.
• Email. Estándar del esquema URI ‘mail to’ que crea un nuevo email a una dirección electrónica específica.
• Phone Number. El esquema URI ‘Tel’ que llama desde un teléfono móvil. El número permite hasta quince dígitos sin espacios, guiones ni separadores: +[código de país][código nacional de destino (área)][número de abonado], según las recomendaciones E.164.
• Anchor. Enlace a cualquier posición de la misma página. Haz clic en cualquier lugar para establecer el ancla (anchor), o escribe la altura en píxeles, por ejemplo, 748 px. El área de anclaje no puede ser colocada en una página diferente.
• Scroll to Top. Dirige al visitante a la parte superior de la página.
• Go Back. Dirige a la página anterior del proyecto.

Haz clic en el ícono de la flecha para activar la configuración del enlace.

Después, verás el selector de abrir en otra pestaña (Open in tab) y la opción de elegir el estilo de Enlace entre los que ya existen en tu proyecto o cuenta (Estilos globales). También puedes crear un nuevo estilo haciendo clic en el icono +.