Zero BS CRM or how to go fishing for customers

Nah, this CRM doesn’t help much with fishing for customers – it’s way too simple. Actually, most of the features are easily achievable with any custom fields & custom post types plugin out there. Toolset Types could do the trick.  Don’t get me wrong – this one doesn’t do anything bad, and it has some pretty nice backend settings too, but that about it. It is actually a nice tool for it’s authors to try fishing for premium add-ons customers, as this is their business model. The plugin alone is pretty useless, but combined with some of the paid add-ons, it might actually happen to be a good one. If you are not up for some investment in it, better pass it on.

Oh, I forgot the link:

P.S. I miss the Projects part – everything here ends with the quote and invoice. Yet another post type would have come handy.

Gifcast – easy GIF screencasting for Linux

I recently needed to record my screen and output it to a .gif file. I know it’s a weird thing to do – compared to webm video for example, gifs are way bigger in size, way lower quality and don’t have sound. So.. why?

Well, mostly because in most cases GIFs are treated as images(because they technically are) instead of videos. If for example you need to put a very short screenrecording inline in a markdown document on GitHub, you can’t really do it with a video file. You can link to it, but not embed it directly in the document. But because GIFs are essentially images, you can place them inline just like any other image.

One way to handle that is to use a screencasting program like, say, ‘Kazam’ to record your screen, to a video file, and then use some kind of convertion tool to convert the .avi or .webm to .gif . If you need to do a bunch of recordings, that gets really old really quickly.

So I started looking for tools that record your screen and output GIF files automatically. Peek was one that grabbed my attention, but didn’t quite work on my environment for some reason(probably my non-conventional window manager?) Then I found some other similar stuff, none of which worked the way I wanted them to.

The solution:

Gifcast on GitHub

Clone the repo, copy the gifcast file in your $PATH, then just execute ‘gifcast’ from a terminal window. You’ll be prompted to select an area, after you do that, the recording starts. You can stop it by pressing ‘q’ in the terminal window you started it with. The .gif output is in ~/Videos/gifcast_%DATE%.gif. There is a temp .avi file in /tmp/ in case you need it.

Keep in mind that if the recording gets long, it can take some time to convert it to GIF after pressing ‘q’, be patient and don’t close the terminal window until it’s finished.

How to require only Cyrillic input

A case from the practice:

You have an e-commerce website integrated with the local delivery company. The thing is that all the address’ fields should be filled in Cyrillic as this is the expected input. Any Latin input will break the delivery service. So you need to make sure that only Cyrillic characters are used.

Here is the example JavaScript code using a regular expression that is “protecting” the input field form non-Cyrillic input.



You can check it how it works on this jsfiddle.

What actually it does:

  • each typed character that is not included in the regex above is deleted form the input.

That’s all, but don’t forget that there should be also server side validation.

Settings API Step by Step

Creating custom settings/options page in wordpress admin panel is an easy task if you know what you’re doing. Here is a step by step tutorial on that.

 Create settings page

First of all we need to create our page. We have two choices:

– Create separate page

To create a separate settings page we will use this code

add_menu_page creates our settings page. We have given it the following parameters:

page_title – The text to be displayed in the title tags of the page when the menu is selected. We have named our settings page “REWP Settings”
menu_title -The text to be used for the menu. We have named our settings menu element “REWP Settings”

capability – The capability required for this menu to be displayed to the user. We chose to let only administrators access and change our settings by choosing manage_options capability. Other capabilities can be found here

menu_slug – The slug name to refer to this menu by (should be unique for this menu). We made our slug “re-wp-settings”

function – The function to be called to output the content for this page. We created the rewp() function which echoes some html (for now). Everything we put in it will be displayed on our settings page

The function that creates our settings page must be hooked to amin_menu.

Resources on WordPress Settings API Step by Step settings

– Create submenu page

Sometimes we need to add our settings page as a submenu to Settings, Tools etc. There is a different function that adds pages to the main menus. They all have the same syntax so will see only how to add submenu to Settings. To do this we need to use add_options_page

There are minor differences between add_menu_page and add_optons_page (add_menu_page accepts a few more parameters), but in our case the parameters are the same.

Resources on WordPress Settings API Step by Step settings

Create the options and output them on our page

Now it’s time to create our options and fill our settings page with them. We will be using a few functions which will take care of the whole process.
We will start by adding capabilities check and a form to our rewp function. The method must be post and the action – options.php.

Now the only change is a button “Save Changes”. This is because we don’t have any options yet. To create options we will use register_setting, add_settings_section and add_settings_field. To begin we create a function called rewp_options and hook it to admin_init.

Register settings, add_settings_section and add_settings_field

register_setting adds a setting to a group (the first parameter. We use it in add_settings_fields), creates a row in wp_options (second parameter) and can take a third parameter generally used for data validation.

add_settings_section takes id, title, callback (which may be used for description, instructions etc), page (this parameter is used later)

add_settings_field is the option. We need to give it id, title, section and callback.

Create the callback functions

Now we can start with the options. First we create sections callback. This is optional but useful when we need to output something section specific. Here is the first section’s callback function:

After that we can create the options. We create our add_settings_field callback functions and write our inputs in it.

Remember the rewp() function. We need to add settings_fields( ‘rewp-group’ ); and do_settings_sections( ‘rewp’ ); to it and as a result our settings are displayed on the page


For security purposes we need to do a few more things. add_settings_field creates a nonce hidden field and saves us the trouble. We still need to validate and sanitize the data that goes to the database therefore we have to create a function which executes just before the settings are saved. register_setting’s third parameter is the name of such function and we can use for handling security.

We have only two input fields so we only sanitize them, but we can do more complex validations. If we want to whitelist the options of a select as the only accepted input, we could do something like this:

As a result only the whitelisted options will be accepted and saved in the database. Any other input will trigger an error.

Using the options

Finally you we can use our options. We can call your options everywhere using get_option( ‘option_name’ );

If we

we will see “there be dragons”

Featured images alt and title tags

For better WordPress onpage Seo we need to give our featured images alt and title tags. Unfortunately we can’t use out of the box tools for this (yet).

Featured images alt and title tags with custom code

Plugins that give alt and title tags to images don’t cover featured images. To optimize them you need to use  the wp_get_attachment_image_attributes filter. You can put the code bellow to your functions.php

Featured images alt and title tags with a plugin

We are working on a flexible and customizable plugin that will make this task a piece of cake. Here is a sneak preview of it’s options page.

Resources on WordPress Featured images alt and title tags Featured images alt and title tags

IE specific css using media query

Issue: Style problems only in IE

Sometimes websites look as intended on all browsers except IE. To solve this problem we need to write IE specific css.

Solution: Create IE specific css with media query

If you want to have css styles that target only IE ( works for IE10+ ), you can use a Microsoft-specific media query. It is recognized only by IE.

More about -ms-high-contrast he has 1 outbound link(s), all

Redirecting all pages from the old domain to the new one

When you switch domains for a WordPress installation, you should think of not only the how to move the site, but how to keep your content reachable by search engine hits or referrals. 301 Redirect is what is expected of you, and the easy way to do it, even if both domains are still hitting the same directory on the server is by adding the following rewrite condition and rule in .htaccess (works for sites hosted on Apache only):