LA GUÍA COMPLETA DE FORMATO DE TEXTO EN TUS ARTÍCULOS DE STEEMIT
Hola, qué tal mi gente épica. Bienvenidos a mi blog en Steemit.
Últimamente he estado recibiendo peticiones de muchos de ustedes pidiendo más informació sobre como dar formato al texto de sus artículos aquí en Steemit. El día de hoy tal y cómo el título lo indica estaré compartiendo como dar formato a tus escritos ya que no siempre el "texto alineado a la izquierda" es la mejor opción.
A mí en particular me gusta hacer mis publicaciones con el texto "justificado" (así con todas las palabras alineadas al principio y al final de cada línea). Justo como esta entrada que estás leyendo el día de hoy.
DIFERENTES ESTILOS DE FORMATO
En la web existen diferentes tipos de estilos para dar formato al texto de tus publicaciones pero el día de hoy nos dedicaremos a hablar de cómo hacerlo exclusivamente aquí en Steemit debido a que no es realmente muy intuitivo el proceso cuando estamos creando nuestro post.
Aquí podemos utilizar MARK DOWN el cual es una simplificación de las etiquetas HTML y podemos utilzar html también. Solo tenemos que tener un poco de conocimiento de cómo utilizarlos y cuándo es conveniente usar uno u otro y cómo combinarlos.
El Mark-down
Es el tipo de formato utilizado por el editor de Steemit. Cuándo haces click en "Submit a Story" (Crear nueva entrada) este es el tipo de estilo que estaremos utilizando por defecto. Es simple, rápido de aplicar y sencillo de aprender.
Debajo de la casilla dónde se colocan las etiquetas (tags), debajo de dónde se elige como recibir los rewards 50%/50% hay un enlace que dice Markdown Styling Guide, (en inglés) puedes hacer click en este enlace para más información acerca del Markdown. Hoy voy a estar explicando las funciones principales del Markdown y como utilizarlas en nuestras publicaciones.
HTML
El html es el lenguaje oficial y universal del internet, y todos los navegadores entienden este lenguage de formato de páginas web. Aunque en los ultimos años el formato se hace en CSS cascading style sheets (hojas de estilo anidadas o en cascada). Las bases de toda página web se hacen en HTML o un derivado como XML, XHTML pero en fin, no nos pongamos tan técnicos. Basta con entender que incluso Steemit.com está basado en HTML así que es fácil deducir que podemos utilizar esto a nuestro favor.
LO MÁS ÚTIL DEL MARKDOWN
CABECERAS
Para escribir títulos y subtítulos para tus artículos solo tienes que utilizar el signo de # al principio de la línea, dejar un espacio y luego escribir el texto y obtendrás diferentes tamaños dependiendo de cuantos signos utilices al principio de esa línea.
CÓDIGO:
# Cabecera H1
## Cabecera H2
### Cabecera H3
#### Cabecera H4
RESULTADO:
Cabecera H1
Cabecera H2
Cabecera H3
Cabecera H4
NEGRITAS, CURSIVAS & TACHADAS
En el cuerpo de nuestros párrafos vamos a necesitar enfatizar en algunos enunciados y para eso tenemos los símbolos de **, __ y ~~ (estrellas o asteriscos, guion bajo [underscore] y virgulilla [o no sé como se llame ese símbolo por sí solo pero es este ~]).
NEGRITAS: Para escribir en negritas solo tenemos que utilizar los asteriscos dobles o guion-bajo doble de la siguiente manera:
CÓDIGO:
**Texto de ejemplo en negritas con asteriscos dobles**
__Texto de ejemplo en negritas con guion-bajo doble__
RESULTADO:
Texto de ejemplo en negritas con asteriscos dobles
Texto de ejemplo en negritas con guion-bajo doble
CURSIVAS: Para escribir en cursiva es igual pero con asteriscos sencillos o guion-bajo sencillo.
CÓDIGO:
*Texto de ejemplo en cursivas con asteriscos sencillo*
_Texto de ejemplo en cursivas con guion-bajo sencillo_
RESULTADO:
Texto de ejemplo en cursivas con asteriscos sencillo
Texto de ejemplo en cursivas con guion-bajo sencillo
TACHADO: Para tachar tu texto utilizas el signo de ~~ de la siguiente forma
CÓDIGO:
~~Texto de ejemplo en cursivas con asteriscos sencillo~~
RESULTADO:
Texto de ejemplo en cursivas con asteriscos sencillo
NEGRITAS Y CURSIVAS:
Para combinar negritas y cursivas utilizas asteriscos dobles y guion-bajo sencillo así:
**_Texto de ejemplo cursivas y a la vez negritas_**
Resultado:
Texto de ejemplo cursivas y a la vez negritas
LISTAS
Para hacer un listado solo necesitas usar el asterisco, el signo de má o el signo de menos para comenzar la linea.
* Lista 1
* Lista 2
* Lista 3
+ Lista 4
- Lista 5
Resultado:
- Lista 1
- Llista 2
- Lista 3
- Lista 4
- Lista 5
CITAR TEXTO
Para citar texto utilizas el signo de > (Mayor que ) al principio de la linea.
> Este es un texto citado.
Resultado
Este es un texto citado.
COSAS QUE SOLO SE PUEDEN HACER CON HTML
Como este post ya está un poco largo no voy a detallar como hacer todo lo anterior con HTML ya que Markdown y html se pueden combinar. Así que solo estaré detallando como centralizar y justificar el texto utilizando las etiquetas HTML que nos ayudarán a hacer esto posible.
CENTRALIZAR TEXTO
Para centralizar nuestro texto lo vamos a encerrar en medio de las etiquetas <center> y aquí el texto que quieres centralizar </center> de la manera siguiente:
<center> Este es un ejemplo de texto centralizado donde todo lo que escribamos en medio de estas etiquetas se muestra en el centro de la pantalla como los versos de los poemas.</center>
Resultado
Este es un ejemplo de texto centralizado donde todo lo que escribamos en medio de estas etiquetas se muestra en el centro de la pantalla como los versos de los poemas.
JUSTIFICAR EL TEXTO
Para justificar nuestro texto a ambos lados del párrafo lo vamos a encerrar en medio de las etiquetas <div class="text-justify"> y aquí el texto que quieres justificar. </div> de la manera siguiente:
<div class="text-justify"> Este es un ejemplo de texto justificado donde todo lo que escribamos en medio de estas etiquetas se muestra ajustado a los bordes del parrafo como en los libros que leemos en obras literarias. </div>
Resultado:
Este es un ejemplo de texto justificado donde todo lo que escribamos en medio de estas etiquetas se muestra ajustado a los bordes del parrafo como en los libros que leemos en obras literarias.
SUFICIENTE POR HOY
Por el día de hoy ya es suficiente. El post resultó más largo de lo que había anticipado así que hemos llegado al final de este artículo por el día de hoy. (Sí, me gusta redundar las redundancias redundadas. ja ja ja).
En próximos posts enesñaré a alinear las imágenes y a hacer pies de página animados como el mío.
Otros post de interés:
- COMO CONSEGUIR MÁS VOTOS - HAZ ESTO!
- CONVIERTE DÓLARES STEEM A STEEM Y STEEM POWER
- Steemit para principiantes (La mejor forma de comenzar ahora mismo)
VOTA Y SÍGUEME SI TE GUSTA LO QUE HAGO. @epico
muchas gracias por tus enseñanzas
Gracias Épico. maravilloso aporte, agradecido.
👍 👍 👍
Muchas Graciasss por tu aporte, justo lo que andaba buscando
Excelente trabajo. Gracias por compartir lo.
Hello please kindly like my post too thanks
https://steemit.com/advice/@romantic4/being-clear-about-what-you-want
No se como haces azules esos textos, pero al parecer son anchors, lo malo es que aparentan estar rotos, y bueno da que decir en un aticulo que te explica exactamente eso.
Jajaja Necesitaba el link de la publicacion para poner los Anchors a funcionar. Y tenia que publicarlo primero. Ahora los estoy poniendo. Pero gracias.
Gracias por la observación. Los anchors no funcionan dentro de los post de Steemit. (aparentemente)
Pero no la guía no incluía como hacer anchors.
Ya lo corregí gracias a tu rápida notificación.
Una gran ayuda para nosotros los nuevos en steemit, y quiero agradecerte por tomarte este tiempo para orientarnos de una manera sencilla y clara hoy la aplicare¡¡
Gracias. Me alegra que te haya bustado.
Vale la pena! ver este tipo de contenido para los nuevos
¡Gracias por compartir esa información! Estaba buscando un post que reuniera todas esas opciones.
Gracias, me alegra que te haya servido.
Muy bien explicado tu articulo, antes hacia todo en html pero con esos trucos es mas rápido. muchas gracias
Sí. Yo también usaba html pero el markdown facilita muchas cosas.
Amigo buenas..! Te saludo, en espera que estés bien. Sabes!!! Una usuaria en uno de mis artículos me pregunta como hago yo para que mis publicaciones queden ordenaditas en cuanto al formato, porque ella quiere hacerlo igual, y comenta además que no encuentra material para guiarse. Será que me permutes que le haga llegar este material tuyo. Saludos, gracias y éxitos...
Claro puedes compartirlo como desees. Disculpa la tardanza para responder.
¡Gracias amigo!
excelente post, no tienes idea de lo mucho que me ayudo, por fin puedo justificar!! gracias(:
De nada. Los textos justificados son más agradables a la vista, en mi opinión.
Muchas gracias por la info, buen material :D.
Excelente informacion, de muchisima utilidad. Una pregunta, como haces para colocar negritas en medio de un texto justificado? Yo no he podido hacerlo, cuando lo justifico no me reconoce ningun comando para poner negritas.
Es que justificamos usando HTML es dificil usar MarkUp junto con html.
Solución
Utiliza el siguiente código html:
<b> Texto que quieres en negrita. </b>El resultado será:
Texto que quieres en negrita.
Disculpa por tardar tanto para responderte @laflacasings
Hola, soy nuevo. Esta muy bueno tu contenido y facil de entender. Agarrare mucho de aca para mis post. Muchas gracias!
Me alegra que te haya servido.
Muy bueno!!! Graciass!!!
No hay de que.
Hola Amigo, excelente publicación, nos fue de gran utilidad para iniciarnos en ésta comunidad... Mil gracias!
Me alegra que te haya sido de ayuda.
Gran ayuda amigo!
Gracias por el comentario.
Gracias por este post!
De nada.
Gracias por esta información, me ahorro mucho trabajo jeje
No hay de qué.
Muy bueno el post, gracias por gran apoyo😚
excelente post !!
solo tengo una duda a la hora de justificar porque yo copio y pega tal cual los comando y aun así no justificar el texto :c ayuda
No puedes usar Mark down dentro de los Divs
El formato que quieras dar dentro del texto debes darlo con html
Muy útil y sencillo este post!
Me Alegra que te haya gustado.
Buenisimo
Quisiera hacer una consulta, ¿por qué cuando intento poner en cursiva una frase que está dentro de un texto, no me permite hacerlo y por ende solo aparecen los caracteres de asterisco? Ejemplo: Hola, mi nombre es y tengo tal edad.
¡Tengo la misma duda! :(
Gracias gracias. Excelente ayuda. Justo lo que estaba buscando
Excelente, gracias por compartir la información. Es de gran ayuda para los que estamos iniciando. Si me permites hacerte una consulta: ¿cómo colocas una lista o palabras en negrita dentro de un texto que has justificado?
guah!!! que buen Material @epico lo estab buscando porque me faltaban algunos comandos de MarkDown, muchas gracias por publicarlo
saludo y éxito
Buenísimo bro! (Y)
Hey amigo, muchas gracias por tu post, de verdad que me fue bastante útil, ya que necesitaba que mis textos estuvieran justificados, me gusta ser ordenado y no encontraba la manera de como lograrlo, pero gracias por su post que me ayudó mucho. Un saludo!
Me ayudó bastante en el primer post que he publicado. Lo que no encontré fue como colocar el video dentro del artículo.
Gracias por tu ayuda.
Excelente Post!
Bro, esta publicaciòn me resolvió el día jajaja Éxitos!
muchas gracias por la información. Para los nuevos como yo es difícil darle formato a los port. Un saludo.
EXCELENTE POST!! Justo lo que estaba buscando, de verdad esto me ha ayudado muchisimo!! Un saludo enorme para ti!.
Como sé usar bastante bien el HTML al principio me pareció muy raro que no todo funcionara o que había que aprender nuevos códigos. No es tanto así y esto lo deja muy fácil. Quedo pendiente porque no he podido insertar iframe y cuando inserto un tweet no se ven las fotos.
Graciaaasss! Tus post me ayudo mucho a estilizar un poco mejor mi primer post!
Excelente ayuda!! Gracias!!
muchas gracias amigo es de gran ayuda tu informacion
Gracias por compartir esta información. Me ha sido de gran ayuda tu post. Saludos
Gracias por tomarte el tiempo de hacer esto!! Nos ayudas todos
Un post súper útil ¡Muchas gracias @epico!
grande compañero allí te va mi voto!!! sigue así
Saludos. Buen articulo y sobretodo muy util
Excelente post, podrías explicar como modificar un texto que ha sido justificado con HTML
Gracias por compartirlo, me sirvio de mucha ayuda.. Saludos!
Excelente post, muchas gracias!
Me has ayudado mucho, mucho, amigo! Estas en mi navegador como favorito para los siguientes!! :)
Es divertido esto del markdown y del HTML. Ahora quiero saber más...
Saludos!
hermano, me ha gustado mucho. Te he votado, te voy a seguir y seguiré viendo tus posts a seguir colectando info que ayude a mejorar la calidad de mis posts, por lo tanto presentar un producto de mayor calidad. Gracias!
Muchas gracias por tu excelente artículo, es de gran ayuda para los que estamos iniciando.