introducing user interface Javascript_&_Jquery

I think we have to know about the user experience.That means now i'm going to write about the user interface.Coding in the front-end of application known as user interface,in scripting language we have to encoded our code by < script > tag. In css we have to encode by this:

< script type="text/css">< /script >

And in javascript we have to encode by this:

< script type="text/javascript" >< /script >

Usually this kind of script works when browser load the page or depending user actions. So that it's called client side language.
Now I'm going to discuss about some basic javascript coding.
Write to the Document with JavaScript

document.write("My First JavaScript coding");

Change HTML elements with JavaScript

document.getElementById("demo").innerHTML="My First JavaScript";

Here "domo" is the id of any HTML elements.
we can also add an external script page in our main page by this way:

<script src="myScript.js"></script > 

One more thing I'm telling you that there is an alternative way to write script using Jquery. for this we need to add a script at the beginning of the root html file. also you can download this jquery file from this link: Jquery Link and set it to your local folder and embed it as like this:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

The jQuery API has a number of hosts that have recent and up-to-date versions:

• http://code.jquery.com/jquery-latest.min.js - Most recent version, jQuery hosted
• http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js - Version 1.x family, Google hosted
• http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js - Version 1.9.1 family, Google hosted
• http://ajax.microsoft.com/ajax/jQuery/jquery-1.9.1.min.js - Version 1.9.1, Microsoft hosted

one and only theme of using Jquery is that "Do a lot write short".

Need to print home url in wp php file?

<? php echo home_url(); ?>

All about Wordpress Post

@ You know the category name want to know the category ID :

<?php
$cat_id=get_cat_ID("style");
echo $cat_id;
?>

@ You know the category name of category ID want to post Name, post ID,  featured image, post content: 

<?php
$posts_array = get_posts( $args );
?>

Here is the definition of the $arg:

<?php
$args = array(
    'numberposts'     => 5,
    'offset'          => 0,
    'category'        => ,
    'orderby'         => 'post_date',
    'order'           => 'DESC',
    'include'         => ,
    'exclude'         => ,
    'meta_key'        => ,
    'meta_value'      => ,
    'post_type'       => 'post',
    'post_mime_type'  => ,
    'post_parent'     => ,
    'post_status'     => 'publish',
    'suppress_filters' => true ); 
?>

I think it will be better to see an Example:

global $post;

<?php
$cat_id=get_cat_ID("style"); // get the category Id
echo $cat_id;    // print the category Id 
$args = array( 'numberposts' => 9,'order'=> 'ASC','category' => $cat_id );

$myposts = get_posts( $args );
foreach( $myposts as $post ) : setup_postdata($post);
echo $post->ID;   // print the Post ID
?>
<?php the_title(); ?>
<?php    
$feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );// get the Featured image
echo ""; // Print the image
endforeach; ?>

EXCLUDING PAGE NAME FROM NAVIGATION BAR IN WORDPRESS

Some-time we have to hide the page name from navigation bar. Let see how can we hide the page name. it's very simple if you get help from a plugin "Exclude Pages".

1. Go to you admin area > Plugins > Add new

• make a search with this plugins "Exclude Pages"
• click in install now then okay
• click on "Activate Plugin"

2. Now Create a new page

• Pages > Add new

3. in this Page you can find the "Exclude Pages" div with a check box "Include this page in lists of pages"

• if you unchecked the check Box this Page is not visible in the front-end.

Get Log in Form in wordpress

simply render the log in from in wordpress is so simple:

&lt?php
wp_login_form( $args );
?&gt

Here is $args  definition   :

&lt?php
$args = array(
        'echo' => true,
        'redirect' => site_url( $_SERVER['REQUEST_URI'] ), 
        'form_id' => 'loginform',
        'label_username' => __( 'Username' ),
        'label_password' => __( 'Password' ),
        'label_remember' => __( 'Remember Me' ),
        'label_log_in' => __( 'Log In' ),
        'id_username' => 'user_login',
        'id_password' => 'user_pass',
        'id_remember' => 'rememberme',
        'id_submit' => 'wp-submit',
        'remember' => true,
        'value_username' => NULL,
        'value_remember' => false );
?&gt

Showing Current Loged in User information

To determine the current user info:

<?php
$current_user =wp_get_current_user();
echo "Welcome".$current_user->user_login;
echo 'User email: ' . $current_user->user_email;
echo 'User first name: ' . $current_user->user_firstname;
echo 'User last name: ' . $current_user->user_lastname;
echo 'User display name: ' . $current_user->display_name;
echo 'User ID: ' . $current_user->ID ;
?>

Loged in Or Not User check in wp

Display different output depending on whether the user is logged in or not.

<?php
if (is_user_logged_in()){
    echo "Welcome, registered user!";
}
else {
    echo "Welcome, visitor!";
};
?>