When you test interactivity of a web page by clicking a link or submitting a form, you sometimes don’t want to be redirected to a new page. Using JavaScript in your browser’s console, you can easily make this happen.
$0.addEventListener("click", function(e) {
e.preventDefault();
});
Here’s how you f*$%-ing do it! Just wrap the content you want to f*$%-ing hide in this client-specific conditional.
<!--[if !mso 9]><!-->
This will not appear in Outlook on Windows.
<!--<![endif]-->Since you’re probably using HTML tables to structure your emails, and you’re probably using CSS classes to hide and show different duplicate content for desktop and mobile, your code will probably look something like this:
<style>
.showOnMobile {
display: none;
overflow:hidden;
}
@media screen and (max-width:684px) {
.showOnMobile {
display: block !important;
}
}
</style><!--[if !mso 9]><!-->
<td class="showOnMobile">
This will not appear in Outlook on Windows.
</td>
<!--<![endif]-->
There you have it. Now go and do something useful with your time instead of f*$%-ing around with HTML emails all f*$%-ing day long!
I recently need to build a simple PHP script but I didn’t feel like spending a lot of time configuring a web server, e.g. Apache. and having it support PHP. It turns out that PHP has its own built-in server and it’s super easy to use. Here are the steps:
If you want to start the server in a particular document root directory, e.g. c:/Downloads/foo, you can do
php -S localhost:8000 -t c:/Downloads/foo
View the PHP built-in server documentation
cd C:\Users\abdul\Documents\Projects\zabuun.com
C:\Users\abdul\Documents\Projects\zabuun.com>”C:/Program Files/PHP/php” -S localhost:8001
Create a new repo in GitHub called “test” and check the checkbox to initialize it with a README.md file.
This repo called “test” will contain a default branch called “master”. On your local machine, this GitHub repo is called “origin” by default because it is the repo you “originally” cloned from. The “master” branch is usually used for production. Together, this repo and branch are referred to as “origin/master” (remote name / branch name).
If you need a separate branch for development, you can create it and call it “develop”. If you create this branch in the “test” repo on GitHub, it will be called “origin/develop”.
In GitHub, get the URL to clone the repo, e.g. https://github.com/javanigus/test.git
On your locale machine, go to a folder where you want this project to exist, e.g. /Users/ayahya/Projects/
cd /Users/ayahya/Projects/
git clone https://github.com/javanigus/test.git
This will create a folder that is the name of the repo, e.g. “test”
cd test
Since it says “master*”, then the files within it are set up to track remote branch “master” from origin.
Using the “ls” command, we see the same, one file (README.md) that is in GitHub.
git log
HEAD is a reference or pointer to the last commit in the currently checked-out branch (master). Notice that origin/master (remote) and origin/develop (remote) and local master and local develop are in sync because they are listed on the same line.
git remote
We see that we only have one remote repo called “origin”.
git checkout develop
Since it says “develop*”, then the files within it are set up to track remote branch “develop” from origin.
git branch
Since there is a * beside “develop” and it is highlighted, the local files are set to track remote branch “develop” from origin.
In this case, I added the text on line 3.
git status
The README.md file has been modified.
git checkout - README.md
git status
The local branch is up to date with origin/develop on GitHub.
git status
git add README.md
or
git add .
git status
git reset HEAD README.md
git status
git add README.md
git commit -m "added one line"
git status
Now, the local “develop” branch is ahead of the remote “develop” branch (origin/develop) by 1 commit. Also, there is nothing else to commit and the working tree is clean.
This shows that local “develop” branch is ahead of local “master” branch, remote “master” and remote “develop” by 1 commit.
We’ll push local branch “develop” to origin/develop on GitHub.
git push origin develop
On GitHub, in the “develop” branch, you’ll see the added line.
Now we see that both local and remote “develop” branches are in sync and ahead of local and remote “master” branches by 1 commit.
git checkout master
The local “master” branch doesn’t have the changes in “develop”. Let’s merge the changes from the local “develop” branch into the local “master” branch.
git merge develop
git status
The local “master” branch is now ahead of the remote “master” branch (origin/master) by 1 commit.
Now we see that local “master”, local “develop”, and remote “develop” are in sync and ahead of remote “master” by 1 commit.
We’ll push local branch “master” to origin/master on GitHub.
git push origin master
git status
The local branch is now up-to-date with origin/master on GitHub.
On GitHub, in the “master” working tree you’ll see the added line.
Now all branches, local and remote, are in sync.
In this case, I added line 4.
git status
We see that our local “master” branch is in sync with remote “master” branch even though we just committed a change in remote “master”.
In order to see what has changed remotely, run git fetch.
Now, we correctly see that our local “master” branch is behind the remote “master” branch (origin/master) by one commit.
git pull
git status
Local and remote “master” branches are in sync again.
Now we see that local and remote “master” branches are ahead of local and remote “develop” by 1 commit.
To see a change in a particular commit, run git diff on the commit, e.g. to see the most recent change (commit 850d7dad8bde14775ea640be860a04c9d061fa41), we run
git diff 850d7dad8bde14775ea640be860a04c9d061fa41~ 850d7dad8bde14775ea640be860a04c9d061fa41
This time I added line 5.
We see that local “master” is behind remote “master” by 1 commit, as expected.
I added line 5
Now we see that local and remote master have each diverged because we didn’t do a pull before committing.
We see a conflict because the change in remote “master” and local “master” was in the same file and on the same line (line 5).
Open the file containing conflicts and edit it.
Since we want to keep both lines, just remove the conflict divider markers.
To mark the conflict as resolved, use “git add” and then check the status.
We see that the conflicts have been fixed but we are still merging.
To avoid having diverged commits and pull conflicts, always do a git pull before committing.
We see that
Now local and remote “master” are in sync and are ahead of local and remote “develop” by 4 commits.
Adding your own music or audio to a video clip is something many people like to do. Fortunately, this is very easy using Corel VideoStudio. Below are steps to add music to a video.
Insert media files, e.g. a video and an audio file
Continue reading Easily Add Music to Video Using Corel VideoStudio
When you’ve got a bunch of images to process, IrfanView makes the process simple and quick. Here’s an example of how to
Open IrfanView and do the following:
When you need to annotate a document and explain certain parts of it, using arrows can be very helpful. If you’re on a Mac, adding arrows, both straight and curvy, is very easy using the Preview application. Here’s how to do it
You can also create straight lines by drawing a line. Preview will detect that you are trying to draw a line and make it straight for you.
If you’re looking for a simple and handy online HTML, CSS and JS playground, you might light LiveWeave. You don’t have to create an account to get started and the UI is pretty polished.
Continue reading LiveWeave: An Online HTML, CSS, JS Editor with Live Preview and Handy Tools
When you’re testing or developing a simple HTML-based website, you don’t need to go through the hassle of installing and configuring Apache or some other server. Following are two simple options:
If you’re on a Mac, then Python is probably already installed and you can just start up the server from the folder containing your website files using the command: python -m SimpleHTTPServer. If you’re on Windows, you can download Python and then run the command. Detailed instructions can be found on Mozilla’s website.
BrowserSync is another option that has the added benefit that it watches changes to your website files and if it detects a change, it’ll reload the browser for you.
