WordPress y las etiquetas DIV

Mi intención al empezar este nuevo proyecto aquí en Vectoralia es compartir mis experiencias con WordPress, con la intención de que puedan ser útiles para los que se inician o quizás incluso para los que ya lo han manejado durante cierto tiempo.

Nada más empezar a utilizar el editor de posts de WordPress me he topado con un curioso problema, de hecho un bug de WordPress (o una limitación, sencillamente.) Después de un poco de investigación veo que el problema lleva un cierto tiempo produciéndose y la solución no es segura ni universal, aparentemente.

El problema en cuestión consiste en el campio de una etiqueta div por otra p. Quería colocar una pequeña caja al lado del texto, con una imagen y un pie de foto, y estos dos elementos figurarían en dicha caja, flotando a la derecha del texto del artículo. Pasé al editor de código de WordPress para introducir algo como lo que sigue:

Contenido dentro de la caja…

pero al encontrarse la etiqueta DIV, WordPress la sustituye por P, como ha sucedido precisamente aquí, a la izquierda. Es cierto que para este propósito una cosa puede ser casi equivalente a la otra, pero en otras situaciones este bug debería evitarse. Y ni siquiera acepta que introduzcas DIV dentro de un trozo de código, dentro de las etiquetas CODE.

¿Cuál es la solución? Existe la posibilidad de retocar el código de WordPress, pero quizás la solución más simple y en mi caso óptima es sencillamente desactivar el editor visual, ya que de todos modos prefiero teclear el código directamente.

div-problem.jpgPara desactivar (reversiblemente) el editor visual se accede a Users y se desactiva la casilla correspondiente (si el blog tiene múltiples editores cada uno puede elegir lo que prefiera.)

Con esta opción desactivada, puedes introducir un DIV dentro del código del artículo sin que WordPress se lo cargue.

Ahora probamos con el editor visual desactivado y ningún problema:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua…



El código utilizado para esta caja, que flotaría en este caso a la izquierda es:
<div style=”width: 250px; padding: 10px; float: left; border: 1px dotted black;”>Lorem ipsum…</div>

Related Posts Plugin for WordPress, Blogger...

Otras entradas relacionadas:

  1. Thelonius Monk’s WordPress
  2. Presentación de WordPress 2.8 en video
  3. Firefox + Gears + WordPress = Crash
  4. Instalación rápida y fácil de WordPress
  5. WordPress 2.7
  6. Usos alternativos de WordPress
  7. WordPress como libreta de contactos
  8. WordPress para gestionar una web

This entry was posted in Diseño web, wordpress and tagged , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

3 Comments

  1. martin
    Posted 20/02/2008 at 11:32 am | Permalink

    Muchas gracias por la info, es justo lo que estaba buscando, me vino perfecto. Gracias y saludos.

  2. Posted 05/07/2008 at 10:57 pm | Permalink

    A mi me paso exactamente lo mismo…finalmente trabajo con sin el editor WYSIWYG…solo codigo HTML

  3. Posted 05/07/2008 at 11:01 pm | Permalink

    A todo esto sabes como crear un llamado para una hoja de estilo que se ocupara dentro de un post…por ejemplo cuando quieres construir una tablita dentro del post…pero quieres mantener el estilo en un archivo externo…y por ultimo otra consulta…como hace para permitir en los comentarios solo algunos comandos HTML??
    GRACIAS
    (agradeceria que me notificases a mi mail para no estar viniendo a revisar a cada rato tu pagina..gracias)

One Trackback

  1. [...] poder llegir en aquest bloc n’hi ha prou amb desactivar l’editor visual a nivell d’usuari per poder inserir [...]

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>