Search through Tutsocean codebase

Although we try to list all the tutorials in the top menu but if you are still unable to get your tutorial then you can search the topic by entering keyword in the following form.

Search From tutorials

Search From Questions Bank

Looking for Dummy addresses as per country?

Checkout the following address generators as per the country.

TH Address NZ Address IE Address GB Address AU Address Canada address

Our Vision

Our Vision is to make it easy for the students to learn by providing best study material and best code snippets for the developers so that they can get all in their hands from a single website and don't need to search here and there for the day to day codes.

Who we are

Tutsocean.com is a website which provides the best tutorials and study materials for the freshers as well as experienced developers. The best part is the content is free of cost for learning. You can copy and paste the code into your projects. We provide the tutorials for HTML, CSS, javascript, Jquery till now. These topics will get on going to increase by the time. fell free to choose your topic from the following listing and start your tour to that topic. Happy learning!!!!

Why People like us?

Free Tutorials

This website provide free tutorials for learning.

Better Tryit Editor

It provide better tryit editor in which you don't need to worry about the closing tags.

Clean Code

We provide clean and easy to understandable code so that you can learn more in less time.

Tryit Editor

Tutsocean is now providing the platform to try your code online. In the tryit editor - v2, your syntax will be properly highlighted. Along with that, you don't have to worry about the missing closing tags or closing braces because this editor will automatically close all the opening tags and braces. Sublime editor lovers will surely love it for its interface and features. Try it now!

Tryit - v1 or Tryit - v2

wetransfer

Best Place to share larger or small files over the world. Must give a try

Try now

All Topics

Following are some of the topics we provide for freshers as well as experienced peoples which are going to increase day by day

HTML

HyperText Markup Language, commonly referred to as HTML, is the standard markup language used to create web pages. Web browsers can read HTML files and render them into visible or audible web pages. HTML describes the structure of a website semantically along with cues for presentation, making it a markup language, rather than a programming language.

CSS

Cascading Style Sheets (CSS) is a style sheet language used for describing the presentation of a document written in a markup language. Although most often used to set the visual style of web pages and user interfaces written in HTML and XHTML, the language can be applied to any XML document, including plain XML, SVG and XUL.

jquery

jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. jQuery is the most popular JavaScript library in use today, with installation on 65% of the top 10 million highest-trafficked sites on the Web. jQuery is free, open-source software licensed under the MIT License. It needs js file to be included in your project to work properly.

PHP

PHP is a server-side scripting language designed for web development but also used as a general-purpose programming language. Originally created by Rasmus Lerdorf in 1994, the PHP reference implementation is now produced by The PHP Group.

Wordpress

WordPress is a free and open-source content management system (CMS) based on PHP and MySQL. Wordpress is installed within a web server, but a local computer can also be configured as its own web server hosting Wordpress for single-user testing or learning purposes.

HTML Intro

In this chapter, we will talk about the HTML intro or the basics of what is HTML. What is HTML? HTML is a language for describing web pages. From the … Continue reading HTML Intro →

HTML Basic Tags

HTML has a lot of tags that we can use to create simple to a very complex web page. Before going deep into the ocean of HTML tags, we should … Continue reading HTML Basic Tags →

HTML attributes

From this post, we will learn about the HTML attributes used to make the web pages and websites with static content. HTML Attributes are another important part of HTML markup. … Continue reading HTML attributes →

HTML Text Link ( HTML anchor )

Web pages can contain links that take you directly to other pages and even specific parts of a given page. These links are known as hyperlinks. In web world language, … Continue reading HTML Text Link ( HTML anchor ) →

HTML Tables

Tables are very useful to arrange in HTML and they are used very frequently by almost all web developers. HTML Tables are just like spreadsheets and they are made up … Continue reading HTML Tables →

CSS Display

The css display property controls the box’s type generated by an element. CSS Display Property The CSS specification defines the default display value for all the elements, e.g. the <div>element … Continue reading CSS Display →

CSS Visual Formatting

The visual formatting model typically explains how elements in the document tree are processed for visual media such as computer screen. CSS Visual Formatting Model The CSS visual formatting model … Continue reading CSS Visual Formatting →

CSS Units

Units are used to specify non-zero length value in CSS properties. Understanding CSS Units The units in which length is measured can be either absolute such as pixels, points and … Continue reading CSS Units →

CSS Dimension

The CSS dimension properties used to control the height and width of an element. CSS Dimension Properties The CSS provides several properties such as width, height, max-width and max-height etc. … Continue reading CSS Dimension →

CSS Overflow

The overflow property specifies the behavior that occurs when an element’s content overflows (doesn’t fit) the element’s box. CSS Overflow Property There may be a situation when the content of … Continue reading CSS Overflow →

select2 with sort using drag and drop

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet" />
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $(".chooser").select2({
      tags: true,
      width: 250
    });
    $("ul.select2-selection__rendered").sortable({
      containment: 'parent'
    });
  });
</script>
</head>
<body>
  <select class="chooser form-control" multiple="multiple">
    <option>yellow</option>
    <option>blue</option>
    <option>purple</option>
    <option>red</option>
  </select>
</body>

$(document).ready(function(){

$(".chooser").select2({

tags: true,

width: 250

});

$("ul.select2-selection__rendered").sortable({

containment: 'parent'

});

</script>

</head>

<body>

<option>yellow</option>

<option>purple</option>

</select>

</body>

jQuery Validation on Login Page

In this tutorial we learn how to “create a Login system & jquery validation“. The prestored username, password are verified from database whether both exists or not in our database, … Continue reading jQuery Validation on Login Page →

jQuery Validation on Registration Page

In this tutorial, we will learn about how to make “Registration system & jquery validation”. jquery will be used to validate the form with simple steps. we will also learn … Continue reading jQuery Validation on Registration Page →

jQuery Remove

In this tutorial you will learn how to use jQuery Remove property to removeÂ the HTML elements or its contents as well as its attribute from the document using jQuery. jQuery … Continue reading jQuery Remove →

jQuery Insert

In this tutorial you will learn how to use jQuery Insert to insert new elements or contents to the document using jQuery. jQuery Insert New Content jQuery provides several methods, … Continue reading jQuery Insert →

Get Latitude & Longitude from an address – php

Using cURL

<?php
$address = "Kathmandu, Nepal";
$url = "http://maps.google.com/maps/api/geocode/json?address=".urlencode($address);

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);    
$responseJson = curl_exec($ch);
curl_close($ch);

$response = json_decode($responseJson);

if ($response->status == 'OK') {
    $latitude = $response->results[0]->geometry->location->lat;
    $longitude = $response->results[0]->geometry->location->lng;

    echo 'Latitude: ' . $latitude;
    echo '<br />';
    echo 'Longitude: ' . $longitude;
} else {
    echo $response->status;
    var_dump($response);
}    
?>

<?php

$address = "Kathmandu, Nepal";

$url = "http://maps.google.com/maps/api/geocode/json?address=".urlencode($address);

$ch = curl_init();

curl_setopt($ch, CURLOPT_URL, $url);

curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);

$responseJson = curl_exec($ch);

curl_close($ch);

$response = json_decode($responseJson);

if ($response->status == 'OK') {

$latitude = $response->results[0]->geometry->location->lat;

$longitude = $response->results[0]->geometry->location->lng;

echo 'Latitude: ' . $latitude;

echo '<br />';

echo 'Longitude: ' . $longitude;

} else {

echo $response->status;

var_dump($response);

}

PayPal payment gateway integration in PHP

PayPal is an American international e-commerce business allowing payments and money transfers to be made through the Internet. PayPal is very popular payment gateway for every web project. This tutorial … Continue reading PayPal payment gateway integration in PHP →

Change the Default Search URL Slug in WordPress

WordPress doesn’t have SEO-friendly URLs for the search results page, which could lower your SEO ranking. This guide will be helpful if you want to change the default search URL … Continue reading Change the Default Search URL Slug in WordPress →

Create Taxonomy For a WordPress User

As we all know, “taxonomy” is a prominent feature provided by WordPress that we can allocate to a default post or custom post type. This feature is not available for … Continue reading Create Taxonomy For a WordPress User →

Add WordPress customizer fields using Customizer API

We are getting a lot of requests for a tutorial on how to Add WordPress customizer fields using Customizer API. This will be a handy tutorial for the WordPress developer who … Continue reading Add WordPress customizer fields using Customizer API →

WordPress Customize Forgot Password Email

In this tutorial, we will walk you through a very simple process regarding Customize Forgot Password Email. By default, WordPress sends an email with basic information when someone fills in the … Continue reading WordPress Customize Forgot Password Email →

Submit forms using jQuery validate and serialize

We were getting a lot of requests to write a tutorial on how to submit forms using jQuery validate and serialize. Now we got some time to write this tutorial … Continue reading Submit forms using jQuery validate and serialize →

.dcsPostSidebar .active{font-weight:bold;}.crayon-syntax{border:1px solid var(--tutsPrimary) !important;}#loader:after,#loader:before{content:"";}#loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;background:#fff;}#loader{display:block;position:relative;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;border:3px solid transparent;border-top-color:#3498db;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;}#loader:before{position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:3px solid transparent;border-top-color:#e74c3c;-webkit-animation:spin 3s linear infinite;animation:spin 3s linear infinite;}#loader:after{position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:3px solid transparent;border-top-color:#f9c922;-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite;}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}@keyframes spin{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}.crayon-syntax{background:#fff !important;border:2px solid #ccc !important;border-left:4px solid #19b9e7 !important;}p.header_text{font-size:16px;color:#fff;margin:0;background:var(--tutsPrimary);width:100%;padding:5px;}.copyright,.design{color:#fff;line-height:30px;min-height:30px;padding:7px 0;}.login h1.entry-title,.password-reset h1.entry-title,.register h1.entry-title{text-align:center;text-transform:uppercase;}.footer-bottom{background-color:#15224f;min-height:30px;width:100%;}.design{text-align:right;}#section1,#section2,#section3,#section41,#section42{padding-top:50px;height:500px;color:#fff;}.design a{color:#fff;}.round-avatars{-webkit-transition:-webkit-transform .8s ease-in-out;transition:transform .8s ease-in-out;}.round-avatars:hover{-webkit-transform:rotate(360deg);transform:rotate(360deg);}.no-js #loader{display:none;}.js #loader{display:block;position:absolute;left:100px;top:0;}body{position:relative;}.affix{top:0;width:100%;z-index:9999 !important;}.navbar{margin-bottom:0;}.affix~.container-fluid{position:relative;top:50px;}#section1{background-color:#1e88e5;}#section2{background-color:#673ab7;}#section3{background-color:#ff9800;}#section41{background-color:#00bcd4;}#section42{background-color:#009688;}.btn{cursor:pointer;margin:10px;border-radius:5px;text-decoration:none;padding:3px 10px;font-size:22px;transition:.3s;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;display:inline-block;}.btn:hover{cursor:url("http://cur.cursors-4u.net/symbols/sym-1/sym46.cur"),auto;}.blue{color:#55acee;border:2px solid #55acee;}.blue:hover{background-color:#55acee;color:#fff;}.green{color:#2ecc71;border:2px solid #2ecc71;}.green:hover{color:#fff;background-color:#2ecc71;}.red{color:#e74c3c;border:2px solid #e74c3c;}.red:hover{color:#fff;background-color:#e74c3c;}.purple{color:#9b59b6;border:2px solid #9b59b6;}.purple:hover{color:#fff;background-color:#9b59b6;}.orange{color:#e67e22;border:2px solid #e67e22;}.orange:hover{color:#fff;background-color:#e67e22;}.yellow{color:#f1c40f;border:2px solid #f1c40f;}.yellow:hover{color:#fff;background-color:#f1c40f;}.buttons{padding-top:30px;text-align:center;}body{--wp--preset--color--black:#000;--wp--preset--color--cyan-bluish-gray:#abb8c3;--wp--preset--color--white:#fff;--wp--preset--color--pale-pink:#f78da7;--wp--preset--color--vivid-red:#cf2e2e;--wp--preset--color--luminous-vivid-orange:#ff6900;--wp--preset--color--luminous-vivid-amber:#fcb900;--wp--preset--color--light-green-cyan:#7bdcb5;--wp--preset--color--vivid-green-cyan:#00d084;--wp--preset--color--pale-cyan-blue:#8ed1fc;--wp--preset--color--vivid-cyan-blue:#0693e3;--wp--preset--color--vivid-purple:#9b51e0;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple:linear-gradient(135deg,rgba(6,147,227,1) 0%,#9b51e0 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan:linear-gradient(135deg,#7adcb4 0%,#00d082 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange:linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red:linear-gradient(135deg,rgba(255,105,0,1) 0%,#cf2e2e 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray:linear-gradient(135deg,#eee 0%,#a9b8c3 100%);--wp--preset--gradient--cool-to-warm-spectrum:linear-gradient(135deg,#4aeadc 0%,#9778d1 20%,#cf2aba 40%,#ee2c82 60%,#fb6962 80%,#fef84c 100%);--wp--preset--gradient--blush-light-purple:linear-gradient(135deg,#ffceec 0%,#9896f0 100%);--wp--preset--gradient--blush-bordeaux:linear-gradient(135deg,#fecda5 0%,#fe2d2d 50%,#6b003e 100%);--wp--preset--gradient--luminous-dusk:linear-gradient(135deg,#ffcb70 0%,#c751c0 50%,#4158d0 100%);--wp--preset--gradient--pale-ocean:linear-gradient(135deg,#fff5cb 0%,#b6e3d4 50%,#33a7b5 100%);--wp--preset--gradient--electric-grass:linear-gradient(135deg,#caf880 0%,#71ce7e 100%);--wp--preset--gradient--midnight:linear-gradient(135deg,#020381 0%,#2874fc 100%);--wp--preset--duotone--dark-grayscale:url("#wp-duotone-dark-grayscale");--wp--preset--duotone--grayscale:url("#wp-duotone-grayscale");--wp--preset--duotone--purple-yellow:url("#wp-duotone-purple-yellow");--wp--preset--duotone--blue-red:url("#wp-duotone-blue-red");--wp--preset--duotone--midnight:url("#wp-duotone-midnight");--wp--preset--duotone--magenta-yellow:url("#wp-duotone-magenta-yellow");--wp--preset--duotone--purple-green:url("#wp-duotone-purple-green");--wp--preset--duotone--blue-orange:url("#wp-duotone-blue-orange");--wp--preset--font-size--small:13px;--wp--preset--font-size--medium:20px;--wp--preset--font-size--large:36px;--wp--preset--font-size--x-large:42px;}.has-black-color{color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color:var(--wp--preset--color--white) !important;}.has-pale-pink-color{color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color:var(--wp--preset--color--vivid-purple) !important;}.has-black-background-color{background-color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color:var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color:var(--wp--preset--color--vivid-purple) !important;}.has-black-border-color{border-color:var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color:var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color:var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color:var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color:var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color:var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color:var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color:var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color:var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color:var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color:var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color:var(--wp--preset--color--vivid-purple) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background:var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background:var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background:var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background:var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background:var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background:var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background:var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background:var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background:var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background:var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background:var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size:var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size:var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size:var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size:var(--wp--preset--font-size--x-large) !important;}.g{margin:0px;padding:0px;overflow:hidden;line-height:1;zoom:1;}.g img{height:auto;}.g-col{position:relative;float:left;}.g-col:first-child{margin-left:0;}.g-col:last-child{margin-right:0;}@media only screen and (max-width: 480px){.g-col,.g-dyn,.g-single{width:100%;margin-left:0;margin-right:0;}}.um_request_name{display:none !important;}.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}blockquote{font-family:"Abril Fatface",cursive;position:relative;color:#e74848;font-size:2.8rem;font-weight:normal;line-height:1;margin:0;border:2px solid #fff;border:solid 2px;border-radius:20px;padding:25px;}div#hu-cookies-notice-consent-duration{display:none !important;}.hu-text-body{display:none !important;}div#hu-cookies-notice-about{display:none !important;}#post-228576 img{border:2px solid #1998d3;padding:5px;}p.fca_qc_quiz_title{display:none;}div.fca_qc_quiz svg.fca_qc_rectancle{margin-top:-3px;}p#fca_qc_question:before{content:"Q. ";font-weight:bold;}p#fca_qc_question{font-weight:bold;}#fca_qc_quiz_232042.fca_qc_quiz div.fca_qc_answer_div.fakehover,#fca_qc_quiz_232042.fca_qc_quiz div.fca_qc_answer_div:active{background-color:rgba(5,57,107,.38);}svg{width:auto;height:auto;margin:0;}figcaption{border-left:3px solid #30671a;padding-left:10px;background:#b7e0cb;margin-top:3px;}.crayon-theme-github-copy .crayon-toolbar .crayon-language,.crayon-theme-github-copy .crayon-toolbar .crayon-title{background:#ff7361 !important;color:#fff !important;}.green{color:#2ecc71;border:2px solid #2ecc71 !important;}.red{color:#e74c3c;border:2px solid #e74c3c !important;}.purple{color:#9b59b6;border:2px solid #9b59b6 !important;}.navigation.post-navigation a{display:inline-block;border:1px solid #ccc;border-radius:20px;padding:10px 18px;width:100%;}.navigation.post-navigation a:hover{background:#05396b;color:#fff;}label.hu-cookies-notice-consent-choices-3,label.hu-cookies-notice-consent-choices-2,label.hu-cookies-notice-consent-choices-1{display:none !important;}div#hu-cookies-notice-consent-choices{display:none !important;}div#hu-cookies-notice-consent-duration{text-align:center !important;}