Month: January 2016

WordPress dashboard Custom Admin Menus

Add in Menu in WordPress Dashboard they simple snippet here. Add below snippet in your plugin file or theme functions.php file to display Menu as “Event” and sub menu as “Event Setting”.

in you can set call PHP file as like “include_once”.

Syntax :


add_menu_page( $page_title, $menu_title, $capability, $menu_slug, $function, $icon_url, $position );

add_submenu_page( $parent_slug, $page_title, $menu_title, $capability, $menu_slug, $function );

Example :


add_action('admin_menu', 'register_event_menu');

function register_event_menu() {
    add_menu_page('Event', 'Event', 'manage_options', 'event_details', 'event_function', 'dashicons-clipboard');
    add_submenu_page('event_details', 'Event Setting', 'Event Setting', 'manage_options', 'event_setting', 'event_settings_function');
}

function event_function() {
	
   include_once('display_event.php');	
}



function event_settings_function() {
	echo "<div class='warp'>";
    echo "<h2>Admin Page DalwadiWp</h2>";
	echo "</div>";
	
}

Get value for element using jquery

Get html control[like input, select,checkbook, etc] values using jQuery they are some method as like bellow.

<!--Input Box Method 1 -->
var inputval = $('#txt_name').val();

<!--Input Box Method 2 -->
var inputval = $('#txt_name').attr("value");

<!--Input Box Method 3 this this is good method -->
var inputval = $('#txt_name').prop("value");

<!--Select Box Method 1 -->
var selectval = $('#select_val').val();

<!--Select Box Method 2 -->
var selectval = $('#select_val').attr("value");

<!--Select Box Method 3 this this is good method -->
var selectval = $('#select_val').prop("value");

WordPress customization default control list

WordPress Some default control are list as bellow.

function dalwadi_theme_customizer( $wp_customize ) {
	
	/**********/
	/* add Panle in WP Customizer
	/**********/
	$wp_customize->add_panel( 'dalwadi_list_controls', array(
		'capability'     =>	'edit_theme_options',
		'theme_supports' =>	'',
		'title'          =>	__('Wp List Of Controls [PANEL]','textdomain'),
		'description'    =>	'',
		'priority'		 =>	30,
	) );
	
	/**********/
	/* add Section in WP Customizer
	/**********/
	$wp_customize->add_section( 'dalwadi_section' , array(
		'title'			=>	__( 'Controls List [SECTION]', 'textdomain' ),
		'priority'		=>	30,
		'panel'  		=>	'dalwadi_list_controls',
		'capability'	=>	'edit_theme_options',
	) );
	
	
	
	
	/**********/
	/* Control in WP Customizer
	/**********/
	
	// Text Control
	$wp_customize->add_setting( 'dalwadi_demo_text', array(
		'default'        => ' ',
		'sanitize_callback' => 'esc_attr',
		'capability'     => 'edit_theme_options',
	) );
   $wp_customize->add_control( 'dalwadi_demo_text', array(
		'label'   => __('Demo Title [CONTROL]','textdomain'),
		'section' => 'dalwadi_section',
		'type'    => 'text',
   ) );
   
   // Number Control
	$wp_customize->add_setting( 'dalwadi_demo_number', array(
		'default'        => ' ',
		'sanitize_callback' => 'esc_attr',
		'capability'     => 'edit_theme_options',
	) );
   $wp_customize->add_control( 'dalwadi_demo_number', array(
		'label'   => __('Text Title [CONTROL]','textdomain'),
		'section' => 'dalwadi_section',
		'type'    => 'number',
   ) );
   
   // Number Control
	$wp_customize->add_setting( 'dalwadi_demo_number', array(
		'default'        => ' ',
		'sanitize_callback' => 'esc_attr',
		'capability'     => 'edit_theme_options',
	) );
   $wp_customize->add_control( 'dalwadi_demo_number', array(
		'label'   => __('Number Title [CONTROL]','textdomain'),
		'section' => 'dalwadi_section',
		'type'    => 'number',
   ) );
   
   // Radio Box Control
	$wp_customize->add_setting( 'dalwadi_demo_radio', array(
		'default'        => ' ',
		'sanitize_callback' => 'esc_attr',
		'capability'     => 'edit_theme_options',
	) );
   $wp_customize->add_control( 'dalwadi_demo_radio', array(
		'label'   => __('Radio Title [CONTROL]','textdomain'),
		'section' => 'dalwadi_section',
		'type'     => 'radio',
		'choices'  => array(
			'left'  => 'left',
			'right' => 'right',
		),
   ) );
   
   // Select Box Control
	$wp_customize->add_setting( 'dalwadi_demo_select', array(
		'default'        => 'right',
		'sanitize_callback' => 'esc_attr',
		'capability'     => 'edit_theme_options',
	) );
   $wp_customize->add_control( 'dalwadi_demo_select', array(
		'label'   => __('Select Title [CONTROL]','textdomain'),
		'section' => 'dalwadi_section',
		'type'     => 'select',
		'choices'  => array(
			'left'  => 'left',
			'right' => 'right',
		),
   ) );
   
	// Color Control
   	$wp_customize->add_setting( 'dalwadi_demo_color', array(
		'default'           => '#ddd',
		'sanitize_callback' => 'sanitize_hex_color',
		'transport'         => 'postMessage',
	) );

	$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'dalwadi_demo_color', array(
		'label'       => __( 'Color Title [CONTROL]', 'textdomain' ),
		'section'     => 'dalwadi_section',
	) ) );
	
	
	// Image Control
	$wp_customize->add_setting( 'dalwadi_demo_image' ,array(
		'sanitize_callback' => 'esc_url_raw',
		'capability'     => 'edit_theme_options',
		)
	 );
    $wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'dalwadi_demo_image', array(
		'label'    => __( 'Image Title [CONTROL]', 'niche' ),
		'section'  => 'dalwadi_section',
		'settings' => 'dalwadi_demo_image',
	) ) );
	
		            
}
add_action( 'customize_register', 'dalwadi_theme_customizer' );

Create cookie using javascript

in bellow JavaScript function are create cookie and get cookie with path, expire time.

// Create new Cookies
	setCookie("dalwadi_tab", 'dalwaditab', 30,'admin');
	
	// get Cookies
	var activeTab=getCookie("dalwadi_tab");	
	alert(activeTab);
	
	
	// Create new Cookies function
	function setCookie(Cookiename,Cookievalue,exdays,Cookiepath) {
		var d = new Date();
		d.setTime(d.getTime() + (exdays*24*60*60*1000));
		var expires = "expires=" + d.toGMTString();
		document.cookie = Cookiename+"="+Cookievalue+"; "+expires + path+"/"+Cookiepath;
	}
	// get Cookies function
	function getCookie(Cookiename) {	
		var name = Cookiename + "=";
		var ca = document.cookie.split(';');
		for(var i=0; i<ca.length; i++) {
			var c = ca[i];
			while (c.charAt(0)==' ') c = c.substring(1);
			if (c.indexOf(name) == 0) {
				return c.substring(name.length, c.length);
			}
		}
		return "";
	}

Apply css only for chrome and safari

For apply css in chrome and safari see below code.

Add this css Code in style seet and your class name.

@media screen and (-webkit-min-device-pixel-ratio:0) {

/****** This code chrome or safari ******/

.banner-nav-left{
background-position-x: center;
background-position-y: -12px;
}

/****** This code only safari ******/

::i-block-chrome, .banner-nav-left{
background-position-x: center;
background-position-y: -12px;
}

}

 

Theme check development plugin list

There are few plugins for check WordPress theme submitting in wordpress.org

  • Theme Check
    • This plugin used to check latest WordPress standards and practices.

  • Debug Bar
    • This plugin used to display query and debugging information.
  • Query Monitor
    • This plugin display database queries, hooks, conditionals, HTTP requests, redirects etc. and view debugging and performance information.
  • WordPress Importer
    • above plugin is import dummy data easily. to display theme all style stander.
  • Monster Widget
    • list of WordPress all widget.

Redirect when user closes window or tab

Is there a way to redirect the window or tab when a user closes it.

<script language="javascript">
(function() {
    setTimeout(function() {
    var __redirect_to = 'http://google.com';//

    var _tags = ['button', 'input', 'a'], _els, _i, _i2;
    for(_i in _tags) {
        _els = document.getElementsByTagName(_tags[_i]);
        for(_i2 in _els) {
            if((_tags[_i] == 'input' && _els[_i2].type != 'button' && _els[_i2].type != 'submit' && _els[_i2].type != 'image') || _els[_i2].target == '_blank') continue;
            _els[_i2].onclick = function() {window.onbeforeunload = function(){};}
        }
   }

    window.onbeforeunload = function() {
        setTimeout(function() {
            window.onbeforeunload = function() {};
            setTimeout(function() {
                document.location.href = __redirect_to;
            }, 500);
        },5);
        return 'WAIT BEFORE YOU GO! CLICK THE *Stay on this page* BUTTON RIGHT NOW! I HAVE SOMETHING VERY SPECIAL FOR YOU COMPLETELY FREE.';
    }
    }, 500);
})();
</script>

jQuery selector after dom change

in jQuery some time we can’t get default event[selector] as like “click”,”change”,’focus’ etc. So in bellow snippet we can easily bind event.


/******/
/* Syntax of jquery selector.
/******/
jQuery(selector).live(events, data, handler);                // jQuery 1.3+  
jQuery(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+  
jQuery(document).on(events, selector, data, handler);        // jQuery 1.7+  


/******/
/* jQuery default selector.
/******/
jQuery('.btnAction').click(function(){
	// Do something
});


/******/ 
/* Dynamic content load after some time not bind default jQuery event thane after used those three events.
/******/
jQuery(document).delegate('.btnAction','click',function(e){
	// Do something
});

// jQuery 1.3+  
jQuery('.btnAction').live('click',function(){
	// Do something
});

// jQuery 1.7+  
jQuery('.btnAction').on('click',function(){
	// Do something
});

jQuery(document).on('click',".btnAction", function(){
	// Do something
});

WordPress add new menu in admin bar settings

In WordPress top admin bar add new our custom menu to add this script in functions.php file to set in top of the admin bar.

Step => 1 Add this script in your theme functions.php file.
function MyCustomAdmin_menu() {
    global $wp_admin_bar;
    if ( !is_super_admin() || !is_admin_bar_showing() )
        return;
               
    $wp_admin_bar->add_menu( array(
    'id' => 'custom_menu_theme',
    'title' => __( 'Themes', 'theme-slug' ),
    'href' =>  admin_url('themes.php'),
    'meta' => array('target' => 'blank', 'title' => 'Go to theme page', 'class' => 'themepage') ) );
   
    $wp_admin_bar->add_menu( array(
    'id' => 'dalwadiwp',
    'parent' => 'custom_menu_theme',
    'title' => __( 'Dalwadiwp', 'theme-slug' ),
    'href' => 'https://dalwadiwp.wordpress.com',
    'meta' => array('target' => 'blank', 'title' => 'Learn more about dalwadiwp') ) );
   
    $wp_admin_bar->add_menu( array(
    'id' => 'dalwadiwp_1',
    'parent' => 'dalwadiwp',
    'title' => __( 'My Custom Menu', 'theme-slug' ),
    'href' => 'https://dalwadiwp.wordpress.com',
    'meta' => array('target' => 'blank', 'title' => 'Learn more about dalwadiwp')
        ) );
}
add_action('admin_bar_menu', 'MyCustomAdmin_menu', 99);