Subir imágenes al foro
Bien, comencemos por un par de buenos links para subir imágenes:
http://imageshack.us
http://picsplace.to/
Ambos son buenos, pero su servicio incluye un precio extra para los "flojos" y es linkear automáticamente la imagen que posteamos hacia su sitio. No es obligatorio para nosotros proporcionar un enlace a su página, sólo que el link está allí para quienes sólo se limiten al copy-paste.
Hice dos versiones de un upload: una con el método de Imageshack (Izquierda) y otra con el método que explicaré (A la derecha). Nota (Clickeando a la izquierda) que la imagen grande sale en medio de alguna publicidad. En cambio la miniatura de la imagen de la derecha nos da un link limpio y sin anuncios por ningún lado:
Pasos: 1.- Primeramente debemos cambiar nuestro editor de imágenes al modo
"Editor estándar - Controles extra". Sí ya sé. No es tan "bonito" como el WYSIWIG pero nos da más opciones. Es como un auto sincrónico: al principio es un poquito difícil acostumbrarse pero después no lo cambias por ninguno. Es decir, con el Editor Estándar no visualizas en tiempo real lo que estás haciendo (Aunque siempre puedes actualizar con el botón "Vista previa del mensaje" ubicado justo debajo de tu caja de texto.
Ok estos son los pasos para cambiar tu editor:
- Haz click en el link "Panel de Control" ubicado en la parte superior izquierda de la ventana de Foros del Web.
- Luego en el menú lateral izquierdo escoges "Editar opciones"
- Baja al fondo de la página y encontrarás el apartado "Otras opciones". Allí cambias a "Editor estándar - Controles extra" tal como lo puedes ver en la siguiente imagen:
- Haces click en aceptar y vuelves al foro.
2.- Tenemos entonces la imagen de nuestra preferencia y procedemos a hacerle una versión en miniatura. Le
reducimos el tamaño a 150 píxeles de ancho (O lo que desees) y la guardamos como un documento aparte. Esto fue lo que hice con un perrito muy gracioso, la imagen se llama
perro35te.jpg y su versión pequeña
perro3th2gr.jpg.
3.- Ingresa ahora a cualquiera de los dos
image hosting mencionados. En este tema utilizaremos
Imageshack como ejemplo, dado que es el más utilizado aquí. Sube cada una de las 2 imágenes que creaste (La pequeña y la grande), recordando anotar la dirección que el hosting te proporciona (Usa para ello el block de notas y las funciones Copiar y Pegar, sobre todo si son varias las imágenes que subirás).
Cuando entres a las distintas direcciones que te da, olvídate de las demás y toma la que está en la
octava fila contando de arriba a abajo, tal como lo puedes ver aquí:
Se trata de una dirección pura, sin etiquetas de ningún tipo ya que tú serás quien se las pondrá, es decir, tendrás el control.
____________________________
Como ya configuraste tu editor (Paso 1),
ahora puedes ejecutar comandos que con el otro no podías.
Uno de ellos tiene que ver con las imágenes y la forma de enlazarlas,
por ejemplo las miniaturas.
____________________________ 4.- Ahora lo que vamos a hacer es lograr que Foros del Web "comprenda" que estamos posteando una imagen y no otra cosa. Para ello usamos las etiquetas
[img] (para abrir) y
[/img] (para cerrar). En otras palabras, vamos a etiquetar el enlace para que pueda aparecer la imagen en el foro. El código quedaría de esta forma:
Código PHP:
[img]http://img160.echo.cx/img160/7854/perro3th2gr.jpg[/img]
Y se vería así:
____________________________
Bien. Ahora tenemos que decirle a nuestro perrito perro3th2gr.jpg
que tiene un hermano mayor llamado perro35te.jpg.
____________________________ 5.- Lo que vamos a hacer ahora es crear un link sobre el
perrito para que él mismo nos muestre al
perrote, quien va a aparecer en una ventana nueva cuando hagamos click.
Agarramos al pequeño (Que ya tiene las etiquetas) y lo cubrimos con otras etiquetas, esta vez se trata de
url (para abrir) y
/url (para cerrar). Ellas sirven para indicar que existe una página web que se abrirá al hacer click. Entonces ya el código queda así:
Código PHP:
[url][img]http://img160.echo.cx/img160/7854/perro3th2gr.jpg[/img][/url]
Como puedes ver, las etiquetas se agregaron encima de las que ya tenía.
6.- Ya agregamos las etiquetas pero ¿Adónde llevan?. Es el momento de tomar la dirección del perrote y pegarla para finalizar el trabajo. Esto se logra yendo a la primera etiqueta
url y agregándole un signo "igual" (=) para después pegar la dirección web. Eso se vería de esta manera:
Código PHP:
[url=http://img221.echo.cx/img221/9721/perro35te.jpg][img]http://img160.echo.cx/img160/7854/perro3th2gr.jpg[/img][/url]
La lógica sería así:
Código PHP:
[url=Dirección del perrote][img]Dirección del perrito[/img][/url]
El resultado es el mismo que viste al principio (Imagen de la derecha)
_________________________________
Este método no sólo sirve para postear imágenes. Puedes linkear páginas webs a tu gusto como por ejemplo el foro de nuestro amigo Zum@x:
o un acercamiento del foro del pana Caminante:
Aquí otro ejemplo de miniaturas en un post.
Incluye también otras opciones, puedes echar mano a gifs animados y hasta texto simple. Por ejemplo,
este link nos lleva a los logos del millón. Así quedó el código anterior:
Código PHP:
[url=http://www.forosdelweb.com/millon/van.php]este link[/url]
Volviendo al tema de las imágenes, este recurso nos sirve cuando, por ejemplo, tenemos poco espacio en la web y decidimos subir nuestras imágenes (Son los archivos que más pesan) a algún servidor externo. Si se procede de la manera explicada, obtendrás una buena imagen sin publicidad molesta alrededor.
___________________________________
Para usuarios de Firefox
Existe una extensión llamada
BBCode, la cual te ahorrará el trabajo de colocar los códigos manualmente, ya que los agrega con sólo un click derecho, desplegándose un menú similar a éste:
La extensión BBCode la puedes bajar gratuitamente de la página de su autor:
http://jedbrown.net/1.0/mozilla/extensions/
Se instala automáticamente, sólo debes cerrar tu Firefox y volverlo a abrir para que los cambios surtan efecto.
Lamentablemente dicha ventaja no está disponible para usuarios de Internet Explorer, ya que no es un navegador de código abierto y por ende su desarrollo depende del estado de humor de Bill Gates.
___________________________________
Notas: - Cuando postees imágenes, procura que no sobrepasen los 400 píxeles de ancho. Así no deformarás (ensancharás) el espacio del post y simultáneamente darás la oportunidad a otros compañeros de citar tu mensaje (con todo e imagen) sin dañar el formato del foro. Si es necesario mostrar la imagen a un tamaño mayor, haz una miniatura y linkéala como se explicó.
- Procura asignarle una calidad no muy alta a tus jpg, así pesarán menos y tu post se mostrará más rápido. Prueba con valores de 5 a 7, siendo 1 el menor y 12 el mayor. Igualmente a los gif animados. Juega con la optimización y busca la mejor relación calidad - peso.
- Recuerda que no tod@s l@s usuari@s tienen conexión de banda ancha. Piensa en ell@s, seguro agradecerán tu gesto al notar que la información baja con rapidez.
___________________________________
Documentación: ¿Cómo subir imagenes al foro? por
Dennyboy Guía BBCode. para foros vbulletin.