Trigger “Changes you made may not be saved” message in WordPress edit post

If you add custom content in admin using ajax you probably want to trigger an alert when user wants to reload page or navigate on other page.

This is an event  beforeunload  bind to  $(window)

If you use plain  beforeunload you will have issues on WordPress because in edit post WordPress uses   beforeunload.edit-post and when you press update or publish it will not unbind that event. To make it work use the code below.

Add this to your trigger in jQuery:

 

How to add target _blank attribute to all external anchors in page with JavaScript and JQuery in one single line

 

What I have learned today 2016.10.14

#1 A simple method to test if is touch device in JavaScript

And if you combine that with a simple screen width conditional it can become something useful.

Has anyone a better idea? Post it in the comments. I would love to hear it.

#2 Have you wondered what WordPress script localization does?

The cleanest method to pass variables from Php to JavaScript in WordPress is by using localization function.

Something like this used in your functions.php file:

In JavaScript you would call them like this:

The above technique simply works and it’s really useful but have you ever wondered what happens under the hood?

Behold!

Pfff, no magic here 🤔

What I have learned today 2016.10.13

#1 Copy XMLHttpRequest as cURL command

It comes a day in a developer’s life when he needs to replicate a cURL command that runs in the browser. The reasons can be numerous and I’m not here to judge anyone. Anyway, I find it useful for prototyping purposes when working with API’s.

So you know some magic is running in the background and you want to take a look “under the hood”.

You can try this in Chrome or Firefox (mine was Version 53.0.2785.143 (64-bit) ).

save-as-curl

Next, to use it you have to paste it in Terminal.

execute-curl

That’s just a basic example but imagine how helpful it can be!

What I have learned today 2016.10.09

#1 WordPress in a subfolder on Nginx

I’ve tried to install my blog as a WordPress install in a subfolder called /blog and I found that Nginx doesn’t do it automatically so in your /etc/nginx/sites-available/yoursite.com you have to add the following:

 

What I have learned today 2016.09.30

#1 Test the Spammyness of your Emails with mail-tester.com

A nice tool to get your email spam score. It works super simple, when you first open the site you see a random email address and you’re requested to send a test email from the email address you want to test to that @mail-tester.com email.

After you do that you check your score by clicking the big button on the screen.

Mail-tester.com website | Bogdan Dragomir - WordPress Consultant

On my gmail address I got a score of 7/10 and below I can see why. That helps!

Spam score results on Mail-tester.com | Bogdan Dragomir - WordPress Consultant

Check it here www.Mail-tester.com

What I have learned today 2016.09.29

#1 The text-overflow CSS property

This is super useful when you don’t have enough space for some content. For example a title, a description, an excerpt.

What does it do? It determines how overflowed content that is not displayed is clipped and it adds this nice ... at the end.

It has to be applied to block container elements (or inline-block).

How does it look?

This is my clipped text content which is bigger than the container where it is added and using text-overflow:ellipsis it make this nice clipping

To make it work you have to add also white-space: nowrap; and overflow: hidden;

Enjoy! 😉