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…

Creating a tree-type index of pages or TOC using wp_list_pages function

WordPress has the hability to works with nuclear posts and also with posts that can contain posts, ie, posts with hierarchical structure. Today we’re going to see how to create an list of the second ones, as an index of pages, Table of contents (TOC), etc.

Panzerbaum

As default, WordPress supports two different kinds of elements: posts and pages. The basic difference between them is that the first ones, are treated as individual elements, organized in a long linear list of elements (like the natural numbers 1, 2, 3, 4, for example) meanwhile the second ones have got a hierachical structure, ie, each element can contain elements that have also got hierarchical structure. Continue reading…

Creating WP help tabs in admin, plugins or themes pages

WordPress has got a help manager very simple, just a couple of functions, so you can easily use it for creating help screen for your own developements. Learn you step by step how the WP help manager works, and how to use it.

Creating WP helps for your plugins and themes

But before beginning to create our own WP help pages, first we should see the internal structure of the WP help manager that, basically has just got two modules. Continue reading…

Selective enqueueing of WordPress scripts and styles through conditional loading

Both in front and back end, WordPress themes and plugins usually enqueue styles and scripts; the real cornerstone of the our work. Security systems, communications, silent or programmed operations, intelligent data process… Most of these common operations have in their backgrounds the loading of scripts and styles. Today we’re going to see how design a selective loading of these components.

Big, big tires

Habitually, the loading of scripts and styles is made by themes and plugins through the functions.php and the /root-plugin-folder/plugin-name.php files respectively. In both cases, usually there is (are) a little function in these php files that programmes the loading of all of these essential components. 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…

Checkbox fields in WordPress Metaboxes a solution for NULL values

Talking about forms, one of the most common issues is that checkbox fields don’t return any value when they are not checked. We just receive their values -usually TRUE- when they are checked but if they are unchecked they ‘say’ nothing. What can we do?

Checkbox fields in WordPress Metaboxes a solution for NULL values

This behavior of checkboxes fields is not an error, long time ago they was designed in that way (they are silent) however, in most cases,  this behaviour is a problem because the lacking of value doesn’t allow developers to know whether there is not actually a value, or if the value is actually FALSE. There is not difference between NOTHING and FALSE so Continue reading…

How to add a Metabox. A step by step approach. add_meta_box

The WordPress posts edit Tool is not an unique compact module that shows all the boxes that appear on the screen but it’s a set of different little modules –called metaboxes– working together. A little module controls the title, another one controls the visual editor, another one defines the publishing options and actions, another one is for the Post Format… the Categories, the Author’s post, etc. The reason of this modular design is to allow developers to introduce easily new boxes (or remove some ones) in the Edit Screen.

The Edit Screen of Posts and its different Metaboxes

So thanks to this modular design, we can create our metaboxes for adding new functionalities or data to the WordPress Posts Continue reading…

Using wp_add_inline_script function. A Google Analytics example.

Until version version 4.4, in WordPress, there was only one way to add script files to the WordPress themes, the function wp_enqueue_script however, the new version 4.5 has introduced a new way, the function wp_add_inline_script that allows us to add javascript text scripts directly inside a template and that, in addition, it can be directly connected with other scripts. Let’s go to see how it works.

Example of using the wp_add_inline_script function

At bottom, this new function wp_add_inline_script is the equivalent for scripts files, to the wp_add_inline_script function is for CSS files. Let’s see how it works through and example based on adding the Google Analytics script to a WP theme. Continue reading…

How to move jQuery script to the Footer

As default, WordPress actions put the jQuery scripts in the header of all HTML pages however, sometimes it is necessary to move these scripts to the footer of the page but a simple movement is impossible. As jQuery script (and dependents) is defined by WordPress during the first steps of its loading, when you try to redefine later its output through wp_enqueue_script( ..., $in_footer TRUE ) or similars, you haven’t got any result.

Designing a new feature, with jQuery!

There are some methods to make this change, some more risky, others more conservatives. Today, I’m going to show two methods very simple and quite conservative based on Continue reading…