wordpress widget and sidebar is different things. Here in this article we will show you how to add custom widget in wordpress theme using your theme code.
Some years ago I searched for creating the widget in wordpress theme But I did not get the perfect answer. Every time I got code snippet of sidebar. Many WP developers are assuming widget means sidebar. wordpress widget and sidebar is totally different things. Here in this article I will show you how to create the wordpress widget using your theme code.
how to add custom widget in wordpress theme
You can put following code into functions.php file or you can create sperate file and just include that into functions.php file.
class RecentPostWidget extends WP_Widget
{
function RecentPostWidget()
{
$widget_ops = array('classname' => 'RecentPostWidget', 'description' => 'Displays a Recent post with thumbnail' );
$this->WP_Widget('RecentPostWidget', 'Recent Post and Thumbnail', $widget_ops);
}
function form($instance)
{
$instance = wp_parse_args( (array) $instance, array( 'title' => '' ) );
$title = $instance['title'];
?>
<?php echo $this->get_field_id('title'); ?>">Title: <input id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo attribute_escape($title); ?>" />
<?php
}
function update($new_instance, $old_instance)
{
$instance = $old_instance;
$instance['title'] = $new_instance['title'];
return $instance;
}
function widget($args, $instance)
{
extract($args, EXTR_SKIP);
echo $before_widget;
$title = empty($instance['title']) ? ' ' : apply_filters('widget_title', $instance['title']);
if (!empty($title))
echo $before_title . $title . $after_title;;
// WIDGET CODE GOES HERE
echo "<h1>This is my new widget!</h1>";
echo $after_widget;
}
}
add_action( 'widgets_init', create_function('', 'return register_widget("RecentPostWidget");') ); ?>
Following is screen-shot of sample widget code which I used in functions.php file.
wordpress has inbuilt search, still people want to add the advanced search in their site. we will show, how to add google search to wordpress manually.
how to add google search to wordpress manually
There are too many sites build on wordpress. wordpress gives inbuild search option in cms. But still people want to add the advanced search in there site. I suggest you can add the google search in wordpress site. Adding google search in wordpress site is really SEO friendly also. It is very easy to add the google search system in wordpress sites.
In some very simple steps you can add the google search in wordpress sites.
First login to google and go to following URL:
https://www.google.com/cse/
how to add google search to wordpress manually
Just add the your site and and get your site custom google search for your site.
Before this you need to create the wordpress page for showing the search result page.
I created page called “search result”. For getting JS code you need give search result page path in google settings.
You will get options for selecting search result layout. Here you will get two javascripts code for google search form and search result.
After getting the two javscript code. You need to add the form code into wordpress widget.
On search result page just add the second code and save it. That sit. Your custom site google search is ready.
You can Customize Google Custom Search Engine Colors and Looks as your site color and theme.
wordpress gogogle search -CSE – Look and Feel
Sample Form Code: (you can use following code in wordpress widget)
cse-search-results">
var googleSearchIframeName = "cse-search-results";
var googleSearchFormName = "cse-search-box";
var googleSearchFrameWidth = 550;
var googleSearchDomain = "www.google.com";
var googleSearchPath = "/cse";
// ]]></script>
Google Search Trick in wordpress. There is width issue in search result page. Google search result render with 768px width.
You need to just add following CSS code in your wordpress theme style.css file.
#cse-search-results iframe {width: 200px; }
custom google site search you can add in any wordpress site without any wordpress plugin.
PHP has the plethora of frameworks which are painless to use by a developer. A developer can also freak out on while developing a website with various attractive features. Betwixt all the frameworks, WordPress is the most prominent one because of its outstanding features.
Migration of Themes and Plugins
When a new major version of WordPress released, namely, WordPress 2.1 or 2.2, you might have discovered that Themes or Plugins are no longer working in a way they used to do it earlier. The primary reason could be that they are entirely broken because there was something in WordPress that was subjected to get changed. At the same time, another possible reason might be that was very fundamental and got changed, although you can feel relished working with WordPress Development just by updati An outline of WordPress 2.7:ng a few settings.
An outline of WordPress 2.7:
Migration of Themes and Plugins
WordPress 2.7 evolved with many revolutionary visages for getting an amazing website especially for bloggers. There are a few key features that are included in WordPress 2.7 such as Pages, plugins, Images and there are a few more. You can enjoy working on this by restraining blog part of the website with this version. You can flawlessly create static pages which are not the part of bookmark links, ongoing blog and others.
What is state-of-the-art about “Pages”?
Pages may look quite similar to the posts at first glance. However, they are actually not akin. Pages do not have timestamp, tags or categories. On the other hand, posts belong to the blogs that are meant to be the segment of enduring section of the website.
Adding a page
Add New Page
Just visit WP admin and navigate to different pages in order to add a new page. You will find drop-down menu in the grey menu fixed at the top and by clicking on the arrow; you can easily add a new page. Adding page can appear quite similar to the earlier process. But, there will be a new section that you will find, that is, Attributes.
Something about “Themes”:
Improved Comment Display – Threading, Paging and much more:
Pagination
Comments emerged in WordPress 2.7 with various new features, including nesting, threading, paging and many more. They are built-in because of the fact that you theme will support it. Thus, you can enjoy various advantages of these new features to get the amazing websites.
Logout option:
In the version, WordPress 2.7, Template Tag wp_log_out_url was added. This was providing a nonce URL for logout process. If a theme is using a construct such as /wp-login.php?action=logout to provide a logout link to the user. Consequently, that code has to be updated with the use of wp_logout_url.
You may also experience a message – You are attempting to log out of example.com. Please try again, if the theme is not using wp_logout_url for the URL of logout.
Sticky posts excluded from custom queries:
You can easily designate a post as sticky under the WordPress 2.7 version. If you will follow to use a query posts loop, then those sticky posts will get back directly to the custom queries. In order to avoid the sticky notes from getting involved, you can simply add caller_get_posts=1 to the complete query string.
Post Classes:
WordPress 2.7 introduced a new function for post classes, which will allow the user to do the styling in a simple style. The function can be written as post_class( ).If you are willing to use the function, then simply add it to Loop in such a way that it can make complete sense. Most themes usually encapsulate each post within a DIV section.
For a few special cases, if you want to add you own classes, post_class will support it too. This can be done as shown below:
<?php post_class(‘special’); ?>
If you have to display the post outside the Loop or in any alternative Loop, the second parameter to this function can be the post Id. You can use the following format:
<?php post_class(‘ ’, $post_id); ?>
Flexibility to display the sticky post class:
The very basic thing that you have to do is to find:
Always tie a knot of the point that it is not mandatory if you make use of the post_class( ) function, as discussed above. However, use of post_class( ) is preferred, but if you are doing it manually, then it will allow you to get the sticky status of the complete post.
A trivial change in Plugins:
You can also find some changes in Plugins too and some of the updated features are listed as follows:
Uninstall feature in Plugin API
Administrative Hooks introduced and removed
Admin Header
Settings API include
Admin header
Plugins list page
Plugins have to be registered
Thus, all these advanced features within the WordPress 2.7 have allowed the developers to work on web development and web customization with an ease. These advanced features will also help the website to inherit many innovative and creative features which can be user-friendly.
All wp developers and wordpress theme developers know about twenty thirteen wordpress theme. I do not need to talk about this more. Many people discussed about it issues and features. Many people are developed child themes based on twenty thirteen wp theme.
Some people asked me, how to add second sidebar in twenty thirteen wordpress theme. We can very easily add the second sidebar to it’s child theme.
add second sidebar in twenty thirteen wordpress theme
Using following simple code you can add the second sidebar to twenty thirteen wordpress child theme. If you are creating the child theme of twenty thirteen then you just need to add the following code into your functions.php file and that sit.
[viral-lock message=”Solution code is Hidden! It’s Visible for Users who Liked/Shared This article on Facebook or Twitter or Google+. Like or Tweet this article to reveal the content.”]
Above code will add the second sidebar to your child theme. using following code you can add the second sidebar to your child theme.
<?php dynamic_sidebar( 'sidebar-3' ); ?>
you just need to place above code into your single.php and index.php file or you can add above code where you need to show the second sidebar in your child theme.
Based on child theme code you need to do some CSS changes so your second sidebar will look perfect. I suggest to use the any grid system wordpress framework or you can use bootstrap CSS grid system for fuild HTML framework.
How to add second sidebar in twenty thirteen wordpress theme
maintenance page is required in website. There are many wordpress plugins which are good to create maintenance page wordpress. need custom maintenance page. In wordpress sites also you need the provision for maintenance page while doing backup, code updation etc operation.
create maintenance page wordpress with your content
There are many wordpress plugins which are helpful to create the maintenance page. Many people need the custom content on maintenance page. Some people need to content and images on maintenance page.
create maintenance page wordpress
You can create the maintenance page using simple apache code which you can insert in .htaccess file. You just need to create the maintenance.html page in your root wordpress installation directory.
There are some free wordpress plugins also which are helpful to create the maintenance page with custom content. But I like following wp plugin which really simple to use and nice features.
Ultimate Maintenance Mode create maintenance page wordpress with your content
The Ultimate Maintenance Mode plugin displays a screen-shot of your website with an overlay window and the reason your site is down.
Features:
Works with any WordPress theme
Allows you to work on your site while non logged in visitors see the Maintenance Mode page
Automatically Creates a Screen-shot of your Website and uses it as the background for your maintenance mode page.
Ability to add a Custom Headline, Message & Background Image
Returns a 503 http status and retry header so search engines know your site is down.
Simple and Easy to Use
Multi-site Support
Translation Ready – i18n Support
As per my conclusion above plugin is really good for new wordpress developers and designers to save there time and efforts for creating the maintenance page.
wordpress tutorial, how to check custom post type in wordpress. Many we want to execute some code on custom post type or want to execute code on post. Many we want to execute some code on custom post type or some times we want to execute code on normal pages or post.
how to check custom post type in wordpress
So here is solution. You just need to just add following code into your functions.php file which you can find in your wordpress theme folder.
function check_custom_post_type() {
global $wp_query;
$post_types = get_post_types(array('public' => true,'_builtin' => false),'names','and');
foreach ($post_types as $post_type ) {
if (get_post_type($post_type->ID) == get_post_type($wp_query->post->ID)) {
return true;
} else {
return false;
}
}
}
After this you can use following function in any wordpress file. For example you can use this method in single.php file.
if (check_custom_post_type()) {
//Current post is a custom post type
}
wordpress tutorial, how to check custom post type in wordpress. Many we want to execute some code on custom post type or want to execute code on post.
Spam comments are most irritating for bloggers. Reading the all comments and their content and desire. If Comment author URL is bigger then you should consider that comment as Spam comment for sure. Many times I observed, spammer always try to add their site URL in Author URL.
comment Author URL is bigger in WordPress
Using following code you can protect your site from spam commenters. Open your functions.php file from your theme folder and just copy/paste the following code into that.
Following code will automatically mark the comments as spam where author URL is longer than 60 chars.
SVG format is very important for chants and graphs. For admin orientated sites. There are many HTML admin templates which purely based on svg format. In HTML5 format SVG based graphs are too important. SVG is a language for describing two-dimensional vector graphics in XML. SVG stands for Scalable Vector Graphics.SVG defines graphics in XML format.
What is SVG?
SVG stands for Scalable Vector Graphics
SVG is used to define vector-based graphics for the Web
SVG defines the graphics in XML format
SVG graphics do NOT lose any quality if they are zoomed or resized
Every element and every attribute in SVG files can be animated
SVG is a W3C recommendation
SVG integrates with other W3C standards such as the DOM and XSL
SVG Advantages
Advantages of using SVG over other image formats (like JPEG and GIF) are:
SVG images can be created and edited with any text editor
SVG images can be searched, indexed, scripted, and compressed
SVG images are scalable
SVG images can be printed with high quality at any resolution
SVG images are zoomable (and the image can be zoomed without degradation)
SVG is an open standard
SVG files are pure XML
svg format is You can add this support by adding following in your functions.php file which you find in your wordpress theme folder.WordPress uploader does not support of SVG format files. Adding SVG upload functionality to WordPress. using our code your can use svg functionality in wordpress.
Adding SVG upload functionality to WordPress site
After adding following code you will be able to upload the svg file into your wordpress site or blog.
Every custom them has option, Managing or change wordpress author slug is common in wordpress sites. you can use our come snippet for this for change author URL base. Some times you want to change the worpdress author URL slug then you can use the following code:
You need to add code into functions.php of your wordpress theme.
how to change wordpress author slug or URL base
That will change the default yoursite.com/author/authorname to yoursite.com/author-profile/authorname.
So you can change this to user or anything that you would like.
add_action('init', 'change_wp_author_base');
function change_wp_author_base() {
global $wp_rewrite;
$author_slug = 'author-profile'; // change author slug name
$wp_rewrite->author_base = $author_slug;
}
Some times you need people want to add guest author’s articles in your site. So add guest author custom field in wordpress using code so that meta field will be useful to you in future.
how to add guest author custom field in wordpress admin
If you want to add the guest author custom field in wordpress admin. you can use the following code.
You need to open your functions.php file put following code in that.
