GUÍA COMPLETA PARA FORMATEAR TEXTO EN STEEMIT

in #spanish4 years ago (edited)

thumb

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:

  1. COMO CONSEGUIR MÁS VOTOS - HAZ ESTO!
  2. CONVIERTE DÓLARES STEEM A STEEM Y STEEM POWER
  3. Steemit para principiantes (La mejor forma de comenzar ahora mismo)

Fuente de imagen

VOTA Y SÍGUEME SI TE GUSTA LO QUE HAGO. @epico

footer

Sort:  

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.

excelente explicación y super útil

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!

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.

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!

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

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.

Hola, no se si es el hecho de que es día de San Valentín o que me acabas de salvar la vida con este post, pero siento que te amoo. Muchisimas gracias por tu aporte ♥

Vaya, me alegra que te haya sido de ayuda.

Espero poder seguir compartiendo publicaciones que sean de utilidad.

Muy bueno!!, Gracias. Me ha sido de mucha ayuda:):)

Woow! Gracias por tu post se me es de mucha ayuda.

Muy buena guía. Super recomendada!

Muchas gracias por esto, información de gran importancia. :)

justo lo que estaba buscando pense que no habia nada para el justificado del texto, esta super el post me fue de gran ayuda :D

Interesante, me ayudo a realizar mi presentación, muchas gracias por tu aporte.

Muy buena explicación... graciasss !

Gracias por este post, me fue de gran utilidad

Excelente ayuda... Gracias!!!

Excelente aporte @epico

Muy buen post. Agradecido por los datos aportados

Muchas gracias por el aporte. Tu guía es bastante buena para lo básico y lo mejor de todo es que está en español. Me leeré la guia oficial para estar más enterado aún. Saludos! y te has ganando un nuevo seguidor

Gracias por tu post, me sirvió de mucha ayuda.

muy ilustrativo jejeje

HERMANO EXCELENTE PERO TENGO UN PROBLEMA DESPUES DEL ENCABEZADO NO ME DEJA DARLE ESPACIO ENTRE EL ENCABEZADO Y EL TEXTO SIGUIENTE PESE A QUE LE DOI AL BOTON DE ENTER, COMO HAGO


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.

Te amé. Muchas gracias por esto. Muy útil.
Aunque no he podido justificar el texto, el resto prefecto. :)

Muchas gracias, posts como este son los que valen la pena.

Tu post me ha ayudado mucho, justamente acabo de empezar hoy con Steemit y tenía estas preguntas en mi mente, mil gracias.

Gracias por esto, soy nueva aquí y esto me ha ayudado mucho.

Siempre abro este post para guiarme! Muy bueno!!! Gracias por el aporte! me gusta escribir un poco y estoy aprendiendo cosas nuevas por aqui, estoy iniciando asi que me ha servido de mucho! te sigo ! saludos!

Esto me ha venido GENIAL. Muchas gracias.

Gracias por tu publicación, la información fue de mucha utilidad, necesitaba algo de forma rápida y sencilla.

Your Post Has Been Featured on @Resteemable!
Feature any Steemit post using resteemit.com!
How It Works:
1. Take Any Steemit URL
2. Erase https://
3. Type re
Get Featured Instantly & Featured Posts are voted every 2.4hrs
Join the Curation Team Here | Vote Resteemable for Witness

excelente post gracias por compartirlo

¡Hola @epico! Quiero agradecerte por esta guía, me ayudó mucho al momento de redactar mi post introductorio... Todavía soy nueva, hace pocas horas publiqué, así que me mantendré interesada en tus guías por un rato.

Saludos desde Venezuela, ¡Dios Te Bendiga!

excelente post, me ayudará muchisimo ahora que estoy nuevo en esta plataforma. Muchas gracias, estoy seguro que nos servirá muchos a miles.

¡Gracias por compartir esa información! Estaba buscando un post que reuniera todas esas opciones.

Gracias, me alegra que te haya servido.

Excelente epico me gusto tu guía al fin aprendí a justificar los textos

Gracias de mucha ayuda amigo excelente fácil de entender.. me gustaria aprender hacer el pie de pagina animado

Muy bien hecho este post, muchísimas gracias por tu aporte.

Excelente, me ha ayudado mucho.

Excelente post, es todo lo que estaba buscando para poder empezar a publicar. Resumido y sencillo. ¡Muchísimas gracias!

Me ha sido de gran ayuda, muchas gracias!!! :)

genial! me ha sido de mucha ayuda!

Excelente contenido voy a recomendarte en mi próximo post amigo... Gracias!

Soy nueva en la plataforma y de verdad que ha ayudado muchisimooo tu post. GRACIAAAS!!

Excelente articulo, gracias por tu aporte

Muy bueno tu articulo, saludos coardiales soy nuevo...Te invito para que pases por mi blog

excelente explicacion, me sirvio de mucha ayuda.muchas gracias

Muchas gracias por la información! :)

Exelentee post.

Hola como hago para escribir en rojo u otros colores... Saludos

Buen articulo!

Muchas gracias por tiempo al escribir algo tan útil me sirvió bastante!

Buenisimo amigo...gracias por compartir esta información la pondré en practica..

¡Excelente mi hermano!

Me ha hecho de mucha ayuda, sinceramente gracias por compartir esa informacion con nosotros. Tienes mi voto.

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.

Gracias me sirvió de mucho

Gracias por tu aportación! Para los que empezamos en steemit esta mini guía es genial.