How To Create ShortCode WordPress Plugin

Shortcode are special code in wordpress to show specific function with easy efforts. Shortcode is begin with [ and end with ]. For example function which we will display amazon product with shortcode [azproduct]. With shortcode you can use function coloring easily, or if you need only specific parameter change, shortcode is perfect for your needs.

To enable shortcode you must register it with function :

add_shortcode( 'your_shortcode_name', 'your_shortcode_function' );
function your_shortcode_function($attr,$content) {
}

Here is sample amazon link shortcode code :

<?php
/*
Plugin Name: ZZ Amazon Product ShortCode
Plugin URI: http://www.wpamanuke.com
Description: Sample ShortCode Code
Version: 1.0.1
Author: WPAmaNuke
Author URI: https://wpamanuke.com
*/

add_shortcode( 'azproduct', 'azproduct_link' );

// The callback function that will replace [azproduct]
function azproduct_link( $attr ) {
	
	$asin = '0385495323';
	if ( isset( $attr['asin'] ) ) {
		$asin = $attr['asin'];
	}
	
	$title= 'Buy Now';
	if ( isset( $attr['title'] ) ) {
		$title = $attr['title'];
	}
	
	return '<a href="http://www.amazon.com/dp/'. $asin .'" > '. $title .' </a > ';
}

add_shortcode( 'azproduct_content', 'azproduct_content' );
function azproduct_content( $attr , $content) {
	$a = shortcode_atts( array(
	  'color' => '',
	  'bgcolor' => ''
	), $attr );
	
	return '<div style="color:'. $a['color'] .';background-color:' . $a['bgcolor'] .';">'. $content . '</div>';
}
You can use shortcode in your editor with code like this : 
[azproduct asin="1476755744" title="Red Notice"]
[azproduct_content color="#ff0000" bgcolor="#cc0cc0"]This is contents[/azproduct_content]

How To Use Escape and require / include in WordPress Theme

After get experiment to upload free theme in wordpress.org here some notes which i think need attention in wordpress theme code. You need to know escape and requre_once replacement. Here is the notes :

ESCAPE

Any numeric variable used anywhere

echo int( $int );

Depending on whether it is an integer or a float, (int), absint(), (float) are all correct and acceptable. At times, number_format() or number_format_i18n() might be more appropriate.

Variable within HTML attribute ( esc_attr )

echo '<div id="', esc_attr( $prefix . '-box' . $id ), '">';

Variable URL within HTML attribute

echo '<a href="', esc_url( $url ), '">';

Passing variable to javascript via wp_localize_script()

// No escaping needed in wp_localize_script, WP will escape this.
wp_localize_script( 'your-js-handle', 'variable_name',
	array(
		'prefix_nonce' => wp_create_nonce( 'plugin-name' ),
		'ajaxurl'      => admin_url( 'admin-ajax.php' ),
		'errorMsg'     => __( 'An error occurred', 'plugin-name' ),
	)
);

Variable within javascript block

<script type="text/javascript">
    var myVar = <?php echo esc_js( $my_var ); ?>
</script>

Variable within inline javascript

<a href="#" onclick="do_something(<?php echo esc_js( $var ); ?>); return false;">
<a href="#" data-json="<?php echo esc_js ( $var ); ?>">

$var should be escaped with esc_js(), json_encode() or wp_json_encode().

Variable within HTML textarea

echo '<textarea>', esc_textarea( $data ), '</textarea>';

Variable within HTML tags

echo '<div>', wp_kses_post( $phrase ) , '</div>';

This depends on whether $phrase is expected to contain HTML or not.

  • If not, use esc_html() or any of its variants.
  • If HTML is expected, use wp_kses_post(), wp_kses_allowed_html() or wp_kses() with a set of HTML tags you want to allow.

Variable string within XML or XSL context

echo '<loc>', ent2ncr( $var ), '</loc>';

REQUIRE_ONCE / INCLUDE

require in theme folder
for example you have something like this :

require get_template_directory() . '/inc/my-functions.php';

you can change it to :

get_template_part(inc/my-functions);

require outsite theme folder

for example you have something like this :

require ABSPATH . WPINC . '/class-wp-editor.php';

you can change it to :

load_template( ABSPATH . WPINC . '/class-wp-editor.php' );

How To Create Twenty Nineteen Child Theme

Sometimes we need to create wordpress theme child for modification css only. We need to create child theme because regular update on parent theme so we don’t need to change code if there is new update. Here is the way to create child theme for Nineteen Child Theme :

  • Create folder nineteen-child
  • Create file style.css
  • Create file functions.php

That’s very simple. For the structure of sytle.css is like this :

/*
Theme Name: Twenty Nineteen Child
Theme URL: http://wpamanuke.com/
Description: Twenty Seventeen Child Theme
Author: WPAmaNuke
Author URL: http://wpamanuke.com/
Template: twentynineteen
Version: 1.0.0
Text Domain: twentynineteen-child
*/ 
/* Custom CSS goes after this line */

.entry .entry-title a {
	color:#ff0000;
}

For modifying css , you need to use firefox web developer inspector or chrome devtools and do some experiment

To include parent style.css you need to create file functions.php and add code like this :

<?php

	add_action( 'wp_enqueue_scripts', 'tnt_enqueue_parent_styles' );

	function tnt_enqueue_parent_styles() {
	   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
	}

?>

How To Create WordPress Plugin

To Create WordPress Plugin you need to know how basic php , css and html works.
Here is some function which ussually i used for wordpress plugin.

PREFIX

It’s suggested to prefix your function and variable. For example using mfp (My First Plugin). Here is the example $mfp_string , mfp_function.

DIR and URL

You can detect directory and url WordPress Plugin using function plugin_dir_path( FILE ) and plugin_dir_url( FILE ).
I ussually use constant some constanta like this :

define( MFP_DIR , plugin_dir_path( __FILE__ ) );
define( MFP_URL , plugin_dir_url( __FILE__ ) );

HOOK

Hook is function so you don’t need to change the core code. There are 2 hooks : action and filter.

ACTION

Here are some function which you need to know : do_action , add_action and remove_action

DO_ACTION

For example your index.php in theme like this

<?php
	do_action( 'mfp_header_before' );
	echo '<div>HEADER</div>';
	do_action( 'mfp_header_after' );
	
	do_action( 'mfp_content_before' );
	echo '<div>CONTENT</div>';
	do_action( 'mfp_content_after' );
	
	do_action( 'mfp_footer_before' );
	echo '<div>FOOTER</div>';
	do_action( 'mfp_footer_after' );

?>

ADD_ACTION

You can add action in the plugin without change index.php in the theme. For example :

<?php
	function mfp_example_header_before1() {
		echo '<div>HEADER BEFORE 1</div>';
	}
	add_action( 'mfp_header_before','mfp_example_header_before1' );
	
	function mfp_example_header_before2() {
		echo '<div>HEADER BEFORE 2</div>';
	}
	add_action( 'mfp_header_before','mfp_example_header_before2' );
	
	function mfp_example_footer_before1() {
		echo '<div>FOOTER BEFORE 1</div>';
	}
	add_action( 'mfp_footer_before','mfp_example_footer_before1' );
?>

REMOVE_ACTION

If you want to remove just use for example remove_action( ‘mfp_header_before’,’mfp_example_header_before2′ ); or if you want to remove all action remove_all_actions( ‘mfp_header_before’ );

WORDPRESS ACTION STANDAR WHICH YOU NEED TO KNOW : wp_head , wp_footer

FILTER

Filter is hook for variable. Function which you need to know apply_filters and add_filter.
Example :

<?php
	function mfp_do_filter( $mfp_text ) {
		$mfp_text = "VAR DO FILTER";
		return $mfp_text;
	}
	add_filter( 'mfp_var_filter', 'mfp_do_filter' );
	
	function mfp_apply_filter() {
		$mfp_var = "VAR APPLY FILTER";
		$mfp_var = apply_filters( 'mfp_var_filter' , $mfp_var );
		echo $mfp_var;
	}
	
	mfp_apply_filter();
?>

REMOVE_FILTER

If you want to remove filter. Just use for example remove_filter( ‘mfp_var_filter’ , ‘mfp_do_filter’ ); or if you want ro remove all just use function remove_all_filter( ‘mfp_var_filter’ );

WORDPRESS FILTER WHICH YOU NEED TO KNOW : the_content

After you know some basic functions now it’s time to create your first plugin.
HERE IS SAMPLE FIRST PLUGIN TO INSERT BEFORE AND AFTER CONTENT IN THE POST / PAGE

<?php
/*
Plugin Name: My First Plugin
Plugin URI: http://wpamanuke.com/how-to-create-wordpress-plugin/
Description: First plugin which i made
Version: 1.0
Author: WPAmanuke
Author URI: http://wpamanuke.com
License: GPLv2
*/

function mfp_filter_the_content_before( $content ) {
    $custom_content = '<div>Before Content Filter</div>';
    $custom_content .= $content;
    return $custom_content;
}
add_filter( 'the_content', 'mfp_filter_the_content_before' );

function mfp_filter_the_content_after( $content ) {
    $custom_content = '<div>After Content Filter</div>';
    $custom_content = $content . $custom_content;
    return $custom_content;
}
add_filter( 'the_content', 'mfp_filter_the_content_after' );

?>

Best Review Themes For Sale

Ponzi is newspaper wordpress theme  is very suitable for blog and review. the theme is a responsive website design theme. Ponzi newspaper wordpress theme was built using Twitter Bootstrap, a popular front-end framework. It has a fully responsive design and is cross-browser compatible. There is also localization support enabling you to reach a multilingual audience. Google fonts which are used Oswald and Open Sans. It’s based on bootstrap 3 Ponzi  Theme is made for clean , minimalist magazine and modern design. This newspaper template support Boxed and full layout. This theme makes it easy for you to set up and customize your site to match the look and functionality you want, without the need for a lot of technical knowledge. The theme’s demo showcases a “hot news” scrolling ticker on the homepage, which adds a breaking news feel to the site.
This theme gives you a variety of customization options, with page layouts that can be set up with wide or narrow sidebars in and different combinations. It also includes a number of page templates, such as an alternate homepage layout, four different blog layout styles, portfolio page

10 Plugins WordPress You must know as WP Theme Developer

As WP Theme developer , here is some plugins which you must know for develop your creativity on theme

  • Simple Page Sidebar : This plugin is to show multiple sidebar on your page or post. It’s easy to add or delete custom page sidebar.
  • Custom Category Templates : Use this to choose Category Template (just like Page Template). If you want to make the category is different layout, just use this template
  • WP Custom Post Template : You can use Post template on your post (just like Page Template)
  • Event Manager : just make sure your theme support event manager , because based on my experience many user who use this plugin.
  • WPML : WordPress multilingual Plugin. You can translate any page/post on your blog
  • RTL Tester : just use RTL Tester to make sure your theme support RTL. Don’t forget theme to support RTL , you can use is_rtl() to use different css and javascript for RTL theme. A usefull for converting LTR to RTL is http://cssjanus.commoner.com/
  • Codestyling Localization : This plugin to generate mo/po for your theme for easy localization from wordpress admin area. You can translate directly from your wordpress admin area
  • Titan Framework : if you want to make admin area for plugins or theme. Just use this framework, It’s easy to use. The lack only it doesn’t support repeater group. But i think it’s powerful enough if you want to make plugin/theme without repeater support
  • Redux Framework : This is powerfull wordpress admin framework  for theme. For metabox support you can use addons
  • Vafpress Framework : This is powerfull for wordpress admin framework for theme admin and metabox and support repeater group. The lack only it’s not support include the javascript the right way on admin area as wordpress standard. So if you submit your theme which use Vafpress Framework in the wordpress.org , it will be probably rejected. But i think it’s the most powerfull framework.
  • Theme Check : You can use this plugin to check you theme has passed the test wordpress standard theme or not.
  • Update Notifier : If you program premium wptheme which is not hosted in wordpress.org just give notifier with this code  http://wplift.com/notify-your-theme-users-about-updates-in-their-dashboard