Category Archives: Windows

How to Capture a Portion of Your Screen in Windows 10

I used to have a special program I downloaded to take screen shots. Since I've been using Windows 10 however(I could of done this with earlier versions of Windows too), I've discovered there is a shortcut in Windows that does a quick and easy screen capture. That shortcut to capture the entire screen is:

How to Capture the Entire Screen

Hold down the windows key(in between fn and alt) and press the "prt sc"(print screen) key(found in the top row towards the right side).

After using [windows key]+[prt sc key] to cature your screen you need to find the file it saved. You should also note that it makes no noise and appears to not do anything at all when you do the shortcut keys, so you may not think it captured the screen, but it probably did. The print screen function saves a screenshot in a .png file. To find your screen capture .png file, click on the Windows icon in the lower left corner of your screen(unless you changed the layout), select the file explorer icon(on left) and navigate to /Pictures/Screenshots and you'll see all the past screenshots you've taken to-date if you haven't moved them or deleted them.

So you can take a fast screenshot with windows key + prt sc. However, you may not want to capture the entire screen as was the case with me today when I learned how to capture a portion of the screen using Windows 10. Here is how I did it:

How to Capture a Portion of Your Screen

In the lower left corner of your screen, in the search field, type "snipping tool" and press enter. The tool will either pop up or you may have to click on "snipping tool" if there is more than one option for the search text. Either way, you should now have the snipping tool opened now! Click on "New" in the top menu bar of the snipping tool and then click and drag to select the area of the screen you want to capture. Then select "save as" and save the results. It also allows you to edit and mark on the image if you want to.

sniptool

Making it easy to use Snipping Tool

While you have the snipping tool open using the method described above, you can make it much easier to use in the future if you simply add a shortcut icon to your windows 10 menu bar at the bottom of your screen. While the tool is open, you'll see a scissors icon in the toolbar at the bottom of your computer screen. Right click on the scissors and click "Pin to taskbar" and it will keep that icon there even after you close the snipping tool! Next time you need to use it, just click the scissors and you're all set!

How to change DNS settings on your local PC

Have you ever been working on a website, changed your DNS settings over to a different server and later needed to access that server again from the old domain name for some reason? Well if you are an active developer, this situation is somewhat common. I'll explain or you can skip the rest of this paragraph to quickly learn now to do it. Let's say you own the domain name example.com and a web server with an IP address of 111.111.111.111. Now assume you have a WordPress blog on that server that you had to move to another server with IP 222.222.222.222. Let's say you already changed the DNS settings for domain.com to point to the new server with IP 222.222.222.222 but you need to go back to the original WordPress site on the other server with an IP of 111.111.111.111. What do you do? We all know a WordPress site won't function properly with just the IP address, so that is out. What you need to do is repoint example.com to 111.111.111.111 in order to access that WordPress site again. What a PITA, right? Well read on and I'll show you a fast and easy way to make the site on the original server work with example.com even after you've pointed it to another IP address or web server! It's as simply as controlling a local host file on your local PC to make example.com route to 111.111.111.111 even though the internet routes it to 222.222.222.222! Here's how:

Using hosts file to override DNS settings for your PC

A lot of people don't realize that when you make a request to the Internet using your local computer it first checks a local copy of the hosts file for an entry and only if one isn’t present it goes out to the Internet DNS servers. Therefore there's an opportunity present for you to redirect example.com only for your own PC if you wanted to! Here are the easy steps:

  1. Open file explorer and navigate to C:\Windows\System32\drivers\etc.
  2. Open the file named "hosts" in notepad or another text editor that could be used as a code editor such as Notepad++, which is what I use.
  3. Now simply add a line to the end of the hosts file that contains the IP address of the server you want to route the domain name too followed by a space and then the domain name you want to reroute. So in our example scenario above, you would enter a new line that reads simply: 111.111.111.111 example.com
  4. Save the hosts file and open your browser and navigate to the domain which in our example was example.com. Note that there is a difference between example.com and www.example.com, so if you want it to work with www, you have to add another entry for www.example.com.

If you're using Notepad++ or similar as I was, you'll need to open it in administrator mode in order to be able to save the hosts file. Good luck! That's all there is to it.

How to change local DNS settings on a Mac

If you're on a Mac, the instructions are basically the same but do this instead:

From the terminal, type:

nano /private/etc/hosts
and then add the IP and domain name as described above, so the only real difference between Mac and a PC when it comes to changing DNS settings is that you will use a different editor and the hosts file is located in different places.

 

 

How to Share Your Internet Connection in Windows 10

So I've used a couple different methods to share internet connections on several different computers. What's a real pain is that some methods only work on some PCs and some PCs don't have all the components or programs needed to run ICS(Internet Connection Sharing) properly. So, I finally may have found a great, easy to use solution. It does require installing a simple app in Windows, but it doesn't seem to have any adware or nonsense in it. I will update this post if I do find any malicious content from the app later on though.

Using an App for Internet Connection Sharing

Some peope are against using an app for this, but let me tell you, it is easier if you have to deal with this issue regularly. The app is called Virtual Router and can be downloaded from: https://virtualrouter.codeplex.com/downloads/get/621827.

Screenshot (11)

You Can Now Contribute Web Development Content

Jafty Interactive Web Development has decided to start accepting user contributed blog posts! You can now submit any post that is related to out blog theme of web development and it will be published after admin moderation. As long as it is on topic and I think it improves the quality of my blog, it will probably be published. Some topics I would like to encourage users to submit posts about include:

  • PHP
  • JavaScript
  • HTML
  • XML
  • CSS
  • Search Engine Optimization/SEO
  • Freelancing as a web developer
  • Freelance writing
  • working from home
  • Laravel
  • WordPress
  • C Languages
  • Java
  • ASP.net
  • JQUERY
  • Ruby on rails
  • MySQL Database
  • SQL
  • PHP and MySQL
  • Remote server administration
  • Linux Command Line
  • Linux and Windows Servers
  • MAC and web development
  • PC vs MAC
  • Mobile Development
  • Mobile website optimization
  • PERL
  • AJAX
  • Adwords
  • CURL
  • Graphics
  • anything else related to web development!

That's just a list to fuel your mind. Feel free to submit any related topic. I will accept anything related to web development. I'm looking forward to some great blog posts! - Ian L.

Click Here to Sign Up and Begin Writing!

 

How to Make Putty Automatically Login with User and Password

In this article, you'll learn to make a one-click Putty shortcut to your server from your desktop. What's so great about that? If you are a web developer or operate your own server and use Putty, then you probably know how much of a pain it is to have to open putty and enter the URL, user and password each time you need to open a command prompt on your remote server. Imagine being able to simply click a link on your desktop to open a command prompt to your remote server! Wouldn't that be great? I think it is. Here is how you can make a direct single click link to a remote server on your desktop:

  1. Locate your Putty program. Normally it would be somewhere like C:/ProgramFiles/Putty or similar. However, it could be anywhere. I installed mine in a special C:/Desktop/Tools directory as you can see in the image below, but yours is most likely in ProgramFiles.puttyfile
  2. Once you locate putty.exe as in the image above, right click on putty.exe and select "send to/Desktop(create shortcut)" to create a shortcut on your desktop. It will look like this:puttyshortcut
  3. Right click on the shortcut like in the above image and select "rename" and give the shortcut a name that identifies it as a link to your server such as example.com or whatever name you like.
  4. Right click on your new example.com shortcut and select "properties" and edit the target attribute to read: "C:\ProgramFiles\putty.exe root@207.150.12.233 -pw YourPassword". Be sure to change "C:\ProgramFIles" to the correct path of your putty.exe file. Change "root" to the user you would use to login to your remote server and edit "207.150.12.233" to equal either the IP address of the remote server or the domain name such as "example.com". Finally, edit "YourPassword" so that it is the correct password for the username you used in place of "root" previously. Once the target field is correct, click "Apply" then "OK" to commit the change.
  5. Now simply double click on your new shortcut and a command prompt to your server will magically open! Magic!

I've been using Putty for years and always thought there was no way to store a password for a remote server connection using Putty, so I was absolutely thrilled to learn of this little known secret for creating a desktop shortcut that logs you into your server with putty and without having to enter your password every time!

Make a Bootable El Capitan USB Drive for Mac from Windows PC

After a couple days of random Google searches, I finally was able to put together enough information to figure out how to make a bootable USB drive to restore my Mac using a PC. Yes, my Mac took a dive, a huge one. It won't even start up, so I found that the only possible way of fixing it on my own without taking it into the shop and spending hundreds of dollars I can't afford, was to try to re format the Mac's Hard Disk and install the latest version of OS X on it. I am crossing my fingers it will work! TIP: before you start, you might want to get the os x software .dmg file download started because it's over 6gb and takes a while. Click on the first link under the Download OS X Software heading below to get that going and you can take your time with the rest.

Download OS X Software

The first thing you want to do is download the El Capitan Software from one of the following links:

The best option for me was to download the .dmg file directly from:

https://drive.google.com/folderview?id=0B8s8_mgNDN5scDI4R0VTUVpkQUU&

usp=sharing

Beware that it is a 6.2GB file and will take quite some time to download in most cases.

If the above link doesn't work for any reason, you can try this second one if you are good at piecing together the .rar archives:

https://goo.gl/8CGh5L

 

 

Download TransMac

The first step to creating your El Capitan USB dongle using Windows is to download TransMac, which can be done free of charge using the following link:

http://www.acutesystems.com/scrtm.htm

Click the above link and then click on the hyper link that reads " tmsetup.zip" towards the top of the resulting page.

Once you have the TransMac .zip file downloaded, if it's not already on yoru desktop, move it there so you can follow this tutorial easily. Unzip it to your desktop and click on the setup file to install it. You can accept the defaults while going through the GUI. It's nothing very important, just get to the "install" button at the end and click it and you are golden. Before clicking on "Finish" however, you should uncheck the "read me" and "run" options because we have to run it a certain way as you'll soon see.

Now's a good time to insert your USB stick, thumb drive, dongle or whatever you call it. Backup any files you want to save and erase them from the USB drive to be safe.

Next, right click on the new shortcut icon for TransMac the install process should have created on your desktop and select "run as administrator". You will want to then run the free trial.

Once TransMac is running, select your USB drive from the menu on the left by right clicking it and choosing the "Format Disk for Mac" option and clicking "yes" to continue if a warning pops up about losing files or formatting etc...

You'll be asked for a Volume Name next, enter something like "EL Pwn Version" and click "ok". Soon, it will say "Format Complete" and click "ok" again.

Again in the left side of TransMac, right click on your USB drive and this time select "Restore with Disk Image" and then select the copy of the "EL Pwn Version.dmg" file you should have downloaded to your desktop earlier.

 

 Summary and Credit

If you follow along with this tutorial closely, hopefully you were able to get a copy of El Capitan installed on your Mac using only a Windows machine to build your bootable USB flash drive. I have to give credit to the YouTube video at https://www.youtube.com/watch?v=NjTLYJXM8u4 because it was the only source I found online that even remotely covered how to do this successfully.

 

 

How to Make a Windows 10 USB Stick

This article is about how to use USB stick to install Windows 10 onto a PC.

I'll keep it simple, so go here:

https://www.microsoft.com/en-us/software-download/windows10

...and click on the download link for either a 32bit or 64 bit system depending on which applies to the PC you want to use to make the USB drive, not he PC you want to install Windows 10 on.

Once downloaded, make sure you have a blank USB stick inserted in your PC and run the .exe file to install the Windows 10 software onto the USB stick.

Then go into the bios settings of the PC you want to install Windows 10 on and change the boot order so it boots from USB first, insert the USB stick and restart the PC, done!

If the link above is no longer available, contact me, I made a copy in my tools folder.

 

How To Take a Screenshot in Windows

I just upgraded to windows 10 and thought maybe I wouldn't have to download a screenshot application like I've always done to-date, so I Googled how to take a screenshot in Windows 10. Supprisingly, I learned that Windows has had a screenshot keyboard shortcut even before Windows 10. I tried this on Windows 8 and it worked too!

How to take a screenshot in Windows

All you have to do is hold down the windows key(on the lower right side of your keyboard between the fn and alt keys. It's the key with the window symbol on it.) and simultaneously press the "prt sc" key(found in the upper right portion of your keyboard, normally not far from the f12 key).

Fix Asus Touchpad After Windows 10 Upgrade

Today I spend a few hours trying to figure out how to fix the touchpad on my Asus laptop after installing the new Windows 10. It was not easy to find this fix, so I am posting it here. All you have to do is download the Windows 10 version of Smart Gesture and you will be able to control your touchpad once again after installing it.

Problems this fixes include:

  • Not being able to turn of tap to click
  • scrolling problems
  • no controls for your touchpad after windows 10 upgrade
  • Control panel link to smart gesture not working
  • many other possible touchpad issues after installing Windows 10

The download:

dlcdnet.asus.com/pub/ASUS/Commercial_NB/Apps_for_Win10/SmartGesture/SmartGesture_WIN10_64_VER405.zip

Summary:

If you're having any problems with your touchpad or with touchpad settings in particular, try downloading and installing the software from the above link. It has worked for many!

 

 

 

 

How to Connect to Ad Hoc Network from Windows 8.1

Microsoft seems to have dropped the ball on this one folks. For some unknown-to-me reason, Windows 8 computers cannot detect an ad hoc network. This means that when I set up an ad hoc internet sharing network on my Windows 7 laptop so that I could share the laptop's internet connection with a different laptop running Windows 8.1, it couldn't be done. The main reason it wouldn't work is because the ad hoc network I created does not show up under WiFi connections on the Windows 8.1 machine. I tried all sorts of things and only one finally worked, so I'll share it with you below. For anyone following my series on developing a Smart Home, This is the method I used to network my smart home PC to other PCs in the house. The laptop used as a controller for the house was connected directly to the cable modem using an Ethernet cable. Then I created an ad hoc network on the same laptop that broadcasts the internet signal(shares its internet connection) to any other computer in the house that has wireless capability.

Instructions for using ad hoc with Windows 8.1

  1.  First create your ad hoc connection from a computer that has a working internet connection that you want to share. FYI, Windows 7 starter does not have the ability to create ad hoc networks and won't allow you to share internet connections in any way without doing some serious mods to your OS. It's easier to use a PC that doesn't have Windows 7 starter.
  2. Next, on the machine that you want to share with that's running Windows 8.1 or similar, open the Control Panel and click on "Network and Sharing Center".
  3. Click on "Set up a new connection or network".
  4. Select "Manually connect to a wireless network" and click "Next".
  5. In the "Network Name" field, enter the ssid name for the network you created on the other computer exactly how you entered the name when you created the ad hoc network.
  6. Select he appropriate security type and enter a security key if needed.
  7. Be sure that the box that reads "Start this connection automatically" is NOT CHECKED. I normally leave the other box unchecked as well.
  8. Click the "Next" button.
  9. Close that window and open a command prompt window which you can do by hitting the windows key then clicking on the search icon(magnifying glass) in the upper right corner of the screen then typing "cmd" and searching. Click on the command prompt option from the search results to open a new command prompt window.
  10. At the command prompt, type(without quotes):"netsh wlan connect [ssid]" replacing [ssid] with the ssid name of the ad hoc network you created on the other PC.
  11. Now your Windows 8.1 PC is all set up to use that single ad hoc network. Unfortunately you'll have to repeat the above process for any other ad hoc networks you might want to use in the future. You'll not have to do it again for the same network though. Finally, to connect, all you do it type this at the command prompt: "netsh connect [ssid]" without quotes and replacing [ssid] with the ad hoc network name.
  12. Now you are connected, so use it til done and when you want to disconnect, you can use "netsh wlan disconnect " without quotes.
  13. If you ever wish to delete the ad hoc network from your Windows 8.1 computer, use this command from a command prompt: "netsh wlan delete profile [ssid] " without quotes and replacing the ssid name and brackets with actual network name.

There you go! Now you can connect your Windows 8.1 machine to an ad hoc network. It's really only about ten easy steps so don't be intimidated by my long explanation. Simple do the above one step at a time and you'll get it in no time at all. Good Luck!

Why Would You Use an Ad Hoc Network?

The reason I did this instead of using a WiFi wireless router was to save electricity. Since I had to have the main computer that controls the house running all the time anyway, I figured why not use it for a router too. I have effectively eliminated one small appliance which means saving about 10 watts of power continuously in my case.

Another reason could be that you simply do not have a wireless router. In my particular case, I fried mine last night by accidentally hooking 24 volts to the router instead of the required 12 volts. So this turned out to be a blessing in disguise because now I am able to save power on my Smart Home system and cut down on the number of wires as well.

CodeLobster All-in-One Coding Software

CodeLobster PHP Edition Software Review

Written by Ian Lincicome of Jafty Interactive Web Development - Jafty.com

For the past couple of weeks, I have been evaluating CodeLobster's latest release of "CodeLobster PHP Edition" which I'll refer to as simply "CodeLobster" from here on out in this review. The current edition at the time of writing this review was CodeLobster PHP Edition Professional Version 5.4. I am reviewing CodeLobster because I am looking for a tool I can use for my web development business, Jafty Interactive Web Development. Also I was given a break on purchasing the pro version of CodeLobster in exchange for writing a product review on my site, Jafty.com. Please note that I am under no obligation to write a positive review. I will be as brutally honest as ever, I assure you. This review will include both the pros and cons of using CodeLobster rather than a one-sided review like many company's probably hire writers to write. In fact, if that was my intention, I wouldn't have mentioned that the someone had asked me to write this review. My ulterior motive for writing the review is to find the perfect program to do my work for my business. I am also evaluating other products as well because I want to work with the best.

I'm looking for an application that will allow me to seamlessly edit several types of code on several different servers without having to use a separate code editor, FTP program, web browser and Language reference material. To this date, I have been using three separate applications to accomplish my day-to-day work. I used FileZilla to copy files from a client's web server to my desktop. I used Notepad++ to edit the code files. Finally, before using FileZilla again to upload the files back to the client's server, I viewed the file in Firefox to see how it looks in a browser. That is if it is not a server-side language like PHP which I use the most. If I had to edit a PHP file, I had yet another couple of steps to perform because I'd have to upload the file to the server to view it and then repeat the whole entire process again if I had more changes to make to get it perfect. So I used FileZilla, Notepad++ and Firefox mostly up until now. I figure I could probably almost double my productivity with one good tool that does it all.

Technologies CodeLobster Supports

CodeLobster supports a wide range of technologies including:

  • PHP
  • HTML
  • JavaScript
  • CSS
  • SQL
  • MySQL
  • Version control systems such as SVN, Git etc.
  • CakePHP
  • CodeIgniter
  • WordPress
  • Drupal
  • Joomla
  • Facebook
  • jQuery
  • Smarty
  • Symfony
  • Yii

CodeLobster also has a very wide assortment of features including all the standard components you would expect in a code editor and many extras. I found a helpful built-in Help feature that also links to online help if you can't find what you need in the built-in documentation. The online documentation is surprisingly complete for a newer product.

Installing CodeLobster

The installation went smoothly and was very easy and comprehensive. Simply download and click the set up file and the installer will guide you through the simple set up process. Here is the Download Link: http://www.codelobster.com/download.html

When I first installed CodeLobster, it allowed me to select what languages/technologies I wanted to install. I only deselected two that I knew for sure I would most likely never use. I figured if there was even a small chance that I might use one of the items listed, then I should leave it checked. That way I will be prepared in case I need that particular technology in the future.

Pros and Cons

Once I began using CodeLobster I noticed both good and bad points regarding the program. I loved how versatile the program was right out of the box. I did not like the way the word wrap feature worked(View/Word Wrap). It breaks up words rather than splitting lines by the nearest space. I'd prefer it to not break up words at all or at least do so in a more logical manner(by syllables with hyphens for example). From what I understand from reading the forums and talking with my contact, CodeLobster plans to add an option between soft and hard word-wrap. Hard wrap is how it is now and soft wrap would be a word-wrap technique that doesn't break up words. I do hope they add it soon because it was one of the of the first things I noticed.

One of the first features I noticed and liked was the completely configurable hot-keys. You can configure any hot-key by going to Tools/Preferences/IDE/Hot keys. Another nice feature is the Find and Replace feature that is very much like that of Notepad++ including regular expression search and the ability to search and replace text in files, folders and sub-folders. This can be a huge time-saver for coders.

One of the first things I noticed and did not like was the lack of a decent spell checker. I know notepad++ has the option as a plugin, but not as a built-in feature. Either way would be great, but I think it should be a standard built-in feature. I realize that auto-complete helps with this, but not if you are writing a plain text file such as I am doing right now while writing this review. I talked to my contact at CodeLobster Software about this and he assured me that they plan to add a robust spell-checking feature in the near future. He mentioned that they plan on making several additions to the software and will be releasing future editions with new features and improvements ASAP. So, while CodeLobster may not have everything I would like it to have at the moment, I was assured that they are heading in the right direction with future expansion plans.

Another nice feature I also noticed right away was CodeLobster's tool bars. The tool bars are completely configurable and have a nice drag and drop feature to move tool bar items around as you please. The same can be said for the man different windows that can be added or removed from the work area.

CodeLobster is a code editor first & foremost and it does a wonderful job at editing PHP code which is my code of choice. If you are looking for a word processor, CodeLobster probably won't fit the bill, but it is a very robust code editor that can handle all of the languages I use for web development and several others.

CodeLobster's plugin ability is great to have in a code editing program. The pro version of CodeLobster comes with many plugins that the free version does not include from what I understand, so I think the pro version is definitely worth the cost for those of you who work with frameworks such as WordPress, Joomla, CakePHP, CodeIgniter, etc. I currently own the Pro version and I am happy with its performance so far and will be much happier once some of the additions are made in the near future.

Even the free version would be great for coders who use many different coding languages regularly but don't need the extra plugin abilities that require the pro version. As a full-time web developer, I mostly use PHP, HTML, CSS, JavaScript, WordPress and MySQL. I also occasionally use Joomla, XML, Perl, Python, Drupal, Smarty, Laravel, CakePHP and others, so I require the Pro version of CodeLobster myself. If you only use the most common languages such as PHP, HTML, CSS and JavaScript, you can probably do fine with the free version. Some of the things I require the Pro version for include WordPress support, Smarty, Laravel and CakePHP. Honestly there are to many features to list here. You should visit their web page at http://www.codelobster.com/details_phped.html to figure out which version is best for you. They also have a Lite version which you can read about on their site since I won't be covering CodeLobster Lite here.

As I continue to evaluate the software I am finding there are more and more features that I like. As a web developer, I need a tool that allows me to quickly edit code, test it and upload it to the client's server. So far, CodeLobster seems to be meeting my three main requirements quite well in most cases.

FTP Feature

CodeLobster's FTP ability is a very powerful feature. The FTP feature allows you to set up as many FTP connections as you need. I was able to copy all of my client's FTP connections from FileZilla into CodeLobster. Now I am able to click on a connection, edit a server file, preview it and upload it back to the server seamlessly from within a single application! This is huge for me because I used to use at least three different applications to do the same thing without CodeLobster. I can see that my work will get done a lot faster by using CodeLobster. In fact, I am already getting work done faster after only two days of using it.

The FTP feature is very functional, but for a guy like me who hates to read instructions, it took a little bit of fooling around using trial and error methods to get it set up for the first time with all of my client's 20+ FTP connections and configuring basic settings. Everything I needed to accomplish my FTP tasks is in CodeLobster, but the FTP system does need some improvements. For example it gave me trouble when trying to connect to a SFTP connection. It worked great with all non-secure FTP connections however. As luck would have it, out of over 20 current clients I work with, only one uses SFTP rather than FTP, so I am unable to test it on other secure SFTP servers to see if the problem is just with this one server or not. Unfortunately this is one of my regular clients so it is going to be a problem for me. It did connect using SFTP, but had issues when trying to edit files on the server which I was able to do fine with regular FTP connections. I did bring this issue to the attention of my CodeLobster contact however and he assures me it will be looked into ASAP.

Regarding the GUI set-up for FTP, in my personal opinion, the way the windows are organized in the work area could have been done a little better. For example, when I use FTP, I have to go to Tools/FTP to open the explorer window that lists FTP connections. That alone will allow you to open your FTP connection but won't allow you to see what's going on. If there was an error and the only window you had open in your work area was the explorer window, you wouldn't see that error. This is where I think it could have been done better. I would have programmed it so that when you open the FTP window, the output window opens along with it, right above it, similar to how FileZilla allows you to view console output. Of course this is just my opinion, it may not bother others and actually I am starting to get used to it so it doesn't bother me as much as time passes.

Search Features

The "Find in Files"(Search/Find in Files...) feature is great for finding text in open files. It could be improved to allow file search on the local directory tree files as well, but it is sufficient the way it is. Also I love the regular expression search as I mentioned earlier.

Also, I often use the incremental search feature when I edit code. While I am glad it has this feature, a small nuisance for me is that the incremental search box is not persistent across different views. I think it would be nice if the incremental search box would stay at the bottom of all view tabs once it is opened. I don't think it should close unless you manually close it. Again, this is just my preference, not a bug.

Nice-to-Have Features

One more thing I liked while test driving CodeLobster is that when editing .html and .css files I could hover over class names in the HTML or CSS code and it would show me the associated style declaration. Also when hovering over items in a .css file, it shows me information regarding the browser compatibility of the CSS code.

The HTML preview feature works very well. It is a built-in browser that shows the results of your code live without having to open a separate browser window. All you do is click on the "preview" tab. I did notice that sometimes you have to hit the refresh button to see your changes, but that is to be expected.

I also enjoyed the code formatting features very much. I tested them on an HTML file that I copied from an online web page. At first the HTML code was ran all together with no line breaks or indents. I simply went to the tool bar and clicked "Tools/Code Format/Format" and it formatted it perfectly. I am sure it will work with other supported languages equally well.

When you double-click on a variable name in the PHP editor, it highlights the variable and the dollar sign, so you can copy the whole thing and paste or search for it easily. Notepad++ wouldn't include the dollar sign and it was a bother to me.

CodeLobster has what they call a "Map" feature(View/Windows/Map) that I've never seen before. It is basically a small window with a tiny view of the document you're working on. It allows you to click anywhere in the Map to quickly jump to a section of the file that you need to work on. It is a great feature for working with large files.

Conclusion

I have concluded that CodeLobster will indeed fill a need in my current web development process. It is not yet developed enough to be the only tool I use simply because of that one SFTP connection it will not work correctly with. However I found that I can combine it with another tool, CyberDuck, as a work-around until the developers of CodeLobster work out the final kinks in the software and add some more nice-to-have type features such as spell-check and . In the end it still gets a thumbs up for all the wonderful features it has and for its robustness in general. Eventually I believe it will make the perfect all-in-one coding tool for my company. The other contender for my new all-in-one coding tool was CyberDuck and I can honestly say that CodeLobster has much more potential. CyberDuck is also in its early stages of development and it needs several improvements to be truly useful. CyberDuck fails in comparison to CodeLobster when it comes to Features. CodeLobster is truly made to be an all-in-one coding solution while CyberDuck is missing many of the necessary features to be a real competitor.

If you are interested in how I combined CodeLobster with CyberDuck to make up for CodeLobster's short-coming when connecting by SFTP, I'll quickly go over how to do it. Create a bookmark(that's what CyberDuck calls their FTP/SFTP connections) in CyberDuck to the SFTP server. CyberDuck allows you to set it up so you can use your own code editor with it in a way that allows you to click on a file from a remote server and open it in that editor. Then when you save it in that editor(CodeLobster), it saves it to the server. That way I still have a seamless process even though I have to combine two tools to get what I truly want.

Sell PHP, JavaScript, C++, C# and Other Scripts and Tools on Jafty.com

Yes, we have started a store on Jafty.com which can be found at Jafty.com/shop. Currently shoppers can find a limited collection of my own scripts and tools for sale. I would like to give my readers a chance to sell their own script and tools here as well, so I am opening it to the public upon approval by me of course. As long as I can see that your scripts are useful and have a potential that someone visiting my site will purchase them, I will publish them. To submit your script for review, simply send me an email at linian11@yahoo.com with a link to your script or attach it to the email and include the amount you expect to receive for each sale made and I will promptly give you a decision on whether or not we will sell your items on Jafty.com.

Email Ian at linian11@yahoo.com to sell your scripts today! Visit our script and tool shop at Jafty.com/shop

Edit Files Live on the Server

I've been a web developer for many  years now and I must say I feel a little foolish for not thinking of this earlier. I've been wasting countless amounts of time waiting for files to upload and doing the mundane tasks involved in updating files and uploading them to a server when I didn't really have to. Here's why.

Today I got fed up with editing my file in Notepad++, switching to Filezilla,  finding the file in a folder on my desktop, uploading the file by dragging it to Filezilla and finally testing my online website or app. I decided to Google the term "Edit files live on server" and found https://cyberduck.io/ that has an amazing product which allows you to type in your FTP details, just like I used to in Filezilla, and open a connection to my server. Then it gives me a directory tree on my server. CyberDuck allows me to click on any file on my server and open it in Notepad++ on my desktop, edit it and save it right back to the server without having to click and drag it to another program like I used to do for so many years.

This is the best program for a developer I have found in years. Traditionally I do not favor fancy programs to help you write code or frameworks to make things "easier" because I found that they only complicate matters in the long run, CyberDuck is the exception however. It is great so far, but I've only been using it for an hour now, so if I find any flaws, I will report them here asap. I just wanted to share this. If you are interested in downloading the CyberDuck app for yourself, simply CLICK HERE or the link above and look for the two download links on the left side of the page. Do not use the first download link you see at the top of the page because it is a sponsored ad and will try to trick you into downloading something else. I hate those types of ads, but none-the-less, I still recommend CyberDuck!

Like I said, it's great when used with Notepad++, so if you'd like the experience I had, download Notepad++ too. Just google it, it's easy to find.

How to delete lines in Notepad++ that contain specified text string

Have you ever had a list similar to this one:

Some text here...spam...some text here
Some text here...good...some text here
Some text here...good...some text here
Some text here...spam...some text here

...and you wanted to delete all the ones that contained a certain string of characters? If so, I have the solution!

  1. Open the file with the text you want to filter in Notepad++. If you don't have it, google it and download it.
  2. In the top tool bar of Notepad++, click on search/replace to open up the search and replace dialog window.
  3. In the replace dialog window, where it says "find what" enter: .*spam.*
  4. That's dot star then the text or character string you want to search for followed by another dot star. Replace the word "spam" in my example with the text you want to search for.
  5. Check the box towards the bottom left of the replace dialog window that says "Regular Expression" to enable the use of regular expression search mode.
  6. Leave the "Replace with" field blank so it deletes the lines it finds that text in and doesn't replace it with something.
  7. Click "Replace All" to the right of the dialog window and it will replace all lines that contain spam with a blank line.

Here's what your find and replace dialog will look like:

Snap 2014-12-15 at 12.14.49

Delete all blank lines in Notepad++

Now that you have gotten rid of the lines you didn't want, you may also want to delete all those pesky blank lines with another search & replace trick. Here is how:

Simply go back up to the Notepad++ toolbar and navigate to "Edit/Line Operations/Remove Empty Lines" and it will quickly remove any empty lines without having to do a complicated regex which you can also do if you know how.

 

How to Reactivate Microsoft Office 365

Still don't want to pay for using MS office 365 after using it for the trial period? I have the perfect solution for you! As far as I know it's not illegal, but I am not responsible for any legal issues or problems you may have. Use this tutorial at your own risk.

 

How to fix Office 365 or Office 2013 "Activation" or "Unlicensed Product" Problems

OfficelogoOrange_Web

These problems can occur in any or all of the Office products such as Word, Excel, Access, Powerpoint, Publisher, OneNote, Outlook, Infopath or Lync; by displaying one of the following messages (or similar)

“Unlicensed Product”

Office365-word-unlicensed-product

“Product Deactivated”

office365-rectivate-word

“We’re sorry, something went wrong and we can’t do this for you right now. Please try again later”
office365-sorry-something-went-wrong

or similar.

You can re-activate Office 365 or Office 2013  in a number of ways as follows

1) Repair Office 365 or Office 2013

In Windows 7 or 8 locate “Control Panel” > “Programs” > “Programs and Features”

Office365-control-panel-change

Highlight “Office 365 ProPlus” (do not click on it) and select the “Change” button

office-365-repair

Select “Quick Repair“. When it is finished you'll see this image:

Snap 2014-11-16 at 00.50.53Once that appears, click to Close it out and try to open your MS Office product once again. When I did it, it didn't work the first time. I had to open it and close it then open it again. If it doesn't work still, try restarting your PC and trying again.

If this does not fix your problems try "Online Repair" next. If it still doesn't work, reinstall Microsoft Office 365 with the following instructions:

Reinstall Office 365 or Office 2013

From any of the office products click on the left arrow in the top left of the product, then click on “Office Account

Office365-account-login

Click on “Manage Account” to login to your Office 365  or Office 2013 account

office365-signin-screen

Once signed in, navigate to “software

Office365-software-download
Then click on “Install“. This will downlaod a file that needs to be executed by clicking on it. This will start the “Office 365 reinstall

How to Use Old Skype Version on Windows 8

I finally started using Windows 8 today as it seems like its not going away after all, lol. There are a lot of different features to get used to. Skype, for one, doesn't work like I'd like it to at all. Skype is an app in Windows 8 that came with my laptop and it functions more like a mobile app than an app for a computer. It wouldn't let me click and drag a file into a conversation to send that file to someone I was talking to. It won't let you shrink the window with the exception of using split-screen. These were the main drawbacks to me, so I decided to find out how to use the old non-app version of Skype.

Here's how to Install Skype without an App:

  1. Go to your windows main screen and click on the Gear icon which is the PC Settings app.
  2. Click on "Search and apps" link in the left column.
  3. Click on "App sizes" in the left column.
  4. Find Skype in the App sizes dialog to the right and left click it then click on "uninstall".
  5. Go to http://www.skype.com/go/getskype-msi to download the desktop version of Skype which is not the app!
  6. Find where your file downloaded and click on the skype icon for setting it up.
  7. Follow the on-screen instructions to install the old version of Skype and you're in business!

Summary

So, as you can see, it's not too difficult to get your old Skype back. The instructions above are really easy to follow, so give it a shot. The higher level instructions would be to simply uninstall Skype app and install the desktop version of skype from http://www.skype.com/go/getskype-msi. Good luck!

The Basic Strategy of Responsive Web Development

Okay, as the title indicates, this is an instructional article about responsive development, not design. We assume at this point, you have a PSD Photoshop design already made and your goal is to DEVELOP that design responsively and responsibly. No pun. So the keywords here are DEVELOP and RESPONSIVE. I like to say that adding the responsive factor into a webpage is the developer's job and not always the designer's job so much. In some cases, where the developer is also the designer, it is definitely both. First let's talk about how the designer can assist in developing a responsive webpage.

How the Designer can Help with RESPONSIVE Designs:

At the very least, the person doing the Photoshop design of the webpage should be aware of the need for a responsive page. That way he or she can assist the developer by not including elements that are difficult to make responsive such as many layers stacked on top of each other or text in inconvenient places. Let te designer know that the PSD image should look as good as possible at every possible zoom level from 10% to 150% and that will give them some figures used in Photoshop to play with.

How Web Developers Go About Making a Responsive Webpage:

Certainly most of the extra work lies on the shoulders of the developer when it comes to responsive web pages. He or she is the one who has to make the page function at every possible screen-size and every possible device type including desktop PCs, laptops, net-books and mobile phones at least. Testing and Debugging is key here, but first you should learn to think in percentages instead of Pixels, which is what most of us developers used in the old days before responsive development was so important. I often get away with checking on a PC, laptop and phone myself, but the more different types of devices you check your responsive design in, the better it will be in the end. I like to start by making the page using percentages instead of pixels for divs and images mostly and always for width of images for sure. Images should usually be inside a containing div with the image width set to 100% so that the image scales down nicely when the screen size changes. Let's say for example you want an image to be 500px wide at 100% zoom and when the screen is wider than 500px. You would crop the image to 500px place that image in the div you want then set it's width to 100%. Then to move the image around in order to get it exactly where it should be in the page layout, instead of playing with pixels, use percentages for margin-top, margin-left, etc. An important part to remember is that you'll often need to set elements position CSS attribute to "relative" in order for margins to work as you want them to. In some more rare cases, you'll use the absolute position, but only for more advanced layouts. To sum it up and give you a better visual representation of what I am saying here, these are the steps to creating a responsive web page:

Steps to Responsive Development:

  1. Have a designer create a PSD who is informed of the need for a responsive design.
  2. Slice the PSD and create your first-draft of the web page using images and divs with percentages instead of pixels and be sure to user relative positioning when declaring margins in CSS.
  3. Once you have a first draft with some or all elements of the design in place, start manipulating the browser window to decrease and increase the window size from around 2000 pixels wide down to as small as 300 pixels wide making sure it looks proper at each size in between.
  4. Zoom in and out using your browsers zoom hot keys which are cntrl/- and cntrl/+ on Windows machines. make sure all your elements and images look good at all possible zoom levels.
  5. Once you have the site looking good and responsive on your development machine, it's time to look at it and tweak it some more using other devices such as net-books, iPad, iPhone, Android phones, Laptops and Desktop computers. A truly responsive design looks great on any device at any screen-size and zoom level.
  6. After each round of changes on one device, go back and make sure you didn't break your layout on the other important devices. I know it's a tedious process, but that's why you have to charge more money for mobile and responsive design techniques. I generally charge twice as much for a fully responsive design as opposed to one that is only partially responsive such as a default WordPress install might be.

Summary:

There you have it, my views on responsive web development as I have learned from nearly 20 years working as a full time freelance web developer. Good luck with your next responsive design and I hope this article helps you!

Handy Regex Notes for Notepad++

Here are some regex expressions I have found to be useful with notepad++ as a programmer:

  1. .*' - (dot star apostrophe), finds all  occurrences of "'s".
  2. .*word - finds all occurrences of any number of characters up to the word "word".
  3. word.* - finds all occurrences of the word "word" followed by any number of characters.
  4. [a-z][a-z][a-z].com  - finds all three letter .com domain names(lower case). Simply change the a-z to uppercase to look for uppercase 3 letter domains.
  5. [a-z][a-z].com - finds all two letter .com domain names in lower case. Change to A-Z for uppercase.
  6. [0-9][0-9][0-9].com - finds all three number .com domain names.
  7. Adult T - [0-9a-zA-Z ]+, - finds all occurrences of "Adult T -" followed by another word or number(or combo) and then a comma.
  8. .*[\|]  - Finds and replace all but the domain name in cases where ea. line in a file looks like: celebrification.com | scottludbrook@aanet.com.au(make sure that the regex ends in a space). Note that the pipe character is escaped with a backslash.
  9. ^\s - find are replace all blank lines. Deletes blank lines when search for this and replace with nothing.

Make all lowercase

While not a regex, I learned how to change all characters to lowercase using Notepad++ today as well. All you do is select the entire document or the part you want lowercase and right click then select "lowercase" and DONE!

Find & Replace Part of a String

Lets say you have a CSV file with these contents:
1 Adult T - Led Zeppelin, black, XL

2 Adult T - Motley Crue, black, Med

3 Adult T - Grateful Dead, tie die, Sm

...and you need to replace:

"Adult T - Grateful Dead," with "Grateful Dead T-Shirt,"

This is where the \1, \2, \3 abilties of Notepad++ version 6+ comes in very handy. First you define parts one and two in parenthesis, so as in the #7 example above you'd change it to this instead:
Search for:
(Adult T - )([0-9a-zA-Z ]+),
and replace with:
\2 T-Shirt,

The above tells Notepad to find the text "Adult T - " and any string after it until you hit a comma. Then in the last line above, it says to replace it with what is in the 2nd parenthesis and to add T-Shirt to it so "Adult T - Led Zeppelin," becomes "Led Zeppelin T-Shirt,". Works like a charm!

By reading and studying the above examples, you should be able to modify the regex expressions to do just about anything. I am using only simple regular expressions here to make it easier to understand because most of us have a terrible time understanding all the regular expression rules.

How to Add Custom Fonts to Windows

Here we discuss how to add fonts to your Windows OS. You may find this necessary to use new fonts in Photoshop or any other program running under the Windows OS.

Here are the simple steps:

  1. download the .ttf file from any free fonts website such as one I found here: http://www.dafont.com/
  2. unzip the file you download from dafont.com and from your Windows desktop, simply double click on the .ttf file(s) one at a time and Windows will know what to do with them. You'll only have to click the "Install" option in the pop up window that opens when you double click on the .ttf file.

Summary

Yes, that's really all there is to do! Now open your Photoshop or other program you wanted to use a custom font in and it will be there now! Just like magic!