Cómo utilizar MarkDown Parte 2
Foto por 3mikey5000 Fuente
Hola que tal Steemianos, hoy les dejare la Parte 2 de la guía de cómo utilizar Markdown, estos nuevos comandos los podrán ir aplicando en sus post, para hacerlos más atractivos visualmente.
Antes de Empezar
- Si aun no revisan la primera parte de cómo utilizar markdown, les dejare el siguiente link para que r]evisen el post. Cómo utilizar Markdown
¡Empecemos!
Para que explicar nuevamente que es MarkDown y HTML, si hemos visto eso en el capítulo anterior de esta guía, por lo tanto, pasaremos a explicar qué etiquetas utilizaremos y aprenderemos hoy, las siguientes etiquetas nombradas serán las que aprenderemos:
- Cómo colocar un texto en lado derecho o izquierda y una Imagen.
- Como hacer una pequeña galeria de imagenes.
Etiqueta Texto al lado de Imagen
Esta etiqueta funciona complementando Etiquetas de Markdown y HTML, les enseñare la etiqueta de la forma más práctica posible para que puedan aplicar a futuros post de ustedes. Adicionalmente agregaremos la fuente sobre la imagen insertada al lado del texto, para atribuir créditos al autor de dicha imagen, sin importar el tipo de fuente de donde venga. Ya que estamos generando ingresos y una mínima gota de agradecimiento al autor vale. Esta etiqueta funciona de la siguiente manera:
Primer Paso
- Les mostrare la etiqueta por parte y como la iremos complementando entre cada una, Lo primero es que tendremos una etiqueta compuesta por
<div class="pull-left">< img src="image"></div>Algo larga, pero sencilla de entender. En la Parte donde dice"Pull-Left"es la orden que se le entrega a la imagen agregada. Esta función puede ser o"Pull-Left"o"Pull-Right", Por ende ustedes serán los que indicarán la orden a la imagen.
Segundo Paso
La siguiente parte de esta etiqueta
<div class="pull-left">
< img src="image"></div>es,src="image"En la parte donde dice"image", agregaran el link de la imagen para así insertarla en el. Este link de imagen debe ser copiado directamente de la dirección. Si no copian el link de forma directa, no saldrá la imagen.Un link completo es asi;
https://pixabay.com/es/le%C3%B3n-africano-melena-cerrar-los-ojos-2888519/Un link directo de Imagen es asi:
https://cdn.pixabay.com/photo/2017/10/25/16/54/african-lion-2888519_960_720.jpg
El detalle se notara en cómo termina qué es el tipo de formato de la imagen en este caso es JPG, también puedes encontrar las siglas del final como formato PNG.
Tercer Paso
- El texto agregado a los lados, deberá ir en la parte de abajo de la etiqueta y automaticamente se vera en la parte derecha o izquierda de ella.
- Bueno, ya sabes como utilizar los 2 comandos de la etiqueta, por ende mostrare los ejemplo con códigos:
Codigo
<div class="pull-left"><img src="https://cdn.pixabay.com/photo/2017/10/25/16/54/african-lion-2888519_960_720.jpg"></div>Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,Esto es un ejemplo,
Resultado
Agregar Etiqueta de Autor
- Para agregar la etiqueta de autor a la imagen y poder atribuirle un agradecimiento con su link insertado, debemos agregar la siguiente etiqueta en la parte superior de la escrita anteriormente.
<sub>Autor IanZA [Fuente](https://pixabay.com/es/le%C3%B3n-africano-melena-cerrar-los-ojos-2888519/)</sub>Esta etiqueta contiene el link de fuente de la imagen y el nombre del autor, si ustedes lo desean escribir. En el siguiente ejemplo les mostrare como ira escrito el codigo complementado con la imagen a la izquierda y el autor.
Codigo
<sub>Autor IanZA [Fuente](https://pixabay.com/es/le%C3%B3n-africano-melena-cerrar-los-ojos-2888519/)</sub><div class="pull-left"><img src="https://cdn.pixabay.com/photo/2017/10/25/16/54/african-lion-2888519_960_720.jpg"></div>Resultado
Autor IanZA Fuente
- Como pueden ver de esta manera, tenemos un párrafo agregado de una imagen y adicional a eso agregamos la etiqueta de atribución al autor de dicha imagen.
Como Crear una Galeria de imagenes
Una galería de imágenes, es una tabla e la cual pueden ir incorporando imágenes, para que el seguidor de ustedes o visita pública, revise cada imagen subida por ustedes de manera más ordenada o por secuencia.
- La etiqueta de galería de imágenes, funciona de la siguiente manera:
Codigo
|||||---|---|---||Link imagen|link imagen|link imagen|- Como pueden en donde dice Link imagen deberán agregar el link de cada imagen, para así poder utilizarla en la galería. En el siguiente ejemplo les mostrare como hacerlo:
Codigo
|||||---|---|---||https://i.imgur.com/L2rfgIG.png|https://i.imgur.com/L2rfgIG.png|https://i.imgur.com/L2rfgIG.png|Resultado
 | | |
Agregar información y titulo a cada imagen
Para agregar un titulo a cada imagen deberán escribir, donde dice titulo en el código del siguiente ejemplo, el que ustedes deseen.
Para que podamos agregar información a cada imagen debemos agregar, una siguiente pestaña de la misma manera que imágenes, como el siguiente ejemplo;
Codigo
|titulo|titulo|titulo||---|---|---||Link imagen|link imagen|link imagen||Informacion|Informacion|Informacion|En la parte donde dice "titulo" deberan agregar el respectivo título de la imagen.
En la parte donde sale "informacion" podran agregar lo que ustedes quieran a la imagen.
Código completo
|titutlo|titulo|titulo||---|---|---||https://i.imgur.com/L2rfgIG.png|https://i.imgur.com/L2rfgIG.png|https://i.imgur.com/L2rfgIG.png||informacion|Informacion|Informacion|Resultado
| makemoneynow | makemoneynow | makemoneynow |
|---|---|---|
| | |
| Aca podran agregar la información que deseen | Aca podran agregar la información que deseen | Aca podran agregar la información que deseen |
A la galería le podras agregar mas cantidad de imagenes, solo agregando mas casillas de
||Por lo tanto queda a su imaginación seguir agregando de ellas.
Espero que les alla servido de gran ayuda, las siguientes etiquetas, que podrán utilizar para sus post, si te gusto la guia " Como utilizar Markdown parte 2" , te agradeceria bastante un upvote, resteem o comentario. Saludos soy @makemoneynow.
ANALIZANDO, PENSANDO Y ACTUANDO, SE PUEDE LOGRAR UN MEJOR RENDIMIENTO.
