How to create an AJAX call in WordPress step by step

WordPress essentially works thanks to PHP language that gets the requests from users and admins, processes these requests and finally constructs the results as HTML pages, ie, PHP sends to you the pages that you see in the browser. Request, process, results; it’s simple. Sometimes however, you need control some elements of the screen after the HTML page has been sent and displayed: a special message on the screen after a checkbox has been checked, the change of an image depending on a select field, etc. and you don’t want to make a new request again. You want that these little elements change on the screen without repeat the whole process of request, process, results… In these cases you need to use the AJAX technique.

The first historical reference to AJAX technique (Roman Villa at Halicarnassus, 4th century AD)

Beyond this more than dubious historical reference of the previous illustration 🙂 , AJAX is a technology of developement supported by javascript and designed precisely for doing these kind of tasks, ie, to comunicate the client site to the server side silently, without a complete requests, just with the execution of a concrete funcion or module on the server side with a few concrete results. Continue reading…

Using Post Formats with your custom WordPress Post Types

Since versión 3.1, WordPress introduced a new theme feature called Post Formats that, basically, allows us to divide a regular WordPress Post Type in subsets based on the nature of the information that a post includes, ie, you can have regular posts, but you can also have posts that specifically contain a video, or an image, etc. In case of the Post Type post, most of the popular WP themes already includes support for styling its Post Formats but, what can we do for using Post Formats in case of our custom Post Types?

macarons

The proposed method is quite easy and it simply extends the habitually used technic for dealing with Post Formats inside WordPress templates, in other words, we’ll create a refined system for loading the content-{$post_format_slug}.php subtemplates. Continue reading…

Strategies for URL redirection in WordPress front-end pages

I know that is not a common situation but sometimes it’s necessary to redirect the current page to another URL. Inside WordPress back-end is relatively simple but from the WordPress front-end templates that shows the Posts, Pages… It’s a little more complicated.

Change direction

In this article we’ll see some strategies for redirecting the URLs, all of them based in using the WP function template_redirectContinue reading…

Using Social Icons -socicon- Font

More or less a week ago, we was talking about the font genericon, principally for constructing wonderful social menus. Genericons is a good font but if you need really add a lot of social profiles, it’s probably that you don’t find the most unknown or inhabitual profiles. If this is your case, your icons font is Socicon Font.

Using Social Icons -socicon- Font

SocIcon font is a very good font that includes more that one hundred of social profiles icons: the most known that you probably can find in any other icons font but also the most unknown, rare… So, it’s actually a good options if your website has a strong social character.Continue reading…

Examples of adding fields to WordPress Metabox

A few days ago, we was talking about how to construct a WordPress metabox for a couple of fields, today we will extend that example with several examples of code for adding different kinds of fields.

Examples of adding fields to WordPress Metabox

The fields of a regular WordPress metabox are almost always constructed using a <p></p> HTML tag so, in general, the main structure of any field for a metabox should be like this. Continue reading…

Using the Post Type description in WordPress Themes

Sometimes, especially in the case of an items list, apart from the header/title of the list, we would want to add some text as an introduction for these items: a global suggestion, perhaps a couple of interesting links, a descriptive or in detail approach about the items, a definition, etc. When the items to list are inside a Category or a Tag, to add a header with description is obvious because, simply taking a look to the screen for editing terms, all of us know that they have a description but, do you know that post types have also got a description, and that you can use it in your themes?

An example of using the Post Type description in WordPress Themes

Yes, in the same way that with the terms of a taxonomy, WordPress Post Types have also got a field to add a description thus, you can use this property of the Post Type object to introduce any text that you want and Continue reading…

How to modify the FavIcon links of the function wp_site_icon in WordPress?

Since version 4.3 WordPress introduces the ability to add a Icon automaticly to your site through the Customizer / Site Identity module. In fact this icon is known as the FavIcon and it is based in a very fuzzy and changing specification that, in addition, depends on the devices to what the favicon is prepared for, so WordPress developers team has logically opted for an very standard HTML output for favIcons. This standard HTML output works but perhaps you want to improve, extend or adapt it to other devices or programmes that are going to read it and use it. (See the next examples).

New Gmail favicon

favicons

Favicon for the Birdies 100 blog

There are several methods for changing this HTML FavIcon output and include improved sentences for its definition, ones more radicals, ones more WordPress code friendly, but in this example I’m going to propouse one method based on the conservative approaches so I’ll use a filter instead of redefine the list of actions attached Continue reading…