WordPress - Call php file Via Ajax and jQuery
So today i loved to show how to use built - in ajax function for your theme or Plugin of WordPress site. Its easy to catch form values and perform operation through your php code and return the response through ajax and jQuery function.
1. Create form like this
<form id="new_post" name="new_post" method="post" action="" enctype="multipart/form-data">
<fieldset name="name">
<label for="title">Project Title:</label>
<input type="text" id="title" value="" tabindex="5" name="title" size="70"/>
</fieldset>
<!-- post Category -->
<fieldset class="category">
<label for="cat">Area:</label>
<?php wp_dropdown_categories( 'tab_index=10&taxonomy=category&hide_empty=0' ); ?>
</fieldset>
<!-- post Content -->
<fieldset class="content">
<label for="description">Summary/Excerpt/Abstract of Project :</label>
<textarea id="description" tabindex="15" name="description" cols="60" rows="10"></textarea>
</fieldset>
<!-- post tags -->
<fieldset class="tags">
<label for="post_tags">Additional Keywords (comma separated):</label>
<input type="text" value="" tabindex="35" name="post_tags" id="post_tags" />
</fieldset>
<fieldset class="submit">
<input type="submit" value="Post Review" tabindex="40" class="button" name="submit" />
</fieldset>
<input type="hidden" name="action" value="new_post" />
<?php wp_nonce_field( 'new-post' ); ?>
<label for="price">Your Expected Price:</label>
<input type="text" value="" name="price" id="price" />
</form>
2. and write the following line of code into a js file which you created to perform jquery and ajax operations.
jQuery(document).ready(function($) {
//#new_post is replaced with your Form id
$('#new_post').bind('submit', function() {
var form_data = $('#new_post');
var data = form_data.serialize();
data.action = 'mywptuts_post_new' ; // Your php function name here
$.post('/wp-admin/admin-ajax.php',data , function (response) {
alert(response);
});
return false ;
});
});
3. Then create your php file and add it with add_Actions function.
// php file
<?php
function mywpwtuts_post_new () {
//your plugin operation of posting form data and ajax operation to show the response
if( 'POST' == $_SERVER['REQUEST_METHOD'] && !empty( $_POST['action'] ) && $_POST['action'] == "new_post") {
$errors = new WP_Error();
$fields = array(
'title',
'features',
'post_tags'
);
foreach ($fields as $field) {
if (isset($_POST[$field])) $posted[$field] = stripslashes(trim($_POST[$field])); else $posted[$field] = '';
}
if ($posted['title'] != null )
$title = $_POST['title'];
else
$errors->add('empty_title', __('<strong>Notice</strong>: Please enter a title for your project.', 'kv_project'));
if ($posted['features'] != null)
$features = $_POST['features'];
else
$errors->add('empty_features', __('<strong>Notice</strong>: Please enter the features of your project.', 'kv_project'));
if ($posted['post_tag'] != null)
$tags = $_POST['post_tags'];
if(isset( $_POST['cat'] ) )
$post_cat = $_POST['cat'];
else
$errors->add('empty_category', __('<strong>Notice</strong>: Please choose your project category.', 'kv_project'));
//$errors = apply_filters( 'wp_insert_post', $errors, $posted['user_login'], $posted['user_email'] );
if ( !$errors->get_error_code() ) {
$new_post = array(
'post_title' => $title,
'post_content' => $features,
'post_category' => $post_cat,
'tags_input' => array($tags),
'post_status' => 'pending'
);
$pid = wp_insert_post($new_post);
wp_set_post_tags($pid, $_POST['post_tags']);
}
if( $pid) {
echo 'Your post has been posted and Waiting for Admin Approval' ;
} else {
echo ' Your post has not been posted , check and fill all necessary fields' ;
}
}
add_action("wp_ajax_nopriv_mywpwtuts_post_new ", "mywpwtuts_post_new ");
add_action("wp_ajax_mywpwtuts_post_new ", "mywpwtuts_post_new ");
?>
thats it your code is ready to communicate with your php and ajax functions.
00:38 1
Display all Post types and Custom Post types in Home Page
Creation of multiple post types can't be displayed all in your themes home page. All you have to do is to add the following code into your theme "functions.php" file or main plugin file to view it on your home page
<?php
add_filter( 'pre_get_posts', 'kv_wp_get_posts' );
function kv_wp_get_posts( $query ) {
if ( is_home() )
$query->set( 'post_type', array( 'post', 'page', 'custom post types', 'attachment' ) );
else if(is_front_page())
$query->set( 'post_type', array( 'post', 'page', 'custom post types', 'attachment' ) );
return $query;
}
?>
Here post, pages, custom_post types and attachments are athe post types, you can add your own custom post types which you registered already,
02:13 1
How to fix WordPress White screen Error
If you are working with WordPress more than a week you must happened to see this common error of White screen death. Its really irritating because we can't identify the actual error or what we did wrong ?. If you must be developer of WordPress Plugin or Theme , else you must be a user of WordPress. So here i will explain both of you.
First I am going to explain on User view. Because users can't find the actual root coding of Your WordPress.
User View to Solve it :
1. Possible way of solving the problem is to deactivate the plugin or a theme you installed lastly. It may have some errors in coding and not fixed well or not handled with error catching event.
2. Use a expert to find-out the thing which affected by your last plugin or theme. Because whenever you install a plugin or a theme, it may create certain data's into your WordPress database. So first you must find-out the things completely and remove it and delete the files in your wp-content folder.
3. Another Popular way is to deactivate all plugin and themes you installed and make a fresh install of (wp-content/ ) folder.
4. Ask your hosting server forum and call your domain hosting care.
Developer View to Solve it:
Developers last activity of your function you created on your plugin or theme file must have a error. You will know that and the error may be classified into 2 type.
1. Problem Persist on your hosting server.
2. Problem with your code.
1. Problem with Hosting Server
May be of your hosting server is not capable of handling your wordpress update. Many of the server tried to upgrade new features everyday. This may cause some problems. Ask your hosting server forums.
2. Problem with your Code
Most common mistakes i will bring it here.
- error because of the functions conflicting in nature. because wordpress is created for customization. So many built in function already built with it. You may write your code to conflict with its predefined code. Check the functionality before trying to code it yourself.
- Blankspace in your theme functions.php file . this could leads you to see a white screen .
- Blank Line it wp-config.php file, may be you tried to add some code on your wp-config.php file. and forgot to delete the created a bit of unknown blank line.
- File permission , if you are palying with file such as reading and writing of files. check the file psermissions first.
02:31 2
Wordpress 3.6 Features and New things
WordPress built for customization, be a CMS solution to customize to variety of platforms. So the reason for every web developers and web hackers love to work with WordPress. Over the past 10 years of history WordPress happen to see so many tremendous changes and advert its features. Here its the recent release of WordPress 3.6 and its features.
1.Post Formats :
Wordpress added its additional feature of displaying posts based on its post format. every customization needs to carryout different types of post and its formats.
2.Simplify the features and arrange it on a sequence order. wordpress built-in feature of post formats.
3. AutoSave option for saving the time and helps to solve the problem of loss of data. This would helps to save the post which prevents the loose of user data.
4. feature of Session Management on every login.
5. Locking of Posts. great feature of lock certain posts from all other people viewing.
and few built in themes of WordPress and revision management.
00:45 0
How to Manage Wordpress Pluse through Programmatically
With the new feature of wordpress 3.6 Heartbeat to trac all discussions and information's of your blog and pages. Heartbeat will help to organise all the comments and discussions of your blog. Also it interduces several features like AutoSave, Lock a article, and notifications of logon and logoff .
Which beats every 15 seconds. Also you can change the interval of beat. You can also stop beating for low processors. because it will take few CPU usage which is avoided on low processors.
Manage time gap :
<?php
/**
* Plugin Name: MyWP Tuts - Set Heartbeat pulse
*/
! defined( 'ABSPATH' ) and exit;
add_filter( 'heartbeat_settings', 'mywp_tuts_heartbeat_settings' );
function mywp_tuts_heartbeat_settings( $settings = array() ) {
$settings['interval'] = 60;
return $settings;
}
?>
remove the action by using the following code.
<?php
/**
* Plugin Name: MyWP Tuts - Set Heartbeat pulse
*/
! defined( 'ABSPATH' ) and exit;
remove_action( 'admin_init', 'wp_auth_check_load' );
?>
Debugging of the Tool
if you want to debug the tools. wp.heartbeat.debug of javascript function will give you the debugging informations and tools make it as TRUE we will debug heartbeat.
<?php
if ( typeof console !== 'undefined' )
wp.heartbeat.debug = true; // Show debugging info of heartbeat
?>
00:18 0
Prevent Wordpress SQL Injection Hacking
SQL injection describes a class of these attacks in which hackers embed commands in a URL that trigger behaviors from the database. wordpress SQL injection attack is increasing nowa days. These attacks can reveal sensitive information about the database, potentially giving hackers entrance to modifying the actual content of your site. Many of today's web site defacement attacks are accomplished by some form of SQL
Injection.
By the following code can help u to prevent it. Apache server have a file namely .htaccess add the below code in it.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_
METHOD} ^(HEAD|TRACE|
DELETE|TRACK) [NC]
RewriteRule ^(.*)$ - [F,L]
RewriteCond %{QUERY_
STRING} \.\.\/ [NC,OR]
RewriteCond %{QUERY_
STRING} boot\.ini [NC,OR]
RewriteCond %{QUERY_
STRING} tag\= [NC,OR]
RewriteCond %{QUERY_
STRING} ftp\: [NC,OR]
RewriteCond %{QUERY_
STRING} http\: [NC,OR]
RewriteCond %{QUERY_
STRING} https\: [NC,OR]
RewriteCond %{QUERY_
STRING} (\<|%3C).*script.*(\>|
%3E) [NC,OR]
RewriteCond %{QUERY_
STRING} mosConfig_[a-zA-Z_]
{1,21}(=|%3D) [NC,OR]
RewriteCond %{QUERY_
STRING} base64_encode.*
\(.*\) [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*(\[|\]|\(|\)|<|>|ê|"|;|\?|
\*|=$).* [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*("|'|
<|>|\|&#
x7B;||).* [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*(%24&x).* [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*(%0|%A|%B|%C|%
D|%E|%F|127\.0).* [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*(globals|encode|
localhost|loopback).* [NC,OR]
RewriteCond %{QUERY_
STRING} ^.*(request|select|
insert|union|declare).* [NC]
RewriteCond %{HTTP_
COOKIE} !^.*wordpress_
logged_in_.*$
RewriteRule ^(.*)$ - [F,L]
</IfModule>
20:22 0
Wordpress Remove Default Widgets
I was tried to find a solution to remove all the default widgets from my WP blog. I spend huge time to find s simple solution.Here is a complete code to remove all the default widget from your wordpress default widget.
function unregister_default_widgets() {
unregister_widget('WP_Widget_Pages');
unregister_widget('WP_Widget_Calendar');
unregister_widget('WP_Widget_Archives');
unregister_widget('WP_Widget_Links');
unregister_widget('WP_Widget_Meta');
unregister_widget('WP_Widget_Search');
unregister_widget('WP_Widget_Text');
unregister_widget('WP_Widget_Categories');
unregister_widget('WP_Widget_Recent_Posts');
unregister_widget('WP_Widget_Recent_Comments');
unregister_widget('WP_Widget_RSS');
unregister_widget('WP_Widget_Tag_Cloud');
unregister_widget('WP_Nav_Menu_Widget');
unregister_widget('Twenty_Eleven_Ephemera_Widget');
}
if you get advanced trick just post your comment below.
20:12 0
How to use Shadowbox.js on Wordpress Front End
Thickbox is older one now to use at front end of your WordPress site. Be a new one Shadowbox.js is useful to attract your visitors. Here i will guide you to get a shadowbox on your site.
1. first we need to download the Shadowbox.js script. form their site and unpack the zip file. Upload the folder within your themes directory.
2. add the following code into your theme file "functions.php" this will help you to add your shadowbox.js into wordpress settings.
function my_scripts_method() {
wp_enqueue_script( 'shadowbox', get_template_directory_uri() . '/includes/shadowbox/shadowbox.js');
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
function kv_enqueue_style () {
wp_register_style( 'shadow-style', get_template_directory_uri() . '/includes/shadowbox/shadowbox.css');
wp_enqueue_style( 'shadow-style' );
}
3. add a tiny line of code to your theme directory javascript file. Create a file with extension of "js". add the following code into it.
<script type="text/javascript">
Shadowbox.init();
</script>
4. Here is a function and sample code to direct you to add a post images to show it on shadowbox window.
<?php $args = array(
'post_type' => 'attachment',
'numberposts' => -1,
'post_parent' => $post->ID,
'post_mime_type' => 'image'
);
$attachments = get_posts( $args );
if ( $attachments )
{
foreach ( $attachments as $attachment )
{
$image_attributes = wp_get_attachment_image_src( $attachment->ID, full, false );
$small_img = wp_get_attachment_image_src( $attachment->ID, array(120,120)); ?>
<?php //add_thickbox(); ?>
<a href="<?php echo $image_attributes[0] ; ?>" rel="shadowbox[Mixed];" > <img src="<?php echo $small_img[0] ; ?>" alt="Plant 1"/> </a>
<?php }
}
?>
try this to add your post files on front end of your WordPress site or blog. I am not familiar with english. So use it and comment below.
and my next post i will guide you to use shadowbox to show div alert window on front end.
20:03 15
Subscribe to:
Posts (Atom)
Blogs
