Adobe Photoshop: Color Range

We often use magic wand or pentool to separate/isolate objects from its background. But sometimes it doesn’t go well using those tools.

Here is another way to remove the background of your images.

If you aren’t familiar with the Adobe Photoshop’s feature called “Color Range”… then you must try it! It will help you a lot in many ways not just by removing the background of your images 🙂

Open your image. Go to Menu>Select>Color Range.

A pop-up dialog will appear like in the image below.

Click on the background of the image. Color picker will be the appearance of your cursor once you hover outside the pop-up dialog.

Hold shift while clicking on the background to add the range of color to the selection. You will notice in the preview that there are white and black areas. White areas are the selected portions of the image vice versa. You  can change the preview mode in the Selection preview dropdown.

You can adjust the fuzziness to your preference to adjust the range of the color selection but for me I will set the fuzziness to 40. You can also check Localized Color Clusters for better selection.

After that, click Ok. The selection will appear like this.

You can refine your selection in various ways by using refine edge functions but that’s a different topic so I won’t be explaining it too further.

Hope you’ve learned something new again by reading this tutorial. Thank you for reading! 🙂

How to create a custom slider using Slick Slider

Some of the time we can not see a wordpress plugin that is looks like the slider on the design so what I going to do is to create a custom slider one of my favorite slider is the slick slider. You can create a custom slider by following the steps below.

First we have to embed the necessary js and css file, you can download the files from here http://kenwheeler.github.io/slick or use a CDN version https://cdnjs.com/libraries/slick-carousel

Add this code to the
[php]
<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
// Add the new slick-theme.css if you want the default styling
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>
[/php]

Add this code before the tag, please remove the jquery library if you already have it in your website
[php]
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>
<script>
$(document).ready(function(){
$(‘.your-class’).slick({
// We can add the slider settings below this line
});
});
</script>
[/php]

Lastly, the html markup
[php]
<div class="your-class">
<div>your content</div>
<div>your content</div>
<div>your content</div>
</div>
[/php]

When complete your html markup should be like this:

[php]
<html>
<head>
<title>My Now Amazing Webpage</title>
<link rel="stylesheet" type="text/css" href="slick/slick.css"/>
<link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/>
</head>
<body>

<div class="your-class">
<div>your content</div>
<div>your content</div>
<div>your content</div>
</div>

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="slick/slick.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){
$(‘.your-class’).slick({
setting-name: setting-value
});
});
</script>

</body>
</html>
[/php]

Disable Plugins By Any Post Type

The Plugin Organizer allows you to do the following:

  • Change the order that plugins load on your site
  • Selectively disable plugins by any post type or WordPress managed URL
  • Adds grouping to the plugins admin page.

Below is the step by step process to configure the plugin

  1. Click the button inside of the box titled “Selective Admin Plugin Loading” to set it to “On” and hit the “Save Settings” button.
  2. Click on Plugin Filters->Add Plugin Filter and enter the url of the admin page you want to disable plugins on in the permalink box and turn off the plugins you want disabled.
  3. If you want to affect all admin pages click on Settings->Plugin Organizer and select the Enable radio button under Fuzzy URL Matching. Then on the plugin filter select the checkbox for Also affect children

Adobe Photoshop’s Hidden Trick: Color Picker

Adobe Photoshop had so many features, shortcuts, etc. But this trick that I’ll show you maybe isn’t very known to all of us because it is unlikely being often use by the other users.

Maybe it will help you in your workflow so I guess I’ll show you 🙂

First, you must have an open canvass to do this trick. If you don’t have yet, just be sure to create one.

Then pick ‘Color Picker’ at the tool bar menu.

Then resize your Photoshop window to make it smaller. Resize it according to your preference. We need to resize it so we can see the portion of the background behind Photoshop app window. In my case the background behind my Adobe Photoshop window is my Google Chrome browser.

Then with the color picker tool selected, click on the canvass then hold+drag going outside the Adobe Photoshop window, point your color picker cursor to the color you want to pick/select. As you can see, a big circle near the picker will appear and will show the color which the picker is pointed at. If you can’t see the circle in your case, you can notice that the foreground color that is active at the bottom of your toolbar updates every time you move your cursor/picker to another color.

I hope this trick will help you a lot and can improve the way you work inside Adobe Photoshop. Thank you! 🙂

DNS Hosts File

Modifying your hosts file lets you view and test a site on one server while the rest continues to see the site on the original server. That makes it an essential tool when migrating your website.

Below is the simple process to do this.

  • First, find command prompt
  • Right-click on the cmd.exe icon.
  • Select Run as Administrator.
  • Enter the following command:
    [php]notepad C:\Windows\System32\drivers\etc\hosts[/php]
  • Add the appropriate line at the end of your hosts file, then save and close the file.
  • Flush your DNS cache
  • Open an elevated command prompt as above, and enter the following command:
    [php]ipconfig /flushdns[/php]