jueves, 4 de abril de 2013

Manual ShortCodes en WordPress (completísimo) III

Última parte del manual completo del manejo de los shortcodes (atajos) en wordpress, en esta parte vamos a introducir un uso amigable y sencillo de estos desde el editor de contenido tinymce.
Al fin y al cabo, lo que se pretende es que el autor de las entradas necesite saber lo mínimo posible sobre código, y si lo necesario es nada, mejor para todos.
Habrá que hacer los siguiente:
  • Crear un archivo JavaScript para la creación del botón.
  • Registrar el archivo y el botón.
 El archivo JS se usa para registrar el plugin con la API TinyMCE.
Creamos un archivo nuevo llamado my-short-code.js en el directorio /js/ de nuestra plantilla (si no existe, crearlo) y ponemos lo siguiente:

(function() {
   tinymce.create('tinymce.plugins.recentposts', {
      init : function(ed, url) {
         ed.addButton('recentposts', {
            title : 'Recent posts',
            image : url+'/recentpostsbutton.png',
            onclick : function() {
               var posts = prompt("Number of posts", "1");
               var text = prompt("List Heading", "This is the heading text");

               if (text != null && text != ''){
                  if (posts != null && posts != '')
                     ed.execCommand('mceInsertContent', false, '[recent-posts posts="'+posts+'"]'+text+'[/recent-posts]');
                  else
                     ed.execCommand('mceInsertContent', false, '[recent-posts]'+text+'[/recent-posts]');
               }
               else{
                  if (posts != null && posts != '')
                     ed.execCommand('mceInsertContent', false, '[recent-posts posts="'+posts+'"]');
                  else
                     ed.execCommand('mceInsertContent', false, '[recent-posts]');
               }
            }
         });
      },
      createControl : function(n, cm) {
         return null;
      },
      getInfo : function() {
         return {
            longname : "Últimos post",
            author : 'Antonio García',
            authorurl : 'http://mipasapersonal.blogspot.es',
            infourl : 'http://www.coodex.es',
            version : "1.0"
         };
      }
   });
   tinymce.PluginManager.add('recentposts', tinymce.plugins.recentposts);
})();



En el código básicamente lo que se hace es crear un nuevo plugin, se piden los dos parámetros, y según lo que introduzcamos se inserta un código en el editor, se crea un botón con una imagen y al final se añade nuestro plugin al gestor de plugins del TinyMCE.


Ya solo queda registrar el botón (lo añadimos a la lista de botones del editor):
function register_button( $buttons ) {
   array_push( $buttons, "|", "recentposts" );
   return $buttons;
}

y enlazar nuestro JS creado al ppio:
function add_plugin( $plugin_array ) {
   $plugin_array['recentposts'] = get_template_directory_uri() . '/js/mi-short-code.js';
   return $plugin_array;
}



Y aquí el enlace "fuente" de este manual (en inglés), obviamente, todo esto no me lo he inventado ni a salido de la nada :D
http://wp.smashingmagazine.com/2012/05/01/wordpress-shortcodes-complete-guide/
Al final de éste, hay unos cuantos ejemplos más de shortcodes, como para añadir un googlemaps, por ejemplo, y también unos plugins que van bien para crear shortcodes sin tener que tocar tanto código como ahora.

lunes, 1 de abril de 2013

Empezando a trastear con windows 8

Bueno, lo primero que he conseguido a sido que de repente, la app maravillosa de IE 10 de "Mi Metro" haya "desaparecido", así que, fácilmente, 1º infiernas al nuevo SO, luego dudas de tu nueva máquina, luego razonas que no es culpa de ellos, que lo habrás desinstalado mientras estabas poseído y no lo recuerdas, y ya al final piensas que "tal vez" haber instalado Chrome (me imagino que con otros navegadores pasará igual) haya tenido algo que ver.
Pues si, aunque te lo bajes, lo instales, lo ancles, etc... no volverá a salir igual que al principio, se te abrirá con el estilo ventana antigua, dentro del escritorio, no con ese estilo tan "indomable" desde un sobremesa.
La solución, una vez conocida, es bastante fácil, rápida y sencilla (para cuando vuelvas a instalar otro navegador, y te vuelva a pasar.)
Vas a tu ventana anticuada de IE, le das a al icono de la tuerca --> Opciones de internet --> Programas --> Establecer asociaciones --> Seleccionar todos y Clic en guardar.
Voilà, solucionada 1ª liadita con "Mi Metro" que se ha ganado una publicación, voy a seguir trasteando a ver cuantas liaditas por día consigo.
Nota: también he leido que la resolución mínima para ver la versión indomable de IE 10 es 1024x768, revísalo, por si nunca has llegado a verlo así.