
Tomando como guía el manual de MT en su sección f) Publicar Imágenes, vamos a continuar con el tratamiento (no muy flexible en MT) de la imagen elegida. En el punto del manual 5) Click en embedded image, se da un opción a elegir entre:
- Create a new entry using this uploades file/ Crea un nuevo post usando la imagen que acabas de subir; y
- Show me the html/ Mostrar el código HTML
Al contrario de lo que indica el manual, elegir la segunda opción: Show me the html. De esta manera, ustedes tendrán la imagen codificada en hmtl en una ventana diferente a la de la edición del posteo. A continuación, pintar todo el código y Botón derecho/Copiar.
Ya en los cuadros de edición, Botón derecho/Pegar. Sobre ese código vamos a trabajar y explorar las opciones que nos da.
Ejemplo de código html de imagen:
img alt="Automan1.jpg" src="http://www.ilhn.com/datos/practicos/ejercitacion/archives/Automan1.jpg" width="320" height="240" border="0" align="right" hspace="5" /
La 1º parte: im g de alt="Automan1.jpg" indica el nombre del archivo de imagen que queremos postear.
La 2º parte: src="http://www.ilhn.com/datos/practicos/ejercitacion/archives/Automan1.jpg"
muestra en que dirección del servidor se va a alojar el archivo.
Estas dos secciones no revisten carácter para nuestra inquietud.
En cambio, las siguientes partes si nos interesan.
La 3º: width="320" height="240" dan la pauta del tamaño de la imagen. El tamaño que obtenemos del código es el original tal cual estaba guardado el archivo. Sin embargo, podemos manipular su dimensión. En este punto una aclaración: el tamaño que se sugiere para las imágenes a postear no debe superar los 14 cm de ancho; esto equivale, en el código html que ustedes verán, a width="420". Y ahora una recomendación: si quisieran agrandar o achicar la imagen, tengan en cuenta de hacerlo proporcionalmente, para que ésta no se deforme; así, si mi imagen fuera de width="320" height="240" y yo quisiera que su ancho sea de exactamente la mitad del que era originalmente, debería cambiar los valores de width="320" a width="160". Atención! Si la altura permanece igual, la imagen se verá como un palo alargado, ya que no guarda proporción. ¿Qué se debe hacer, entonces? Disminuir la altura proporcionalmente a la disminución de ancho anteriormente operada. Entonces, de height="240" debemos corregir a height="120". El resultado será la imagen original reducida a la mitad, guardando su proporción.
La 4º parte: border="0" nos da la posibilidad de enmarcar la imagen
con un borde. Podemos cambiar el valor que se da y ensanchar los bordes.
La 5º parte: align="right" ubica la imagen en alguno de los márgenes. align="right" la ubica a la derecha y si cambiáramos a align="left", la imagen se traslada a la izquierda.
Por último, la 6º parte: hspace="5" la separación que habrá entre texto e imagen. A mayor valor de hspace, mayor separación. Si el valor es 0, van a estar pegados imagen y texto.
Pueden ir viendo los cambios que van haciendo mediante una Vista previa o Preview, botón ubicado al lado del de Guardar o Save. Ambos botones se encuentran al final del editor de posteos. Mientras practiquen estas maneras de transformar la imagen, manéjense con la vista previa, de manera que no publiquen cada cambio o práctica que hagan en el weblog.
Una vez que decidan postear tienen que pintar todo el código html tal cual lo quieran y hacer click en URL. Ahí van a copiar la dirección de donde sacaron la imagen (por ejemplo: http://food4eyes.esoul.it/archives/2003_03_03.html) generando un hipervínculo desde la imagen hasta la dirección Web que tipeen.
Por último, sobre el final del texto pongan Fuente de la Foto y coloquen la raíz del sitio donde obtuvieron la imagen (http://food4eyes.esoul.it para el ejemplo anterior).
Fuente de la foto: http://food4eyes.esoul.it
Publicado por Hernan Cuevas el Septiembre 15, 2004 03:12 PM | TrackBackUn pequeño detalle, Hernán: en realidad no hace falta cambiar width y height proporcionalmente. Basta con modificar sólo el width y borrar el height. De esta manera, la vertical de la foto/imagen se acomodará automáticamente al ancho definido.
El resultado se vería así:
<img src="x" width="x" border="x" align="x" hspace="x" />, donde x serían los datos pertinentes de la imagen, claro.
Pueden probar también como les copio Jonathan en el comentario anterior. No es dificil! Recuerden mantenerse en borrador para poder hacer la previsualizaciones que quieran, acomodar texto, imagen y demás, y luego, cuando estan seguros, pasar al estado de publicación.
Publicado por: Ariel Vercelli a Septiembre 16, 2004 09:29 PMdonde puedo encontrar imagenes que tengan las licencias que pidieron
Publicado por: florencia a Septiembre 18, 2004 01:34 PMaca hay algunas imagenes licenciadas. pronto les mandamos mas...
http://food4eyes.esoul.it
como puedo acomodar un simple texto sin usar width y height
Publicado por: Juan Treviño a Agosto 8, 2006 08:01 PM
