Showing posts with label Blogging. Show all posts
Showing posts with label Blogging. Show all posts

Saturday, November 9, 2013

Creating custom HTML tags which support all Major Browsers

No comments:
Do you know that we can create custom HTML elements/tags? when i got to know about it i was like WOW! that will be kinda awesome and hard. But later when i researched about it i found it's really easy for anyone to create custom HTML elements. You don't need to do thousands of lines of coding.





For creating a HTML element/tag you just need to write the name of it like the standard HTML element/tag.
For example:
<computer brand="Acer" price="28,900" ratings="4" id="pc">Acer Aspire R7</computer>
 you are done by creating a custom HTML element. But this will only support all major browsers, excluding Internet Explorer.

To make the custom HTML tag work with Internet Explorer you'll just need to write a single line of Javascript.
<script type="text/javascript">
   document.createElement("computer");
</script>
this will create an HTML element named as "computer".
Another point to note is, by default a custom element has a display inline. But you can change that with CSS.
<style type="text/css">
   #pc {
      display:block;
   }
</style>
Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:


To learn more: http://www.x-tags.org/

Thursday, November 7, 2013

Using Header function in PHP

No comments:


Header function in PHP is quite powerful function. You have came across with such situations like: if some condition is false then the user should re-directed on the Index page of your website or may be after some seconds he should. Also Header function is useful while send the Content type of your webpage.

PHP: Re-directing to a webpage using Header Function.
<?php
   if(isset($_GET['id'])) {
        // Further Code..
   }else {
        header("Location: index.php");
   }
?>

PHP: Re-directing to a webpage after 10 seconds using Header Function.
<?php
   if(isset($_GET['id'])) {
       //Further code...
   }else {
       header("Refresh: 10; url=index.php");
   }
?>

PHP: Header Function to output a PDF file.
<?php
   header('Content-type: application/pdf');
?>

PHP: Header Function to convert PHP file into Text File.
<?php
   header('Content-Type: text/plain');
   echo "This is just a text file...we have converted a PHP file into a Plain Text File.";
?>

PHP: Header Function to convert PHP file into XML.
<?php
   header("Content-type: text/xml");
   echo "<?xml version='1.0' encoding='ISO-8859-1'?>";
   echo "<person>";
   echo "<name>Ashwin Pathak</name>";
   echo "<age>14</age>";
   echo "<twitter>@TheCodePress</twitter>";
   echo "</person>";
?>

Their are many other header functions you'll discover it by searching.

Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:

Monday, October 21, 2013

Preventing PHP websites from SQL injections

1 comment:
SQL injections are another pain for developers. If you have created a users database then you might save the users: name and password. But what if any hackers breaks the security of your website and get in to your users account unethically. So this might make your users not to trust on you and soon many others will leave your website.
What is SQL injection:
SQL injection is a way of breaking the websites SQL query and customize it according to the hacker.
For example, if your website query for user to login is:
$u = "Ashwin";
$p = "TheCodePress";
mysql_query("SELECT * FROM users WHERE uname='$u' AND upass='$p' ");

But if i'm a hacker then i'll simply do something like this to break the security of your login system:
$u = "Ashwin' -- ";
$p = "Hacked";
mysql_query("SELECT * FROM users WHERE uname='$u' AND upass='$p' ");

So, what i have done ?
I have simply entered my correct username but after that i have added ' -- and this means comment in SQL.
So we have commented the rest of the portion of the query. That means we now don't need to enter password, we'll directly login into the website.

How to Solve this problem:
Well, the best way to do it without using any library or API is to use in built PHP functions. Such as mysql_real_escape_string(); and htmlentities();
If you are using mysql_real_escape_string function then all the vulnerable symbols will be parse, but it will parse safely.

PHP Code: So the code will be something like this:
$u = mysql_real_escape_string("Ashwin' -- ");
$p = mysql_real_escape_string("Hacked");
mysql_query("SELECT * FROM users WHERE uname='$u' AND upass='$p' ");

Is their any other better way to do it?
Yes, you can use the Library such as PDO or MYSQLI.
If you are more familiar with object oriented programming (OOP) then i'll prefer you to go with PDO.
Soon, i'll be too writing tutorials about PDO and Mysqli. You can learn it now on PHP manual.

Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:

Wednesday, October 16, 2013

Protecting your website from Vulnerable Script Tags and Codes

No comments:


It's really important for you to protect your website from hackers, but without removing any features from your website.
In this post we are going to understand how to solve the problem of XSS - Cross Site Scripting problems.

What is XSS:
Cross-site scripting (XSS) is a type of computer security vulnerability typically found in Web applications. XSS enables attackers to inject client-side script into Web pages viewed by other users. A cross-site scripting vulnerability may be used by attackers to bypass access controls such as the same origin policy.
                                                                                                                                -Source Wikipedia

Now to prevent our website from XSS attack, we are going to use a PHP function called: htmlentities()
This function of PHP will help your website to parse all harmful tags safely.

For example, if you have a website which displays comments submitted by the user and that comment system is XSS vulnerable, then if a user will enter some comment like this:

Javascript Code:
<script type="text/javascript">
     window.location = "http://www.google.com";
</script>

and now this comment is stored in your website's comment database. So whenever any user will meet the page where this comment is loaded from your database. Then the user will re-directed to the specified website.

So to prevent this problem we are going to use PHP function: htmlentities()
This function will replace all the < > / " ' = & and other symbols to a non-vulnerable signs. Like to display and in your website we use HTML Entities: &amp;
So in the similar way we are going to covert the vulnerable symbols in to non vulnerable HTML Entities.

You'll just need to wrap htmlentities() to the variable from which you POST the comment to the database.

PHP Code:
<?php
   $comment = htmlentities($_POST['comment_area']);
?> 

So that's how you can protect your website from XSS. In the next post we'll be discussing about how to prevent our website from getting hacked using SQL-injections.

About the javascript code, if we parse it using the htmlentities() function then this is the safe result and this can be added in our database.

Result:
&lt;script type=&quot;text/javascript&quot;&gt;
window.location = &quot;http://www.google.com&quot;;

&lt;/script&gt;

What we have done:

PHP Code:
<?php
$comment =
<<<comment
<script type="text/javascript">
      window.location = "http://www.google.com";
</script>
comment;

echo htmlentities($comment);
?>

Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:

Monday, October 14, 2013

Counting your website's loading time using PHP

No comments:


Counting your website's loading time is very useful and helpful for you to know that you need to make it more efficient or not.
Here, in this tutorial we are going to use PHP microtime() function to get the time and we'll be formatting it using number_format() function.
PHP code:
<?php
$mt = microtime(true);
        $format_time = number_format(microtime(true) - $mt, 2)." Seconds";
echo $format_time;
?>

If you are trying this code block on your on a blank page then probably you'll get 0.00 Seconds in results.
So to test it on a blank page follow this block of code:

PHP code:
<?php
$mt = microtime(true);
file_get_contents("http://www.thecodepress.info");
        $format_time = number_format(microtime(true) - $mt, 2)." Seconds";
echo $format_time;
?>

I'll always recommend you to use this but if you don't want to display it on your website then you can do something like commenting it something like this:

echo "<!--".$format_time."-->";

So after using that method the seconds will display in your website's HTML source code.
Another method which some other sites are using is to add the seconds at the bottom of the page (footer) you can too follow that.

Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:

Saturday, September 21, 2013

Getting Page URL using Javascript

2 comments:


Getting Page URLs using Javascript is very useful in real life projects, it's been used by Facebook, Twitter for their share/tweet buttons, because when we click on the share button then we get the URL of the page we are browsing, and that's done using Javascript.


var url= "";
if (typeof this.href === "undefined") {
    url = document.location.toString().toLowerCase();
}
else {
    url= this.href.toString().toLowerCase();
}
Liked the post ? subscribe us with your email to get upcoming tutorials directly in your inbox:

Thursday, September 12, 2013

Fade effect on hover using CSS3

No comments:

These day's many websites, blogs have fade effects in their links which is trigger when user hover their mouse on the link and it's mostly implement using Javascript. In this article we'll do that using CSS3.

Wednesday, August 14, 2013

Simple and awesome CSS3 button design.

1 comment:
Their are many websites which shares the code for creating new and awesome CSS3 buttons not only buttons their are also many other websites which shows some awesome styles for HTML/HTML5 element as well as inputs. In this post i'm sharing two button styles which is usually use for designing submit buttons.

When i was new to CSS3 what i used to do is to go on many CSS3 generators website and generate a button and try to understand the code what they have used. You can also try that after reading this post.

CSS: Style properties for button.
input[type=submit] {
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background-color:#ededed;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}

input[type=submit]:hover {
	background-color:#dfdfdf;
}

input[type=submit]:active {
	position:relative;
	top:1px;
}
CSS: Style properties for button.
input[type=submit] {
	  font-family: Arial;
	  color: #ffffff;
	  font-size: 17px;
	  padding:10px 15px;
	  text-decoration: none;
	  -webkit-border-radius: 5px;
	  -moz-border-radius: 5px;
	  border-radius: 5px;
	  -webkit-box-shadow: 0px 1px 5px #696969;
	  -moz-box-shadow: 0px 1px 5px #696969;
	  box-shadow: 0px 1px 5px #696969;
	  text-shadow: 1px 1px 3px #666666;
	  border: solid #3972b0 1px;
	  background: -webkit-gradient(linear, 0 0, 0 100%, from(#4bb007), to(#59d104));
	  background: -moz-linear-gradient(top, #4bb007, #59d104);
	  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#4bb007, endColorStr=#59d104);
	  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#4bb007, endColorStr=#59d104);
	  display:inline-block; /* IE is so silly */
}
input[type=submit]:hover {
	  background: #4bb007;
}
Have a look at the live demo also you can download the source file:

Friday, March 22, 2013

How to make a premium wordpress blog, without paying single buck!

2 comments:
Instead of writing a huge explanation on making a premium wordpress blog for free i thought to make a video of it. So it will be easier me to explain and also it will be easier for you to understand. So in this screen cast i'll be explaining you of creating a wordpress (WP) premium blog for free. Also i'll be introducing a free trusted web hosting service...