[TUTORIAL] Subida de imagenes, videos, explicacion de comandos y extras

Para dar las gracias debes entrar o registrarte en el foro

Administrador
Administrador
Mensajes: 5010 Agradecido: 620
17 May 2014, 20:35# 1
Imagen


Buenas !!!

Voy a hacer un breve resumen con ejemplos para todo aquel que quiera publicar noticias, guías, o cualquier material.

Hay algunas dudas al respecto, y aunque se que hay muchas de estas cosas explicadas, voy a intentar dejarlo todo bien claro y resumido en un mismo post.

Lo voy a resumir en 3 puntos, pinchar en cada uno de ellos para ir directamente a lo que mas os interese.


- Indice -

Imagen Imagen Imagen Imagen Imagen



Imagen

Lo primero que haremos es subir cualquier imagen a una de las miles de webs que nos dan alojamiento gratuito, yo voy a usar como ejemplo http://postimage.org

Buscáis la imagen en vuestros pc, elegís la resolución a la que queréis que se vea, y la subís.

Una vez que lo hagáis os dará varias opciones de url. La que nos interesa es la segunda, Enlace directo, en mi caso será http://s16.postimg.org/xb0x1k9np/7281eb ... bbd94a.jpg

Ahora para que aparezca en el chat deberemos usar la etiqueta Img, se vera algo así:
[img ]http://s16.postimg.org/xb0x1k9np/7281ebd8_c843_40eb_9c42_a825ccbbd94a.jpg[/img]

Y listo, cuando deis a publicar os saldrá esto:

Imagen

* Como extra, podeis repetir la misma secuencia para poner un gif en vuestra firma, dado que un gif es una secuencia de imágenes en movimiento.






Imagen

Para videos es necesario que estén subidos al canal de YouTube. O si es una retransmisión de Twitch saber la URL del canal que se quiere retransmitir.

Os dejo el enlace del tutorial de Akira para que lo veais, esta perfectamente explicado tanto los vídeos de Youtube como los de Twitch http://www.xboxoneforos.com/info-tutoriales/como-poner-videos-de-youtube-en-el-foro-t1012.html





Imagen

Paso a paso, iremos en orden tal y como aparecen justo arriba, en la edición del texto.

Imagen

El comando "B" lo usaremos para resaltar en negrita un texto.

Cuando lo usemos quedará algo así: [b ]Texto de ejemplo[/b]

Y se verá algo así: Texto de ejemplo



Imagen

El comando "i" lo usaremos para mostrar un texto en cursiva.

Cuando lo usemos quedará algo así: [i ]Texto de ejemplo[/i]

Y se verá algo así: Texto de ejemplo



Imagen

El comando "u" lo usaremos para subrayar un texto.

Cuando lo usemos quedará algo así: [u ]Texto de ejemplo[/u]

Y se verá algo así: Texto de ejemplo



Imagen

El comando "Quote" se utiliza en todos los foros, y sirve para resaltar un comentario al que quieras contestar o citar.

Cuando lo usemos quedará algo así: [quote ]Texto de ejemplo[/quote]

Y se verá algo así:

Texto de ejemplo



Imagen

El comando "Code"lo usaremos para enmarcar un texto dando la opción de seleccionarlo al completo.

Cuando lo usemos quedará algo así: [code ]Texto de ejemplo[/code]

Y se verá algo así:
Código: Seleccionar todo
Texto de ejemplo



Imagen

"List" es un comando que sirve para tabular, (dejar un espacio en blanco), un texto completo.

Cuando lo usemos quedará algo así:

[list ]Texto de ejemplo 1
Texto de ejemplo 2
Texto de ejemplo 3[/list]


Y se verá algo así:

    Texto de ejemplo 1
    Texto de ejemplo 2
    Texto de ejemplo 3



Imagen

Utilizaremos el comando "List=" para tabular un texto como en el ejemplo anterior, pero formando un guion en orden creciente. Es necesario utilizarlo combinado con el comando "[*]" en cada línea del texto.

Cuando lo usemos quedará algo así:

[list=1 ][* ]Texto de ejemplo 1
[* ]Texto de ejemplo 2
[* ]Texto de ejemplo 3[/list]


Y se verá algo así:

  1. Texto de ejemplo 1
  2. Texto de ejemplo 2
  3. Texto de ejemplo 3



Imagen

El comando "[*]" se utiliza para crear un guión. Y es imprescindible usarlo con el comando "List".

Es necesario incluirlo en cada línea del texto.

Cuando lo usemos quedará algo así:

[list ][* ]Texto de ejemplo 1
[* ]Texto de ejemplo 2
[* ]Texto de ejemplo 3[/list]


Y se verá algo así:

  • Texto de ejemplo 1
  • Texto de ejemplo 2
  • Texto de ejemplo 3



Imagen

El comando "Img" es uno de los mas usados, y es simplemente para colgar una foto.

Cuando lo usemos quedará algo así: [img ] (Enlace a imagen) [/img]


Y se verá algo así:

Imagen



Imagen

"Url" se utiliza para colgar una dirección externa o interna, o lo que es lo mismo un vinculo o link.

Cuando lo usemos quedará algo así: [url ]www.Xboxoneforos.com[/url]

Y se verá algo así:

http://www.Xboxoneforos.com



Imagen

El comando "marco_color" os rodeara el texto o la imagen de un marco del color que vosotros elijáis, eso si, en código de color Hexadecimal.

Cuando lo usemos quedará algo así:

[marco_color=#C9E8F5 ]Texto de ejemplo[/marco_color ]

Y se verá algo así:


Texto de ejemplo



Imagen

El comando "Ancla" se utiliza para crear un texto o una imagen que sirva como marca de referencia, para después con el comando "ir_ancla" podamos usar un texto o una imagen que sea un vinculo a dicha marca. Tendréis que escribir la etiqueta con la que quereis que se llame.

Cuando lo usemos quedará algo así: Texto de ejemplo

Y se verá algo así: Texto de ejemplo

(Aqui os dejo el enlace directo al Comando "ir_ancla" para que cojáis la idea: Ir a comando "Ir_Ancla")



Imagen

Usar el comando "centrar" para centrar una imagen o un texto cualquiera que publiquéis.

Os pondré 2 ejemplos para que lo veáis.

Cuando lo usemos quedará algo así:

[centrar ]
[img ](Enlace a imagen)[/img ]
[/centrar ]

[centrar ]Texto de Ejemplo[/centrar ]


Y se verá algo así:

Imagen

Texto de Ejemplo



Imagen

El comando" cita" se usa para enmarcar un texto entre comillas.

Cuando lo usemos quedará algo así: [cita ]Texto de ejemplo[/cita ]

Y se verá algo así:


Texto citado
Texto de ejemplo



Imagen

El comando "facebook" se usa para añadir un botón para que el lector pueda publicarlo automáticamente.

Cuando lo usemos quedará algo así:

[Facebook ][/Facebook ]

Y se verá algo así:




Imagen

El comando "googleplus" se usa para añadir un botón para que el lector pueda publicarlo automáticamente.

Cuando lo usemos quedará algo así:

[googleplus ][/googleplus ]

Y se verá algo así:




Imagen

"img_acho=" se usa para darle un ancho concreto a una imagen en el post. Voy a poner dos ejemplos para que noteis la diferencia.

Cuando lo usemos quedará algo así:

[img_ancho=50 ] (Enlace a imagen) [/img_ancho]
[img_ancho=100 ] (Enlace a imagen) [/img_ancho]

Y se verá algo así:






Imagen

Usar el comando "imgcentro" para centrar una imagen cualquiera que publiquéis.

Os pondré 1 ejemplo para que lo veáis.


Cuando lo usemos quedará algo así:

[imgcentro ] (Enlace a imagen) [/imgcentro]

Y se verá algo así:


Imagen



Imagen

El comando "indice" sirve para crear un índice oculto, algo parecido a un spoiler pero usado para reducir extensión en un post.

Cuando lo usemos quedará algo así:


[índice ]Texto de ejemplo[/índice ]

Y se verá algo así:


Índice:
Texto de ejemplo



Imagen

(Aqui os dejo el enlace directo para volver al comando "ancla": Ir a comando "Ancla")

El comando "ir_ancla" se usa justamente para ir directos al comando "ancla" que hallamos designado previamente.

Cuando lo usemos quedará algo así: [ir_ancla=Ejemplo ]Texto de Ejemplo 1[/ir_ancla]

Y se verá algo así: Texto de Ejemplo 1



Imagen

( Comando desactivado por administración )

El comando "marco_verde" es el mismo que el comando "marco_color" pero designando automáticamente el color verde.

Cuando lo usemos quedará algo así:

[marco_verde ]Texto de Ejemplo[/marco_verde]

Y se verá algo así:


Texto de Ejemplo



Imagen

"Spoiler" es un comando también super utilizado en el mundo de los foros.

Sirve para velar un texto que pueda dañar la sensibilidad de alguien, o mostrar una información fuera de lugar.

Cuando lo usemos quedará algo así:

[spoiler ]Texto de Ejemplo[/spoiler ]

Y se verá algo así:

Spoiler:
Texto de Ejemplo



Imagen

El comando "texto_tachado" se usa para tachar un texto, asi de fácil.

Cuando lo usemos quedará algo así: [texto_tachado ]Texto de ejemplo[/texto_tachado ]

Y se verá algo así: Texto de ejemplo


NUEVA ETIQUETA
12/08/2014
Imagen

El comando "twitch" se usa para poner un vídeo de Twitch y poder retransmitir desde el mismo post.

Debemos poner solo lo que aparezca tras el ".tv/" del enlace del canal de Twitch.

Por ejemplo: De esta URL ---> http://www.twitch.tv/xbox solo cogeríamos xbox

Cuando lo usemos quedará algo así:

[twitch ]xbox[/twitch]

Y se verá algo así:



Imagen

El comando "twitter" se usa para añadir un botón para que el lector pueda publicarlo automáticamente.

Cuando lo usemos quedará algo así:

[twitter ][/twitter ]

Y se verá algo así:




Imagen

El comando "via=" se usa para citar la fuente de un articulo.

Cuando lo usemos quedará algo así:

[via=www.xboxoneforos.com ]xboxoneforos.com[/via ]

Y se verá algo así:

Vía | XboxOneForos.com


Imagen

( Extraído del tutorial hecho por Akira)

El comando "youtube" se usa para poner un video en cualquier post.

Debemos poner solo lo que aparezca tras el "=" del enlace del video.

Por ejemplo: De esta URL ---> http://www.youtube.com/watch?v=FISmKkoPGsk solo cogeríamos "FISmKkoPGsk"

Cuando lo usemos quedará algo así:

[YouTube ]FISmKkoPGsk[/YouTube ]

Y se verá algo así:







Imagen

En esta sección os voy a enseñar a usar los colores, el tamaño de fuente y algo que no esta incluido en los botones pero que os ayudara a que vuestros post queden con un toque original y diferente, las tablas.

- Colores -

Es tan fácil como seleccionar un texto y pinchéis en el color correspondiente arriba, en la edición del post.

Ejemplos:

[color=#FF0000 ]Texto de Ejemplo 1[/color]
[color=#FF00FF ]Texto de Ejemplo 2[/color]
[color=#FFBF00 ]Texto de Ejemplo 3[/color]
[color=#80FF00 ]Texto de Ejemplo 4[/color]

Texto de Ejemplo 1
Texto de Ejemplo 2
Texto de Ejemplo 3
Texto de Ejemplo 4






- Tamaño de texto -

Es tan fácil como seleccionar un texto y pinchéis en el nivel de tamaño correspondiente arriba, en la edición del post.

Ejemplos:

[size=50 ]Texto de Ejemplo 1[/size ]
[size=85 ]Texto de Ejemplo 2[/size ]
[size=150 ]Texto de Ejemplo 3[/size ]
[size=200 ]Texto de Ejemplo 4[/size ]

Texto de Ejemplo 1
Texto de Ejemplo 2
Texto de Ejemplo 3
Texto de Ejemplo 4


.



- Tablas -

Crear tablas es muy sencillo, siempre es la misma estructura:

[tabla ] Para iniciar la tabla
[tr ] Para iniciar la linea
[td ] Para iniciar la columna
[/tabla ] Para finalizar la tabla
[/tr ] Para finalizar la linea
[/td ] Para finalizar la columna


Entonces quedaría así una tabla con 2 columnas y 2 filas:

[table ]
[tr ]
[td ]
Texto de Ejemplo 1[/td ]
[td ]
Texto de Ejemplo 2[/td ]
[/tr ]

[tr ]
[td ]
Texto de Ejemplo 3[/td ]
[td ]
Texto de Ejemplo 4[/td ]
[/tr ]
[/table ]

Así se verá:

Texto de Ejemplo 1 Texto de Ejemplo 2
Texto de Ejemplo 3 Texto de Ejemplo 4


Y si incorporamos imágenes ?? Pues se vera algo así:

Imagen Imagen
Imagen Imagen


Ahora esta en vuestras manos usarlo con originalidad. Podeis hacer tablas de tantos elementos como deseéis, siempre teniendo en cuenta el ancho del chat. Y podeis usar textos o imágenes.






- FIN -
Última edición por Ivanescense el 21 May 2014, 11:06, editado 1 vez en total
Gracias  
6 personas han dado las gracias: mssiveattck7yacaréAkuarioxXaVii3xSpartanfranjessjulen
Etiquetado en:
Administrador
Administrador
Mensajes: 5010 Agradecido: 620
17 May 2014, 20:43# 2

Bueno espero que os sirva a todos.

Cualquier duda exponerla por aquí para ayudaros en todo lo que nos sea posible.

1 saludo y a usar comandos !!! XD

Ivanescense.

Gracias  
Moderador
Moderador
Mensajes: 4162 Agradecido: 1058
17 May 2014, 20:48# 3

jajajajaja Increíble esta guía Iván!! tiene muchísimo curro, eres un crack!!! seguro que ayudas a muchos foreros :thanks::thanks:

Eran uno dos y tres...
Gracias  
1 persona ha dado las gracias: Ivanescense
Community Manager
Community Manager
Mensajes: 4985 Agradecido: 564
17 May 2014, 20:58# 4

Macho eres
IMPRESIONANTE

GT/
Gintonic10

Gracias  
1 persona ha dado las gracias: Ivanescense
Hardcore Gamer ++
Hardcore Gamer ++
Mensajes: 513 Agradecido: 87
17 May 2014, 23:33# 5

Muchismas gracias crak!!! A mi me es de mucha utilidad, hay mucos comandos que desconocia emo:-:12emo:-:12emo:-:12emo:-:12emo:-:12emo:-:12

GT: Soldi3r Spartan
Imagen
Banner By "BeatdowNxMadriZ"
Avatar By "Akira"
Imagen
Gracias  
1 persona ha dado las gracias: Ivanescense
Colaborador
Colaborador
Mensajes: 518 Agradecido: 281
18 May 2014, 00:56# 6

muuy buena guia tio!! sirve de mucho y buen trabajo!!

Gracias  
1 persona ha dado las gracias: Ivanescense
Administrador
Administrador
Mensajes: 1571 Agradecido: 401
18 May 2014, 03:16# 7

Menuda máquina máquina máquina que estás hecho Iván, eres un crack tío :) Pedazo de curro, esta guía seguro que viene genial a mucha gente, enhorabuena!

Gracias  
1 persona ha dado las gracias: Ivanescense
Miembro ocasional
Miembro ocasional
Mensajes: 30 Agradecido: 11
01 Ago 2014, 15:22# 8

Hola!!

Esta mubien el Tuto! :emoapl:

:thanks: ! :punk:

Última edición por mssiveattck7 el 04 Ago 2014, 02:56, editado 3 veces en total
Imagen

GT: mssiveattck7
Gracias  
Admin Clanes
Admin Clanes
Mensajes: 1746 Agradecido: 328
01 Ago 2014, 15:56# 9

Espectacular Iván muy currado el tutorial.

Imagen
Imagen
Gracias  
Moderador
Moderador
Mensajes: 4162 Agradecido: 1058
12 Ago 2014, 13:28# 10
COMUNICADO OFICIAL


Se ha añadido una nueva función: poner vídeos de Twitch en el foro. Para poder colocar vuestras retransmisiones tan solo debéis pinchar en la etiqueta que se llama Twitch y dentro de ella poner el final de la URL a la que queréis que se dirija.

Imagen


EJEMPLO: Si la URL donde queréis apuntar es http://www.twitch.tv/xbox dentro de la etiqueta debe de ir solo xbox, es decir, lo que hay a partir de .tv/ El texto con la etiqueta en este caso quedaría así:

Código: Seleccionar todo
[twitch]xbox[/twitch]
Eran uno dos y tres...
Gracias  

Publicidad

Competiciones XOF

Publicidad