Category Archives: Blog

Adsense en Sitios WordPress 2017

Tags : 

Seguir usando adsense en sitios wordpress

El plugin para wordpress de adsense de google dejará de estar disponible en mayo de el 2017. Es por ello que deberíamos realizar unos pequeños cambios para poder seguir usando adsense en nuestro sitio web.

1. Crea una copia de seguridad de tu sitio web de WordPress.
2. Desactiva el plugin oficial de AdSense para WordPress y retira los anuncios de AdSense que ya estén creados.
3. Elige una de las siguientes opciones para seguir mostrando anuncios de AdSense.
Opción 1: Mostrar anuncios con QuickStart
Conecta tu sitio web con un fragmento de código sencillo (código de anuncio a nivel de página) para que AdSense pueda incluir anuncios de forma automática. Cuando hayas añadido este código a tu página, solo tendrás que activar un interruptor en AdSense para que los anuncios empiecen a mostrarse automáticamente.
Debes usar otro complemento de WordPress para editar la sección <head> de la plantilla de tu sitio web de WordPress
Opción 2: Mostrar anuncios personalizados de AdSense
Inserta bloques de anuncios mediante los widgets de WordPress para crear y publicar tus propios bloques de anuncios.
Para ello, crea widgets de texto en WordPress y, a continuación, copia los códigos de tus bloques de anuncios y pégalos en dichos widgets.
4. Asegúrate de que tu sitio web cumpla las políticas de emplazamiento de anuncios de AdSense.
5. Retira por completo el plugin oficial de AdSense.
6. Opcional: Para seguir usando Google Search Console, comprueba que has verificado tu sitio web.

Si necesita alguna configuración extra o algún inconveniente realizando estos pasos, no dude en ponerse en contacto conmigo.


Crear Tema Hijo en WordPress

Tags : 

Creando Temas Hijos en WordPress

Muchas veces necesitamos realizar cambios a nuestro sitio wordpress. Si son pequeños cambios el problema no parecería ser mayor. Pero aún en estos cambios hay que tener una consideración especial.

Si modificamos el tema de wordpress en si mismo, cualquier nueva actualización sobreescribirá estos mismos. Es por ello que existen los child themes (temas hijos), así evitamos que los cambios anteriores se pierdan.

Pasos a seguir:

1 – Crear dentro de wp-content/themes una carpeta nueva con cualquier nombre. Lo ideal sería usar “nombredetemapadre-child” ya que podríamos tener varios temas y nos resultaría mas simple identificarlos después.

2 – Una vez creada la carpeta necesitamos crear un archivo dentro de la misma llamado “style.css” con el siguiente código dentro.

/*
Theme Name: Nombre Theme Hijo (Puede llevar espacios)
Theme URI: http://www.marioblock.com.ar
Version: 1.0
Description: Tema hijo de "Nombre Theme Padre" para hacer cambios sin riesgo alguno
Author: Mario Block
Author URI: http://www.marioblock.com.ar
Template: Nombre Theme Padre
Text Domain: Nombre Theme Hijo (minúsculas y sin espacios)
*/

@import url("../nombrethemepadre/style.css");

/*----------------- Empieza a añadir cambios aquí abajo -------------------------------*/

Con ese archivo archivo solo se podría subir tranquilamente y ya tendríamos un tema hijo. Pero el método @import no es recomendable para cargar estilos css, ya que consume mas recursos y por ende mas tiempo. La forma correcta de agregar estilos a nuestro tema es mediante las funciones provistas por wordpress.

Las funciones serían wp_enqueue_scripts action y wp_enqueue_style(). Ambas provistas por wordpress para encolar en forma correcta los scripts y los estilos.

Si tu tema padre contiene código css también deberás encolarlo. Seteando ‘parent-style’ como dependencia te asegurará que el css hijo se cargue después que este.  El código completo sería el siguiente.

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

Tu tema hijo esta listo para la activación. Ve a apariencia->temas y activa el creado anteriormente. Puedes llegar a necesitar salvar el menú nuevamente y las opciones del theme. Para ello ve a Apariencia->Menú y salvalo nuevamente, lo mismo para las opciones del tema padre.


Crear Theme compatible con WooCommerce

Para crear un theme compatible con woocommerce partiendo de un theme básico vamos a necesitar tener varias previsiones. Las cuales serán detalladas a continuación con sus respectivos tips para hacerlo amigable y sencillo para el usuario con poco conocimiento de wordpress.

Los principales inconvenientes se dán en los diferentes layouts cuando queremos agregar las páginas de woocommerce en si mismo. Los sidebars pueden quedar en posiciones distintas o inclusive si nuestro theme es algo anticuado y esta realizado por desarrolladores con poca experiencia puede ser algo tedioso volverlo compatible.

Esto potencialmente puede afectar la pagina de compra, la pagina de producto y las paginas de taxonomias (categorias y tags) porque WooCommerce usa templates para mostrar sus propias paginas y es imposible conocer exactamente el taggeado de los temas usados. Otras paginas (checkout, carrito, cuenta) no son afectadas porque usan la misma plantilla de page.php

Hay dos caminos para resolver esto:

Usando Hooks (para usuarios avanzados o desarrolladores).

Usando la funcion woocommerce_content() dentro del mismo theme.

Usando woocommerce_content()

Esta solucion permite crear un nuevo template de pagina dentro de tu theme original y será usado por todas las taxonomias y tipos de post de WooCommerce. Si bien es una solución sencilla tiene un inconveniente en que será usado por todas las taxonomias y post types de woocommerce. Los desarrolladores usan por lo general los hooks para ello.

Para instalar esta plantilla de página:

Duplicamos page.php

Duplicando el archivo page.php y nombrandolo woocommerce.php. Este archivo será encontrado como: wp-content/themes/YOURTHEME/woocommerce.php.

Editar la página (woocommerce.php)

Abrimos el archivo con nuestro editor de texto favorito

Reemplazamos el ciclo

Necesitamos encontrar el ciclo. Usualmente comienza con

<?php if ( have_posts() ) :

y termina usualmente con:

<?php endif; ?>

Esto puede varia entre distintas plantillas de wordpress. Una vez que lo encontramos, lo borramos y agregamos en su lugar:

<?php woocommerce_content(); ?>

Esto usará el ciclo de WooCommerce en vez de el ciclo de wordpress. Salvar el archivo. Listo.

Usando hooks

El método hook es mas complicado que el anterior pero también es mas flexible. Esto es similar al método que usamos cuando creamos plantillas de wordpress. Es también el método que usamos para integrar las plantillas Twenty Ten a Twenty Sixteen.

Insertamos algunas pocas lineas en el archivo functions.php dentro de nuestra plantilla.

Primero desestimamos los wrappers de WooCommerce:

remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);

Despues enganchamos en nuestras propias funciones los wrappers para mostrar en la plantilla:

add_action('woocommerce_before_main_content', 'my_theme_wrapper_start', 10);
add_action('woocommerce_after_main_content', 'my_theme_wrapper_end', 10);

function my_theme_wrapper_start() {
  echo '<section id="main">';
}

function my_theme_wrapper_end() {
  echo '</section>';
}

Asegurarse que los tags matcheen con los que usamos en nuestra plantilla. Sino estamos seguros de que clases o IDs estamos usando miramos page.php para confirmar los tags elegidos.

Declaramos el soporte para WooCommerce

Una vez que nuestra plantilla soporta WooCommerce funcionalmente, deberiamos declarar esto en el codigo para ocultar en el Dashboard el mensaje que sale de que nuestra plantilla no tiene soporte para WooCommerce. Esto lo hacemos agregando el siguiente código en functions.php.

add_action( 'after_setup_theme', 'woocommerce_support' );
 function woocommerce_support() {
 add_theme_support( 'woocommerce' );
 }

Hacer Podcasting con WordPress

Tags : 

Hacer Podcasting con WordPress

Para realizar podcasting con WordPress existen varias alternativas. Vamos a mostrar una de las más faciles de realizar y configurables por cualquier usuario. Necesitamos instalar el plugin Seriously Simple Podcasting. Una vez activado el plugin pasamos a la parte de la configuración.

podcast1En la pestaña general podemos setear algunas configuracines extras. El plugin generará un nuevo tipo de post en donde podemos ir cargando los nuestros.

podcast2En la segunda pestaña completamos con el titulo y el subtitulo que queremos. También agregamos el autor de acuerdo a nuestro gusto. Necesitamos si o si seleccionar una categoria ya que sino despues itunes no nos va a reconocer el podcast para su distribución. Las demás opciones las vamos completando de acuerdo a la información que le querramos añadir.

podcast3 En el tab de seguridad yo aconsejo dejarlo como está, ya que si le agregamos seguridad los lectores de rss no lo van a leer y nos vamos a ver perjudicados si lo que queremos es que se masifique su uso. Es altamente aconsejable completar la información si queremos mantener una privacidad en nuestro podcast.

Las ultimas dos secciones de configuración las podemos dejar como están.

podcast4 podcast5

 

Despues lo que tenemos que hacer es ir a itunes, File >> Subscribe to Podcast y agregar la url que nos devuelve el plugin. Deberia ser algo parecido a http://www.example.com/feed/podcast en donde deberias reemplazar example.com con el nombre de tu dominio. Una vez realizado esto buscará el feed y lo mostrará. Si todo está bien estás listro para enviar el feed a iTunes.

Para submitear el podcast to iTunes, tu necesitas bajar e instalar la ultima version de iTunes en tu computadora. Despues, lanzar iTunes y hacer click en la tienda de iTunes (boton arriba a la derecha de la pantalla).

iTunes accederá a la tienda. Hacer click en el menu Podcasts, y entonces bajar un poco hasta encontrar la version de links rapidos podcasts. Deberias ver un link para enviar un podcast.

submit-podcast-itunes

Esto abrirá el proceso de enviar un Podcast. Necesitarás un Apple ID para enviarlo al directorio de iTunes. Si no estas logueado, iTunes te mostrará el login para hacerlo.

La primer cosas que necesitarás es la URL del feed. Debería ser algo asi http://example.com/feed/podcast

Dado de que estas usando un plugin, tu feed necesitará incluir tags requeridos por iTunes para podcasts.

Despues de enviarlo, iTunes lo encolará para revisarlo, si es aprovado por iTunes, este aparecera en el directorio de iTunes y serás notificado via email.

 


Solución a Redirección de páginas de primer nivel

Tags : 

WordPress muchas veces nos trae inconvenientes que son difíciles de diagnosticar sin tener en cuenta la forma de que se realizo el theme. Para eso tenemos que tener en cuenta muchas consideraciones y es en base a eso que vamos a comentar las soluciones a las redirecciones de paginas de primer nivel.

No se hablará de todo lo relacionado a redirecciones ya que es un tema muy profundo y no es el objetivo de este post.

Cuando nos encontramos con que las redirecciones de wordpress funcionan correctamente pero solo en ciertas paginas/posts tenemos que tener especial cuidado de los plugins que tenemos instalados.

En nuestro caso nos pasó que las paginas linkeaban correctamente cuando estas eran hijas de alguna otra. Pero cuando queríamos acceder a paginas de primer nivel la redirección iba directamente al home.

Los pasos que se hicieron para encontrar la solucion fueron los siguientes:

  • Cambiar a algún template default para ver si el problema persiste. En nuestro caso el problema era el theme propiamente dicho.
  • Habilitar el debug en wp-config para ver si aparecía algún nuevo error.
  • Verificar que functions.php este bien escrito y sea 100% acorde a los standares de wordpress
  • Prestar especial atencion a los custom post types y custom taxonomies generados en functions.php (https://codex.wordpress.org/Function_Reference/register_taxonomy)
  • En nuestro caso el error se dio porque registraban una taxonomía que era reservada para wordpress (year)
  • Cambiando esto y regenerando nuevamente los permalinks se soluciono el problema

Espero que la solución dada le sea de utilidad a algún desarrollador mas.


La importancia de las redes sociales

Tags : 

Al día de hoy las redes sociales han cobrado mucha importancia, y han adquirido un valor fundamental en nuestras vidas. Antes cuando queriamos conseguir trabajo con el CV bastaba y uno no necesitaba tener otra cosa organizada y bien redactada. Con la llegada de estas redes esto ha cambiado; hoy por hoy los encargados de recursos humanos miran mas allá de un CV y ponen especial énfasis en las redes sociales. Es por eso que la importancia de las redes sociales es un tema que hay que tratarlo con cuidado y tratar de sacar el mayor provecho posible a todo este nuevo sistema.

Empecemos por casos concretos: se ha sabido de gente que no las han contratado por tener fotos en donde aparecían en mal estado o donde publicaban posts/tweets desafiantes y con un lenguaje no acorde a un profesional. Es así y hoy tenemos que tener mucho cuidado en las cosas que publicamos si queremos que una empresa nos contrate; sino tenemos que tener mayor cuidado a la hora de saber quien puede ver eso. Si solo nuestros amigos o todo el mundo.

Mas allá de eso las redes sociales han cobrado mucha importancia a la hora de mostrar nuestros desarrollos, como así también la unión de todas estas para que juntas puedan tener un beneficio aún mayor. Para ello tenemos que estar al día de las nuevas redes sociales que van cobrando protagonismo en esta carrera que tienen para ver cual es la mejor. Existen 5 redes sociales que no las podemos dejar de lado y estas son

  • Linkedin: Red social para profesionales principalmente donde nuestro CV esta online y podemos contactarnos con gente que tienen nuestros mismos intereses.
  • Facebook: La mayor red social en donde se comparte todo. Podemos profesionalizar nuestro perfil y adecuarlo a lo que queremos mostrarle a nuestros clientes.
  • Twitter: La mayor red social de microblogging. Está cobrando mucha importancia debido a su fácil uso y eficiencia.
  • Pinterest: Nueva red social, la cual está basada en imágenes. Ideal para nuestro portfolio.
  • Google+: La red social de google, en donde tenemos muchísimas opciones para compartir, todavía no esta teniendo el éxito que todos creíamos iba a tener.

Me puedo estar olvidando de alguna pero es imprescindible que a la hora de crear nuestros perfiles podamos conectarlos y entre todos obtener una valiosa herramienta, para así poder captar mayor cantidad de clientes. social-networking-users-SeoCustomer3 Estos datos son basados en consultoras en donde informan de la cantidad real de usuarios de estas redes sociales. Podemos estar de acuerdo o no en la importancia de estas redes sociales, pero estas llegaron para quedarse por un buen tiempo y no podemos desaprovechar esto a la hora de crear nuestro perfil y de no integrarla entre ellas. En otros posts hablaré de como integrar todas estas redes sociales y sacarle nuestro mayor provecho a la hora de desarrollar un producto o armar nuestro CV y dejar público aquello que realmente queremos que se vea.

Consejo para desarrolladores: Ofrecerle a nuestro cliente la forma de integrar estas redes sociales a vuestro sitio y sino tiene ninguna red social ofrecerle un combo en donde su negocio se beneficiará con el uso de estas. Hoy existen herramientas para integrar todas estas redes sociales y poderlas manejar desde un mismo lugar.


Agregar posts manualmente en wordpress

Es de común pedido por parte de los clientes el agregar varias clases de posts en una misma página. Para ello se utiliza la sentencia “query_posts($args)” o sino “$query = new WP_Query($args)” donde “$args” son los argumentos pasados a las funciones wordpress para estas queries o consultas. Pero esto suele tener algunos inconvenientes y a veces necesitamos agregar posts manualmente en wordpress.

También se suele utilizar algún orden específico, fecha, id, custom field, etc; pero desde hace un tiempo se utilizan algunos plugins para ordenarlos en forma manual, el cual utilizan “drag & drop” y así le dá al usuario un nivel mas de customización.
Pero estos plugins por lo general agregan funciones y filtros que pueden bloquear algunos ordenes utilizados en otros lugares.

Es por eso que es siempre útil conocer la sintáxis de wordpress a la hora de realizar queries manualmente. Es algo tedioso tener que usar queries manuales ya que si en alguna actualización de wordpress cambia la base de datos esto dejará de funcionar. Pero esto nos puede sacar de un apuro en caso de que un cliente asi lo requiera.


global $wpdb;
global $post;
 $querystr = "
    SELECT * 
    FROM $wpdb->posts
    WHERE $wpdb->posts.post_status = 'publish' 
    AND $wpdb->posts.post_type = 'sponsor'
    ORDER BY RAND()
	LIMIT 4
 ";
$pageposts = $wpdb->get_results($querystr, OBJECT);


  if ($pageposts):
   global $post; 
 foreach ($pageposts as $post): 
     setup_postdata($post); 
 the_title(); 	

endforeach;
endif;

>

Como vemos en el ejemplo lo que estamos solicitando es obtener 4 posts random que sean del custom post type “sponsor”. Despues mostramos solo el título como ejemplo pero podemos mostrar lo que quisieramos.


Logo Wordpress

Experiencia WordPress

Tags : 

WordPress es uno de los CMS que más se ha desarrollado en los ultimos 2 años. Esto se debe a su excelente calidad y a la facilidad de crear nuevos sitios en poco tiempo.

Particularmente yo empece a usar hace algunos años ModX pero debido a la dificultad que presentaba el sistema, los clientes fueron preguntando sino existia una forma mas simple de crear contenido y demás. Cabe destacar que modx es muy potente y se pueden hacer cosas realmente geniales.

Logo WordPress

Fue ahí cuando empecé a usar wordpress. Al principio fue creado solo para blogs, pero dada la facilidad que tenía la gente de escribir contenido, este empezó a obtener popularidad y la demanda de sitios con wordpress fue creciendo.

En ese momento fue cuando el equipo wordpress empieza a agregarle funcionalidad al CMS, y el mundo del desarrollo comenzó a crear plugins y themes con mas funcionalidad. Actualmente estamos en la version 3.5 y cada vez estan largando versiones mas rapido. Para fin de año la version 4.0 estaría con nosotros ya.  (No puedo imaginar todo lo que le pueden llegar a agregar, ya que esta bastante bien ahora).

El gran punto flojo en wordpress es que al haber tanta gente escribiendo plugins y demás, y no todos escriben código de la misma forma ello se torne tedioso en cuanto a la compatibilidad de varios plugins instalados en un mismo sitio.

Varias empresas están empezando a contratar gente con experiencia en wp, ya que si bien es un CMS y no es complicado, uno necesita de experiencia a la hora de diseñar la programacion del mismo. Uno se tiene que sentar a pensar y sacar conclusiones de cuál sería la mejor forma de encarar un wordpress.

Hoy hay muchas diferencias entre un sitio wp bien desarrollado y uno que se empezo a codificar desde el principio. Los casos mas notorios se dan cuando uno tiene un sitio web en donde usamos los post con categorias para todos y eso se puede cambiar tambien por custom post types con taxonomias.

Otro punto a la hora de desarrollar un sitio es que tenemos que pensar si vamos a tener usuarios con distintos roles. Esto tiene que ser bien pensado de antemano y no ir probando varios plugins, ya que despues la facilidad de uso despues se puede ver opacada.

Wp tambien sirve para tiendas online de todos los tipos, hay varios plugins para ello, algunos mas potentes que otros; igual para mi esta parte todavia no esta bien madura con los plugins que hay actualmente. Algunos plugins se están desarrollando y en breve van a estar online para el uso de estos.

WordPress es hoy sin lugar a duda el mejor CMS en cuanto a flexibilidad, facilidad de uso y costo. Por eso es que cada vez mas gente esta girando hacia este CMS, aprenderlo y poder ofrecer sus servicios. Muchos desarrolladores lo ven con malos ojos al tener un sitio web con un CMS armado y no a medida, pero para sitios de chicos a medianos es una buena opción. Con el agregado de plugins wp puede ser una herramienta altamente calificada a la hora de realizar sitios webs.


Introduccion Css

Tags : 

El nombre hojas de estilo en cascada viene del inglés Cascading Style Sheets, del que toma sus siglas. CSS es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML2 (y por extensión en XHTML). El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores.
La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación.
La información de estilo puede ser adjuntada como un documento separado o en el mismo documento HTML. En este último caso podrían definirse estilos generales en la cabecera del documento o en cada etiqueta particular mediante el atributo “<style>”.

CSS tiene una sintaxis muy sencilla, que usa unas cuantas palabras claves tomadas del inglés para especificar los nombres de sus selectores, propiedades y atributos.
Una hoja de estilos CSS consiste en una serie de reglas. Cada regla consiste en uno o más selectores y un bloque de estilos con los estilos a aplicar para los elementos del documento que cumplan con el selector que les precede. Cada bloque de estilos se define entre llaves, y está formado por una o varias declaraciones de estilo con el formato propiedad:valor;.3
En el CSS, los selectors marcarán qué elementos se verán afectados por cada bloque de estilo que les siga, pudiendo afectar a uno o varios elementos a la vez, en función de su tipo, nombre (name), ID, clase (class), posición dentro del Document Object Model, etcétera.4
Abajo puede verse un ejemplo de una parte de una hoja de estilos CSS:

selector [, selector2, ...] [:pseudo-class][::pseudo-element] {
propiedad: valor;
[propiedad2: valor2;
...]
}
/* comentarios */

Debido al avance de los distintos navegadores webs al principio las reglas eran limitadas, pero esto se fue solucionando con el advenimiento de nuevos browsers con mayor poder de procesamiento. Es por eso que en estos momentos (2012) vamos por la version 3 de css.

En los siguientes articulos iremos agregando recomendaciones a la hora de desarrollar un css. Hay ciertas pautas y reglas que uno debe cumplir para que el diseño de la pagina web sea cross browser (visible de la misma forma en la mayoria de los browsers conocidos).

Fuente: http://es.wikipedia.org/wiki/Hojas_de_estilo_en_cascada


ShortCode Widget: gen_wops_onepage_shop_cart ShortCode Widget: wp_colorbox_media url="http://marioblock.com.ar/carrito-lightbox" type="iframe" hyperlink="Carrito"

Explorar el mundo y ser audaz es nuestra mayor fortaleza