Category: Web Dev Log

How to use Customize API “postMessage” Method for Color Options

customizer-color-option-postmesssage

I’m not actually a fan of themes with tons of design options. I think as a designer, it’s our job to design theme.

However, it’s not always a bad idea to let user express their creativity.

Last weekend, I create another theme. Nevertheless, a simple one with classic design. And this time I create several color options for it. Usually I prefer “refresh” transport method for my themes, because it’s works, easier to code (and maintain in the future). But because this is a simple theme, I get it done relatively quickly. So I decide to “play” and use “postMessage” transport method for the color options.

There are problems I found when implementing this, and I want to share my solution.

Here’s the theme, you can download and check the source code:

Read More How to use Customize API “postMessage” Method for Color Options

How To Remove WordPress Admin Color Scheme Option

Admin-Color-X

Well, there was a time when I need to remove admin color scheme option. And this how I do that.

I was building a complex site with several user role, and to make it easier to know which user role I use to login, I set each user role to use different admin color scheme and disable admin color option in profile edit.

It’s actually pretty simple. And I will also explain the coding process, how to learn to code something in WordPress. (I’m sure it’s pretty useful trick if you wants to learn to code/problem solving in WP). Read More How To Remove WordPress Admin Color Scheme Option

How to use Customize API “postMessage” Method to Hide/Show Element

hide-masthead-customize

That was actually a question by a fellow WordPress designer/developer when he realized his code didn’t work (I’ll explain the problem below).

It’s actually a simple mistake and can be avoided if we use “refresh” transport method when creating customizer option. But I do understand that “postMessage” transport method is better (but needed more code).

So here’s a little example. I create a twentyfifteen child theme with customizer setting to hide/show header area. Read More How to use Customize API “postMessage” Method to Hide/Show Element

How to Create Admin Notice On Plugin Activation

plugin-activation-notice-example

Adding admin notice on plugin activation can be super useful. For example we can:

  • Add link to the settings page,
  • Giving info about minimum requirement of their server,
  • Tutorial links,
  • Promote pro version of our plugin,
  • Ask the user to rate our plugin,
  • Ask donation,
  • Or simply telling them that they are awesome.

If you ever try to create an “Admin Notice” on plugin activation. You’ll know that using admin_notices action inside your “activation hook function” will not work. But there’s a workaround for that. Read More How to Create Admin Notice On Plugin Activation

How to Add Settings Section in WordPress Default Settings

Additional-Reading-Settings

It’s very easy to create settings page in WordPress. But sometimes in our plugin we only need a single/few options. And creating dedicated settings page just for this option is overkill.

That’s what I think when I write “f(x) Private Site” Plugin yesterday. You can download the plugin for a full code example:

When it make sense, we can add settings to WordPress default settings page such as “General Settings”, Writing Settings”, “Reading Settings”, etc. And this is how to do that. Read More How to Add Settings Section in WordPress Default Settings

Validation in WordPress Dashboard Widget API

WP-Dashboard-Widget-Options

WordPress Dashboard Widget API is my favorite API in WordPress and sometimes dashboard is my preferred admin page to add simple settings in client site. It’s the screen they will see when they logged in. Why not use it more?

In this post I want to share a little about how to properly save the dashboard meta box “Configuration” with the build in nonce validation.

I read a lot of tutorial but no mention about this, I don’t even find any reference in Codex page. Read More Validation in WordPress Dashboard Widget API

Windows 10 Essential Software for Web Development

windows-10-setup

So, last month I bought a new laptop. I actually bought two laptop. The first one is an Acer laptop. Use it for a week, not very happy with it. So I bought Asus.

I spent several days to set up and install the laptops. I think it’s a good idea to documented it here.

I hope this post will be useful for folks who want to do web development in windows.

Read More Windows 10 Essential Software for Web Development

Responsive Image In WordPress 4.4 (Testing, Thoughts, etc)

wordpress-4.4-responsive-image-test
Let the browser decide which image size to display !

So, I did some test for WordPress 4.4 beta3 new feature: Responsive Images. And it will make your content retina ready automatically! Awesome.

Not only that, it will also serve smaller image to low res device and it will make your site load faster to the less capable mobile device. Read More Responsive Image In WordPress 4.4 (Testing, Thoughts, etc)

How to Create Sortable Checkboxes Option in Customizer

Customizer-Sortable-Checkboxes

WordPress Customizer is a very powerful. Not only because we have a live preview, but also because it got a lot of build-in input type. And we can also extend it or create our own reuse-able input type.

This is not a full tutorial but only explaining the concept, but you can check the full working code here:

This is a useful control, we can use it for various settings for example:

  • Reorder element, such as header, navigation menu, thumbnail, excerpt, etc.
  • Sharing buttons.
  • etc..

Read More How to Create Sortable Checkboxes Option in Customizer

How To Disable WP.org Theme Update Check

WP.org is not very good (read: evil) organization. They collect data without user consent, they are not transparent in what data they collecting, and they make it hard to disable this.

For example: There’s no easy way to exclude custom theme for update check. WordPress have filters for everything, but they don’t have this filterable. Maybe they want to monopolize theme market (maybe they are trying to say: you want to create theme? you need to use wp.org theme repository).

The only way to disable theme update check to wp.org repository is using this code (well, it’s pretty much a hack): Read More How To Disable WP.org Theme Update Check