How to call images from your plugins image folder?

I’ve done a lot of research and learned a lot about WP constants and function usage for getting image paths etc. but still my original problem persists.

<img src="https://wordpress.stackexchange.com/questions/60230/<?PHP echo WP_PLUGIN_DIR ."vertical-social-buttons/images/facebook.png'?>">

<img src="https://wordpress.stackexchange.com/questions/60230/<?PHP echo WP_PLUGIN_DIR ."vertical-social-buttons/images/facebook.png'?>">

<img src="<?PHP echo plugins_url('vertical-social-buttons/images/facebook.png', __FILE__);?>">

All give me broken images. Am I missing something obvious?

Use plugin_dir_url() to get the public URI for the directory where the calling PHP file is.

<img src="https://wordpress.stackexchange.com/questions/60230/<?php echo plugin_dir_url( __FILE__ ) ."images/facebook.png'; ?>">

If the PHP file is in a sub directory of your plugin you have to go up:

<img src="https://wordpress.stackexchange.com/questions/60230/<?php echo plugin_dir_url( dirname( __FILE__ ) ) ."images/facebook.png'; ?>">