Todos amamos WordPress. Pero para los usuarios avanzados, luego de un tiempo algo que empieza a molestarnos es el hecho de que WordPress modifica el codigo de nuestros posts, y no nos permite escribir codigo avanzado.

Si te gustaria podes escribir html y javascript directamente dentro de un post sin que WordPress interfiera, continua leyendo, puede ser que este plugin te sea de gran ayuda.

</p>

Para bloggers experimentados

El plugin Raw-html esta orientado a:

  1. Bloggers con conocimientos basicos de HTML/CSS.
  2. Bloggers que necesiten mostrar contenido complejo en sus posts y paginas, como mostrar y colorizar pedazos de codigo (snippets), ejecutar scripts customizados solo en ciertas paginas o posts, incorporar web forms customizados, etc.
  3. Bloggers que saben lo que estan haciendo – La configuracion default de wordpress es demasiado a prueba de tontos. Por ejemplo, con el editor visual habilitado, este agregará indentaciones inesperadas y line breaks aun dentro de los tags
    </span></tt>. Ademas, nos bloquea de agregar tags 
    </span></tt>, automaticamente arreglandolos en tags

    </span></tt>. </li> </ol>

    Si concuerdas con alguna de las descripciones, continua leyendo y puede ser que encuentres que este plugin hará tu experiancia como blogger mas simple.

    Antes que nada:
    Desactiva el editor visutal de WordPress !!!

    </div>

    Plugin raw-html para WordPress

    Website: http://wordpress.org/extend/plugins/raw-html/

    En foros o blogs podemos encontrarnos con las siguientes

    PREGUNTAS:

    • Necesito poner algunas definciones de estilo CSS y una funcion javascript en un post, pero no funciona en WordPress. Por que ?
    • ¿ Por que el editor WYSIWYG en WordPress reformatea y modifica mi HTML en mis posts ?
    • El editor de WP de las plantillas no me deja cambiar el código…
    • Al momento de ingresar el codigo wordpress me quita el codigo o me lo cambia …
    • Ingrese el codigo para un video de YouTube, pero al grabar el post WordPress me lo modifica.

    RESPUESTA:

    • Los editores visuales de WordPress cuando creen que el codigo ingresado es incorrecto lo arreglan.

    En el caso de ingresar codigo para videos, lo que hacen es destruir el objeto embebido (cambian, eliminan o reordenan las etiquetas). Supuestamente esto se arregla desactivando los editores visuales, pero en mi experiencia WordPress siempre de alguna forma cambia el codigo, esten los editores visuales activados o no.

    Es aqui cuando acude en nuestra salvacion este plugin: Raw-html

    Este plugin te permite utilizar HTML crudo directamente en el codigo de tus posts, sin interferencia por parte de WordPress. Esto puede ser una bendicion para todos aquellos bloggers que necesitan escribir codigo html complejo o javascript dentro de sus posts.

    RawHTML tambien agregará algunos nuevos checkboxes a la pantalla Edit que te permitirá deshabilitar ciertos filtros de WordPress para un post en particular. De esta forma, puedes:

    • Deshabilitar wpterturize (este filtro crea smart quotes y otros caracters tipograficos)
    • Deshabilitar la creacion automatica de parrafos (

      ...

      )
    • Deshabilitar las caritas sonrientes (smilies)
    • Deshabilitar convert_chars (este filtro convierte ampesands a entidades HTML y "arregla" algunos caracteres Unicode).

    Usando el plugin

    Para evitar que parte de tu post o pagina sea filtrada por WordPress, envuelve esta parte en tags o tags [RAW]...[/RAW]. Estas 2 versiones funcionan igual, pero la ultima es mejor si estas usando el editor visual ( no recomendado ).

    Ejemplo:

    <!--start_raw-->
    Example : This
    is
    a 'test'!
    <!--end_raw-->
    
    

    Notas

    • Se recomienda deshabilitar el editor visual cuando se este por editar un post que contiene HTML/JS/CSS.
    • Personalmente prefiero la sintaxis: .... Estos tags estan formateados como comentarios HTML, por lo cual no son visibles por los visitantes del blog aun si se desactiva el plugin Raw HTML. Por otra parte, los tags [RAW]...[/RAW] si serán visibles.

    Por ejemplo podremos escribir directamente en nuestros post codigo javascript, o codigos de videos youtube sin problemas:

    Ejemplo Raw-html

    Este post entero mismo es un ejemplo de uso del plugin Raw-html, ya que todo este post esta embebido dentro de las marcas, pero me gustaria presentar un ejemplo puntual.

    Ejemplo de javascript embebido usando el plugin raw-html:

    Si tenemos instalado y habilitado el plugin, podremos pegar el siguiente codigo en alguna parte de nuestro post.
    Este codigo consulta un webservice de flickr y muestra en la pagina imagenes de la palabra que pasemos como parametro en tags= , en este caso pasamos tags=cat,pet
    La descripcion completa de los parametros puede hallarse en: http://www.flickr.com/services/feeds/docs/photos_public/

    Ejemplo de javascript embebido:

    <!--start_raw-->
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
    $(document).ready(function(){
    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat,pet&tagmode=all&format=json&jsoncallback=?",
        function(data){
          $.each(data.items, function(i,item){
            $("<img/>").attr("src", item.media.m).appendTo("#images");
            if ( i == 3 ) return false;
          });
        });
    });
    
    </script>
    <style>img{ height: 100px; float: left; }</style>
    <div id="images">
    </div>
    <!--end_raw-->
    

    Y obtendremos el siguiente resultado:

    Solo por diversion, una vez mas, pero esta vez con la palabra Debian

    y cambiando el tag por Linux …

    Ejemplo embebiendo videos de youtube

    Embeber un video de youtube es tan simple como deberia ser: simplemente copiar y pegar el embed object:

    <object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/F5WLEu4UIds&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/F5WLEu4UIds&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
    

    Este articulo es el primero de una serie de articulos que introducen algunos plugins para WordPress, orientados a ayudar a mejorar y simplificar la experiencia blogger de usuarios avanzados, especialmene desarrolladores web y diseñadores. La mayoria de los plugins fueron testeados en una instalacion default de WordPress 2.5.1 para funcionalidad basica.

    Si te ha gustado este articulo, considera susbribirte al
    FEED y o escribir un comentario o sugerencia

    </div> </div>
    Copyright: http://snarvaez.poweredbygnulinux.com Sebastian Narvaez


    este documento ha sido publicado bajo la siguiente licencia: “Verbatim copying and distribution of this entire article are permitted in any medium provided this notice is preserved.”