Posts Tagged ‘text’

How to force the browser to reload CSS and JavaScript files

When editing the CSS and JavaScript of a site, there is a slight chance that the user may get the old versions, which at best will cause a lot of complains and at worst will cost you a lot of lost customers. The reason for this is that browsers cache static content like CSS and JavaScript. However, telling a browser to reload them is not that hard to do. All it takes is a little trick that will force our friendly browsers into thinking that the CSS and JavaScript are dynamic content.

Before we go on, let us take a look at how we specify the CSS and JavaScript to be used within HTML. Normally we have something in the line of:

<link rel="StyleSheet" type="text/css" href="/static/style.css">
<script src="/static/js/script.js" type="text/javascript"></script>

Where style.css and script.js are our files. Naturally CSS files are specified with the href attribute of the link tag, while JavaScript files are included using the script tag. Now, let’s take a look how we can make our browser reload CSS and JavaScript every time:

<link rel="StyleSheet" type="text/css" href="/static/style.css?version=15">
<script src="/static/js/script.js?version=15" type="text/javascript"></script>

“Now what is that “version”?”, you are probably thinking. Well it’s nothing. No really, it does absolutely nothing. You can use ?favouritesite=onlinehowto.net15 if you want. It would have the absolutely same effect.

“But what does it do?”, you are probably thinking. “This looks just like passing GET variables.” Exactly!

The browser cache uses a pretty complicated mechanism, but there is one thing that you should know for sure index.html?version=14 and index.html?version=15 are two different pages for the browsers, therefore it can’t rely on its cache, therefore it must get them again. But what happens on the server side? Well those arguments are ignored by our server and it simply supplies style.css and script.js.

Whatever language, technology, etc. you are using, you always keep a header file which is included pretty much everywhere so changing the version=<number> part after each revision is pretty easy. You can even make it a part of your site’s logic.

In conclusion, this trick may save you a lot of headaches related to cached CSS and JavaScript, and if you believe you may have some issues, we greatly encourage you to use it!

VN:F [1.9.18_1163]
Rating: 10.0/10 (2 votes cast)

How To Making Text photo In Adobe Photoshop Tutorial

How To Making Text photo In Adobe Photoshop Tutorial,In this Adobe Photoshop tutorial we are going to learn how to replace an image in text effect

[ View Full Tutorial ]

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)

How to choose a text editor for programming

How to choose a text editor for programming

Nowadays there are tons of IDEs (integrated development environments) and text editors designed specifically for programmers. Of course, a simple editor (e.g. Notepad) will always work fine, but if you are looking for a more sophisticated approach to programming and most of all – if you are going to spend a lot of time using a given programming language, it is best you choose an IDE/editor.

When choosing the proper tool one should consider the two options – IDE or editor. IDEs provide a lot more language specific functionality like autocomplete, code refactoring, compiler/interpreter, etc. while on the other hand editors provide (at best) syntax highlighting, indentation, autocomplete of keywords and some other basic features. However, editors are easier to get used to, easier to master and are the best choice for inexperienced users (and for a great part of the interpreted languages). In this article we will present you with what we think is the best approach to choosing an editor. If you have experience and prefer using an IDE, have a look at this article.

While we are still at the beginning, we should note that we expect from the reader to have already chosen the language(s) he will use and is quite aware to what extent he will use the language, that is to say he should know will he write “Hello World!”s or will he “go deeper”.

Good places to search for a text editor are Open Source indexing sites and web-based source code repositories (e.g. SourceForge.net). You would be surprised at the variety of choices. Look for editors that are suitable for you platform. Find editors that are specifically written for the language of your choice or support it. Read user comments regarding those editors that match your criteria.

Try the two classic choices – Vim and Emacs. Using either of them is pretty much like driving a car – you start it, have no idea what are you doing, get used to it and start driving. And similar to driving a car you can drive it at 200 mph or do drifts, etc. Or alternatively, you can drive around peacefully without maxing out your editor’s performance.

If Vim and Emacs are a bit too much for you, you can try simpler editors. Still try not to make compromises with your tool. If other editors don’t provide the minimum features you require, don’t put up with them, prefer the more complex ones – it is better to spend a day learning how to use a new tool than too lose a lot more time making up for the bad tool’s flaws. For example, if you are going to use Python, the least your editor should provide is syntax highlighting and indentation.

If you are a Windows user, take a look at Notepad++. It is a wonderful editor with syntax highlighting for many languages, indentation, it supports multiple files open in tabs or in different instances, split screen and many more. You can even create your own highlighting rules if the language is not supported (although I have used that feature only when I wrote in Scheme). You can customize your highlighting (change colors, etc.) and it is completely free.

Plan ahead. Choose an editor that will suit your needs for as long as possible, because the whole switching tools process is kind of hard. Still try not to plan too much ahead. If you are a beginner, try to choose something that you will become familiar with fast, otherwise your chosen editor may be confusing. Later you can choose a more complex editor.

If you have used a different editor before and want one with more functionality or you have used complex editors for other languages, choose a complex editor, language-specific or not.

Finally if you want more advanced features like code completion, project management or refactoring, maybe an IDE is the better choice for you.
Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)

Introduction to JavaScript Pop Up Boxes

Boxes of joy
As annoying as they may be, JavaScript popup boxes are a good way to alert users to some relevant information, confirm a user’s decision, or collect some text input from a user. JavaScript offers three popup boxes to help us accomplish this. They are the alert box, the confirm box, and the prompt box which prompts the user to input some text. Let’s take a closer look at what these boxes can do for us.

The alert box
If you want to be absolutely sure that some information gets through to a user, you may want to try using an alert box. This is a simple (slightly annoying) but effective way of getting your message across. The syntax for an alert box is alert(“……..”); and is very easy to implement in your code. Have a look at the following code:

<html><head><title> Alert Boxes </title><script type="text/javascript">function showAlertBox(){alert(" Yay! My first alert box ") };</script></head><body><input type="button" onclick="showAlertBox();" value="Show Alert box" /></body></html>

As you can see above, we’ve created a function called ShowAlertBox(). All this function will do is make an alert box popup with the text that we specify in our alert() method. With an alert box, the user will have to click ok to proceed. Save the above code to your desktop as alertboxes.html, load it up into your browser, and click the button. You should see an alert box appear in the center of the screen. Fun, right? Let’s move on to our next oh so amazing box, the confirm box.

The Confirm Box
Similar to the alert box, the confirm box will pop up in the center of the screen once it is called. The main difference is that, unlike the alert box, the confirm box allows a user to select yes or no, and will return a value of true or false based on which option they’ve selected. Combining this with the alert box and an if statement, our next code example will popup a confirm box for the user,and then alert them to which option they’ve chosen. Here’s what the code looks like:

<html><head><title>Confirm Boxes </title><script type="text/javascript">function showConfirmBox(){var c = confirm("Would you like to continue"); if (confirm == true) { alert ("You clicked Ok"); } else { alert("Ahhh, you clicked Cancel"); }};</script></head><body><input type="button" onclick="showConfirmBox()" value="Show Confirm box" /></body></html>
As you can see, this is very similar to the alert() function, except, once again, it gives the user an option to select either OK or Cancel.

The Prompt Box

The prompt box creates a popup box that a user may enter text into. If we set the value of the prompt box to a variable, we can take the text that the user provides and use that to manipulate our program. In this example, we’ll prompt the user to enter their name. Once that’s done, we’ll take the name and write it back out to the screen with a warm and fuzzy greeting using document.write(). Let’s take a look at the code to see how it works:

<html><head><title>Prompt Boxes </title><script type="text/javascript">function getName(){ var name = prompt("What is your name"); var theDiv = document.getElementById(”greeting”); theDiv.innerHTML = "Hello, " + name + " How are you today?";};</script></head><body><div id="greeting"> </div><input type="button" onclick="getName()" value="Enter your name" /></body></html>

Running this script and pressing the “enter your name” button will result in an oh-so-awesome prompt box being presented to you, and if you enter your name, you’ll be cordially greeted by the browser. Two quick things to point out. One is that I’ve used the getElementById() method on the document. This tells JavaScript to scan the entire current document and find any element with the ID that I’ve specified. Get used to this one, you’ll use it a lot. In our case, the method returns the div element with the ID of greeting. Once JavaScript finds the right div, it takes the name from our prompt box and injects it, along with some other friendly text, into the div via the innerHTML attribute.

Final thoughts

We’ve now seen how we can alert a visitor to something important in our program, how to confirm that they’d like to perform an action, and how to accept a text input from them. These tools will come in plenty handy in the future, and are just plain fun to mess around with anyway. Now, I think it’s a good time to learn about unobtrusive javascript. This notion basically states to you should never use JavaScript to be a jerk. Repeated pop ups and alerts will only shy your users away, so be sure to implement these techniques only when needed. Join me in my next tutorial for a more thorough look at JavaScript functions, what they accomplish, and how to write your own. See you then! Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.1/10 (11 votes cast)

How to remove the “Shortcut” from new shortcuts in Windows 7

There is one thing I find quite annoying in Windows 7 (and Vista) and that is that when you create a shortcut to a file the text “ – Shortcut” is added to the name of the shortcut. For example a shortcut to the file test.txt will be named test.txt – Shortcut: Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (10 votes cast)

Change the default source viewer in Internet Explorer

By default Internet Explorer opens the source of web pages using Notepad. In lots of cases this does the work, but in some cases we need a more powerful text editor (like Notepad++ for example). Well, here is a little tweak which will make Internet Explorer use a text editor of our choice for viewing source. Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)

How to change the source viewer in Opera

I’m a great fan of Opera (the browser), but if there is one thing that has always bothered me it’s that its source viewer sucks. Sure it uses different colors for JavaScript and stuff like that, but have you ever tried searching for text using it? It barely highlights the text that matches. Not to mention luxuries like highlighting the corresponding tag to the one you have selected, regular expressions, etc. But, what Opera’s source viewer lacks in functionality, Opera makes up with the ability to use an external program for viewing source code. In this tutorial we will show you how to make Opera use Notepad++ as its source viewer. Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)

Make the Windows Command Prompt wider

It is quite annoying that the Windows Command Prompt is limited to 80 symbols per row. This makes reading of certain data a lot harder. Not to mention trying to copy a line of text that is positioned on two lines. So in this tutorial we will show you how to edit the length of line. Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)

Using JavaScript Popup Boxes

You’ve seen them all around the Web. Little popup boxes that pop right inside your browser. If you are wondering “How do websites do that thing?”, then wonder no more. It’s all a matter of a simple JavaScript command. Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 3.0/10 (1 vote cast)

How to modify the system fonts in Windows 7

By default Windows uses the Segoe UI font for almost everything. This includes title bars, message text, context menu text, menu text, etc. However, if you feel like it, you can easily modify the system fonts to suit your aesthetic view. Read the rest of this entry »

VN:F [1.9.18_1163]
Rating: 0.0/10 (0 votes cast)