Tag Archive: plugin

Redirect old Permalink Structure in WordPress

WordPress Tips

Update: It appears that as of WordPress 4.4, the old permalink structure is automatically redirected to the current permalink structure. This article is for older version of WordPress.

By following this article on WPExplorer in the “Using the Simple 301 Redirects Plugin” section, you can redirect the URLs from the old permalink structure to the new ones one by one. However, this method doesn’t work if you want to redirect all of old links from other sites to your current permalink structure. For example, from example.com/2015/04/16/sample-post/ to example.com/sample-post/, unless you want to accept the hard work of entering all of the redirections by hand, which could contain thousands, even millions of URLs on your site.

Unfortunately in the mentioned article, the following instruction is not correct while adding the new redirection:

The Request field is the WordPress configuration for the Month and Name permalinks while the Destination field is the WordPress configuration for the Post name permalink structure.

Below are the correct values which need to be entered in each of these two fields:

Request field: /([0-9]+)/([0-9]+)/([0-9]+)/(.*)?$
Destination field: /$4/
Use Wildcards: check

The Request field is a regular expression. It means that there needs to be numbers in all characters in the first three slash pairs, and any characters after the last slash.

The Destination field is a reference variable to the last block of regular expression from the Request field, which is the fourth block. One block is determined by a pair of parentheses.

The Use Wildcards checkbox needs to be checked in order for the plugin to be imported to WordPress as a redirection statement containing regular expression.

For more information on the URL regular expression, you can read “An In-Depth Guide to mod_rewrite for Apache” where the above statements are inspired from.

You can also use a redirect WordPress plugin other than Simple 301 Redirects, which hasn’t been updated for the current WordPress version yet as of this writing. I’m using Redirection which supports the newest version of WordPress. The above settings are pretty much the same except the wording is different. For example, the Request field in Simple 301 Redirects is called “Source URL” in Redirection, etc.

Please leave a comment below if you have problem configuring the specific redirection plugin.

Modifying Woocommerce Templates within a plugin


Woocommerce template files are located in wp-content/plugins/woocommerce/template, and can only be accessed within a theme or a child theme. However, in order to preserve the original data on the site, the solution to access the templates through a plugin must be found.

Fortunately, there is already an existing code that can do exactly that. Here is the original unmodified code copied from the mentioned article:

In case you forgot what’s included in the templates or you are just learning to modify the Woocommerce templates, you can copy the entire templates directory under wp-content/plugins/woocommerce/ to the woocommerce subdirectory in your plugin’s folder. That way, you will know which file is related to which part of Woocommerce generated page without moving back and forth between woocommerce plugin’s folder and yours.

Is this function ever useful to you? Do you prefer to use Woocommerce templates within a custom/child theme or a plugin? Discuss in the comments section below.

Why create a WordPress Plugin instead of a Child Theme

Plugin vs Child Theme

Lately there is a debate about data portability in WordPress community. Normally I don’t care about this type of discussion on WordPress, until I had a client that uses a theme which contains too many custom post types. On top of that, their old coder modified the theme directly in the theme files without creating a child theme as well as modifying original plugin files.

At beginning of the project, I created a child theme to see if it works fine with the current theme. During that time, I don’t know what’s the fuss about data portability. Perhaps because of my ignorance about this concept, most of the theme-related data was lost in the frontend when switching to the child theme.

I warned about the data loss due to theme change to the client. However, I decided to switch back to the parent theme and stick to it for the rest of the project since the client mentioned that the previous coder already modified the original theme.

At that time while struggling to think of a way to modify the styles without modifying the original theme files despite they were already modified, I remembered the concept of data portability.

Data portability, to me, means to retain the already existing data (such as an installed theme with populated data), manipulating them and adding the new data on the site. It basically is a plugin to add a new layer to the site for adding extra features.

So my WordPress plugin development journey for the client’s website began. This actually was my first very own plugin. Before that, I never wrote a plugin from scratch, just edited someone else’s plugins.

At the beginning, I created two files besides the plugin’s main PHP file: style.css and script.js, and added them to the main PHP file using enqueue_scripts function and hook. The style.css was used to change the look of the site, and the script.js was used to modify the content on the site. I know that I can use add_filter function to modify the content. However, I didn’t know much about the add_filter hooks at that time. Later, I added some more files to the plugin based on client’s requirement.

In conclusion, here are the reasons why you should choose to write a site-specific plugin instead of a custom theme: a large amount of data already populated within the current theme and you don’t want to import duplicated data into the child theme, data created using the plugin will transfer to the new theme whenever the client decides to switch theme. However, there are sometimes that a child theme is better for the site, such as a new site or theme that doesn’t have any theme-related data yet, a simple (no custom post type and no option) theme, and a theme framework such as Genesis Framework.

What do you think? Which is better for a site-modification project, a site-specific plugin or a child theme? Discuss in the comments section below.

Some WordPress Dev Tips

WordPress Plugin

While reading this post from Tusplus, the first two tips immediately cached my eyes, which are “don’t start too big” and “study existing code”.

Start Small

The first tip, “don’t start too big”, describes best about me. When I think of some ideas, most of them are pretty big. For example, creating a gamification plugin which users can get a reward by listing their websites in front page of the blog. Because of these big ambitions, I haven’t even begun to study the basics of WordPress plugin development. I don’t know where to start and afraid of failing.

This is a great advise for me as I won’t feel scared of failing on small projects. If you are like me, I recommend to either do small unrelated projects first to learn about the basics of WordPress development, or separate one of your big projects into several smaller projects and start from the most basic or easier ones.

Study existing WordPress Plugins

When I first read about the second tip, which is “study existing code”, I thought that this never worked for me as I read the plugins from WordPress plugins repo and I didn’t understand most of them. The problem for me is that, just like the first tip, I tried to understand each single line of code. After a few tries of reading the code, I gave up because either I can’t find the specified function definition which appeared at the beginning of the code, or I’m overwhelmed by the amount of code the plugin has.

Pick one aspect of WordPress, say the login screen, and look for part of the code in the WordPress source.

This tip tells you once more to think small at a time. While using a plugin, you might find an interesting part and want to know how is done. When you are reading through the code to find the portion you are interested, it’s best to only focus on this, limit yourself not to care about other parts of code. When you are done backtracking the function(s) you would like to learn and learned how it’s done, you could begin to learn the next interesting part of the plugin you found.

The above two tips inspire me to think small instead of big. What do you think of these two tips on WordPress development?

Menu Icons WordPress Plugin Tip

Menu Icons

Menu Icons is a WordPress plugin which adds icon support to the menu items on the front-end of your site. Here is a tip I found during the setup of Menu Icons.

If you recently changed the theme, the menu you set up in the previous theme will only partially transfer to the new theme. That means the current menu in the new theme maybe the same as the old theme, but the menu is placed under a temporary name.

You need to re-setup the menu in the Appearance > Menus by entering an unique menu name for the current menu and click Save Menu button. If you setup a menu icon without clicking the Save Menu button first, the submit button in the Menu Icons dialog box won’t be enabled.

By looking through the console log, it appears that there is an error related to the “replace” JavaScript method for the Menu Icons plugin if you haven’t saved the menu yet. It means that you can’t use the plugin to setup the icons for the menu items until you saved the menu.

After the menu has been saved, the plugin should work normally.

Please leave a comment below if you still have problems with this plugin.

My First Static WordPress Plugin (Updated)

Update: I’m no longer using identi.ca ever since I swtched to Mac. The identi.ca service also seems to be no longer active.

After almost 3 hours of researches and trials, I finally finished the first one-page WordPress plugin called “identi.ca reminder”. As the name suggests, it’s used for reminding me to post an update whenever I added or updated a blog post. Since identi.ca (http://identi.ca/) also posts updates automatically to Twitter and Facebook, I only need to update the status for my identi.ca account. And because the lack of the good identi.ca-related WordPress plugins, I decided to manually update the status once a blog post is added or updated.

This was the first time I began to learn WordPress plugin. Thanks to the detailed documentation on the WordPress Codex wiki, I was able to learn and create the plugin at the same time. Here is the whole source code for my basic plugin (also includes very detailed comments):

Note that when I wrote and tested this plugin, the “messages[‘post’]” array cannot be changed partially. The only way I can change the value is to copy the modified value to a new array, then make the structure of the new array the same as messages’. For instance, I tried to do the following in the code above:

It seems that without this format, the add_filter function would not be executed. As the above example shows, it just applies to the “post” post type, although I have not tested it with custom post type yet.

You can download the source file here.

Below are the resources I used to help me for creating this plugin:

Animate Objects along Paths using jQuery Path Plugin

jQuery Path plugin animates an HTML element along a specified path, much like Flash motion guide layer. The path can be a curve or a line. You can see a demo on this page and checkout its source code. According to the source code, the syntax for this plugin is integrated to the jQuery animate function:

$(“#div”).stop().animate({path: pathType}, time_in_millisecond);

One disadvantage of using this plugin that I’ve found is that there is no pre-set path type. Fortunately, the plugin documentation explains how to create bezier and arc path, as well as custom path types.