Archive for July, 2009

Mostrar las entradas de wordpress en otra página fuera del blog

Thursday, July 23rd, 2009

En este  tutorial les voy a mostrar una manera muy sencilla para poder importar a una página externa los contenidos desde  nuestro blog. En este ejemplo vamos a suponer que tenemos un dominio www.su-dominio.com/  En este dominio tenemos alojada la página web principal donde queremos mostrar por ejemplo la última entrada de nuestro blog que se encuentra a su vez en otra subcarpeta bajo el mismo dominio. La ruta de nuestro blog en este ejemplo se quedrá asi: www.su-dominio.com/blog/.

Para acceder a las funcciones de wordpress desde una página externa debemos empezar con en el archivo ¨wp-blog-header.php file¨. Este archivo es el responsable para mostrar los contenidos de wordpress. Una vez este incluido dicho archivo en cualquier página de nuestro sitio web tendremos acceso a las funcciones de wordpress para mostrar los differentes contenidos del mismo.

Una cosa muy importante que hay que tener en cuenta es que esta técnica se puede aplicar solo a páginas con la extencion ¨.php¨. Vamos por ejemplo a mostrar el contenido de las tres útimas entradas de neustro blog, www.su-dominio.com/blog/,  en la página principal de nuestro sitio web, www.su-dominio.com/.

1 – el primer paso es copiar el seguiente código y pegarlo en la parte superior de la página en la que queremos mostrar las últimas entradas del blog.  En nuestro caso es www.su-dominio.com/index.php

<?php
session_start();
define('WP_USE_THEMES', false);
require('./blog/wp-blog-header.php');
query_posts('showposts=3');
?>

La primera linea del código hace que no se muestre el tema activado en wordpress. La segunda linea del código es para incluire el archive “wp-blog-header.php” del cual hemos hablado antés.  Y la ultima linea es la funccion que muestra las entradas del blog . En este ejemplo hemos asignado “3″ como parametro para mostrar las últimas tres entradas de nuestro blog.

2 - el segundo paso es copiar el seguiente código y pegarlo en la parte de la página donde se va mostrar el contendido de wordpress.

<?php while (have_posts()): the_post(); ?>

<?php endwhile; ?>

Como ven este código no muestra náda, porque es solo un loop vacio que ne tiene acciones para ejecutar. Ahora llega el momento para añadir las liñeas de código responsables para mostrar el contenido que queremos desde wordpress. Vamos a suponer que queremos mostrar los titulos de las últimas tres entradas con las primeras lineas del texto de cada entrada mas un vinculo de ¨leer más¨ que llevará a los articulos originales en las páginas del blog. Por ello añadimos las seguientes lineas de código dentro del loop ya creado . Ahora el codigo completo del loop debe ser algo asi:

<pre><?php while (have_posts()): the_post(); ?>
 <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
 <?php the_excerpt(); ?>
 <p><a href="<?php the_permalink(); ?>"><?php echo $h_2['more']; ?></a></p>
 <?php endwhile; ?></pre>

Guarde los cambios ya hechos y previsualize los resultados en el navegador. Como pueden ver, el truco de mostrar nuestros contenidos desde wordpress es bastante sencillo. Esta tarea se puede complir de otra manera a traves de RSS feed aunque esta última alternativa se limita  a importar solo los titulos junto con sus contenidos.

Espero que este tutorial os ha servido para hacer llegar vuestros contenidos a otras páginas fuera de vuestro  blog. Si tienen alguna pregunta o comentario no duden en usar el formulario de abajo.

Change the default gravatar image in wordpress

Thursday, July 23rd, 2009

All of us may have noticed that worpress automatically assigns a default image to those posts or comments that don’t have a customized gravatar attached to it, Usually the automatically assigned image is a gray silhouette that may no fit the look of your well designed website. Have you ever wondered if this silhouette can be changed for a better image or even a customized one?

Well wordpress provides the possibility of choosing one of the six gravatars that are installed by default with your wordpress theme. You can choose one of the available gravatars by logging to your wordpress admin panel then on the left side of your pannel go to Settings then click on Discussion Now you should see the gravatar options you may want to select one of them and then Save changes to activate it.

So far good, but what if you don’t like none of those options that already ship with wordpress. Well, It is quite easy to add a customized gravatar to the existing list. The trick is to add a small chunk of code to the “functions.php” page that you may find in your active theme folder. In case this page dosen’t exist go ahead and create one and name it “functions.php”. Now here is the code we need to place in that page.

if ( !function_exists('fb_addgravatar') ) {
function fb_addgravatar( $avatar_defaults ) {
$myavatar = get_bloginfo('template_directory') . '/images/gravatar.png';
$avatar_defaults[$myavatar] = 'No Gravatar';

return $avatar_defaults;
}

add_filter( 'avatar_defaults', 'fb_addgravatar' );
} 

Basically what all this code does is to make available another option in the list of default gravatar. In order for this to work you have to make sure that a correct path to the new gravatar image is assigned to the variable “$myavata”. It is possible to host your new gravatar image in your sever and point to it using an absolute path or you may just want to use one of your gravatars in the gravatars website and point to it from your “functions.php” page.

In the following image you can see how does the gravatar list look before and after adding a customized gravatar.

I hope you find this tutorial useful and I encourage you to leave your comments and opinions in the form below. And if you think there is a better way to do it please let  us know.

How to display code In WordPress Posts

Sunday, July 19th, 2009

Sometimes it is very important to be able to display chunks of code in your posts so as to provide examples or solution for your readers. However this task requires extra work and more pacience since you will have to use character entities to replace all the <> brackets with its corresponding signs. Imagine that your blog is all about coding tutorials it will be too uncomfortable and time consuming to do all the character entities manually. Luckyly if your blog is powered by wordpress there are several plugins that can do the task automatically for you. All what you are gonna need to do while writing or editing your post is to put the code, you want to disply for your readers, between the following tags . And the rest will be taken care of by the plugin in question.

1 – download the plugin from here: wp-codeshield
2 – upload the containing folder to your plugins folder
3 – You will need to login to your wordpress dashboard and activate the plugin
4 – Make sure you enclose between code tags all the code you want to display

In case you need something more elegant and interactive, you might want to install a different plugin for example the SyntaxHighlighter Evolved. This plugin can be used to highlight more than 15 programming langages and uses separate syntax files called brushes to define its highlighting functionality. This plugin comes with step by step setup information.

Well, I think tha is all for now. All your comments and questions are welcome.

How to add a favicon to your wordpress blog

Sunday, July 19th, 2009

Yesterday I recieved an email from a guy asking how I placed my logo on the left side of the address bar. Then I relized that he meant the favicon. Well first of all lest’s explain what does a favicon mean. A favicon is the abreviated term of “favorites icon”. This icon should be unique and most of the times reflects the logo of the website it is asociated with.

Once a favicon is assigned to a website it shows in various locations of the browser. For example you may find it in your bookmarks list if the site in question is already bookmarked, in the left side of your browser’s tabs, in the left side of your navigator’s address bar and may be diplayed as well by many feed readers programs.

1- How to create a favicon?

You can design your favicon using any graphic software. If you are using photoshop you might need to install a plugin that will permit you to save in the ICO (Windows Icon) format. this format garantizes the visiblity of the favicon in the majority of the existing browsers. The plugin can be downloaded from here. Once designed you should resize your favicon to 16px X 16px. If for some reason you can not design it by yourself you may opt for other free solution online and get your favicon in few clicks away. There are several utilities online that offer the possibility of generating a favicon by uploading the image you want to appear on your favicon, and in few seconds you will be shown a link from where to download your new favicon. The following links provide this utility. Try all of them and bookmark the one you are comfortable with.

chuano.net
genfavicon.com
herramientas.recuweb.com

And in this link favicon.cc , apart from generating a favicon from an image they also offer you the possibility to draw and download it on the fly.

2- How to add a favicon to your site?

Adding a favicon to your websites pages is a very simple task. First you need to upload the favicon to the root of your server. Second you wil have to copy and paste the following code between the head tags of all the existing xhtml pages of your website:

<link rel="shortcut icon" type="image/x-icon" href=" http://www.your domain.com/favicon.ico" />

Make sure to change the path that points to your favicon location. Save and load to the server, refresh your browser and that’s it! if you could not see your favicon it is because the path to its location is not correct or the extention is not a “.ico”

3 – How to add a favicon to your wordpress blog.

Adding a favicon to your wordpress blog is fairly simple. First, copy and paste your favicon into your active theme directory. Second, You will need to modify the following file header.php This file is located in http://www.your domain.com/blog/wp-content/themes/your active theme/. Once there, open it in a text editor then copy the following line of code and paste it in between the head tags:

<link rel="shortcut icon" href="http://www.your domain.com/blog/wp-content/favicon.ico"  type="mage/x-icon" />

Again it is very important to check if the path points correctly to where your favicon resides, save your header.php file and upload it to the server together with the favicon.

I hope that this would be useful for you Mike and for all of who want to personalize your website with a unique favicon. If you have any further questions or comments, please do let me know.

Manage all your emails in one gmail account

Saturday, July 18th, 2009

Sometimes you may  have to use various email accounts for various reasons.  However it is very uncomfortable to login to each account individually to check the coming emails. Personally I have six different emails. Some of them are under my domain names and the rest are Gmail , hotmail and Yahoo accounts. Thanks to the new Gmail functionality of adding external email accounts I can  check all these  accounts by logging just to one of my Gmail accounts.

There are two different ways to recieve your domain based mail in your Gmail account:

The first one is to forward your domain mails to your Gmail account or to any ather free mail account. This task of forwarding is supported in major hosting services and you can reach that feature through the control panel provided by your host. Opting for this solution you will get a copy of all those emails sent to your domaine emails.

The second way is to enable  your gmail account  to import your domain based emails. To do that, login to your gmail account then click on the settings link in the top right corner of your Gmail account. then choose accounts and in the seccion recieve maessages from other accounts click on Add Another Email Address, imeadiatly a small window will pop up . Add your  domain based email and click on next step. Now another window will open asking for your domain based email and some other stuff, make sure to introduce all the details and in the end click add account. That´s it, If everything is done correctly, you will be able to reach your domain based email messages through your gmail account. Now you have two accounts in one, following the same steps you can add up to five external accounts in your gmail account.

What else? when sending email from your google account you may want to provide your contacts with a specific replay email. Well in gmail it is fairly easy,  Whenever you compose a new email  you will have all your added emails in a drop down menu just choose the email you want for a given purpose or adresse. Your contact will only recieve the assigned email address with the message.

I think that’s all. if you have any comments or questions just drop me a line in the form below, and I will get back to you.