Small but Useful Stuffs for Your Site

As a WordPress Developer, I have to be creative. I always try anything to make my client’s site looks and works better. For me, a website is not only have to be user friendly, but also granny friendly. If a granny can understand your website easily, you’ll be the winner!

In this articles, I will share 4 small stuffs that could be useful for your website.

1. Sweet Alert

Sweet Alert is a beautiful, responsive and customizable replacement for javascript’s popup boxes.

I used to use Sweet Alert to beautify the alert messages. Using this popup, will be more efective visually. The visitor will be able to see the message clearly. This way, your site will be granny friendly.

This library is highly customizable. You can put HTML, custom colour, style, animation, auto-close timer and even include Ajax request.

Please check their website for more details.

Site URL : https://limonte.github.io/sweetalert2/

2. Clipboard.js

Clipboard.js is a modern approach to copy text to clipboard. With this small library (yeah, it’s pretty small, just 3kb gzipped), we can create a simple button to copy text to clipboard.

This is how it looks on one my project :

This way, you will simplify your user’s job. They just need to click the button, and then paste it everywhere. They don’t need to do right-click and copy or click CTRL + C.

We can also combine it with Sweet Alert so that once the text copied, the pop up saying “Your text has been copied” will appears. Once again, it will make your website granny friendly. 😉

Site URL : https://clipboardjs.com

3. International Telephone Input

This one is a jQuery plugin for entering and validating international telephone numbers. It adds a flag dropdown to any input, detects the user’s country, displays a relevant placeholder and provides formatting/validation methods.

I use this plugin on mobile phone validation page on one of my project. Here is how it looks :

It will detect your location and get your country code + country flag automatically. It works perfectly with Twilio because Twilio will need your country code in order to send the SMS properly. If you put the wrong country code, your SMS will stuck.

Site URL : https://intl-tel-input.com

4. Flag Icon CSS

Flag Icon CSS is a collection of all country flags in SVG — plus the CSS for easier integration.

On my latest project, I built a multi-vendor website so that people can sell their item on my site. The idea is to put the flag on each item so we will know where each item came from. Here is the screenshot :

On the image above, we know that the items are from Australia. The flag will works dynamically based on seller’s location. It works perfectly with WooCommerce because we can set the flag based on user’s country code.

Site URL : https://github.com/lipis/flag-icon-css

That’s all what I can share today. I actually still have a lot of ‘toys’ to share with you but I will write it on my next blog post.

P.S : If you need help to implement this to your WordPress site, feel free to Contact Me.