How to add Date block left side of Post Title in WP Genesis Theme

How to Add date block before post title in WordPress

Now a days I have seen many blog shows date in left side of post title, So i have tried to add same style with Genesis child theme. So here is the solution now you also can do it.. Just need to do these 2 changes.

# 1 change on function.php file.


/** Add date block before post title */
add_action( 'genesis_before_post_title', 'custom_post_date' );
function custom_post_date() {

	if ( ! is_page() ) {
		echo '';


# 2 change on css file.

.post-date {

background-color: #333335;
color: #fff;
float: left;
font-family: “Century Gothic”, AppleGothic, Arial, sans-serif;
font-size: 12px;
line-height: 20px;
margin: 0 10px 5px 0;
text-align: center;
width: 50px;
.post-date p{ font-size: 20px; color: #fff; font-weight:bold;}


How to Parse xml with ul li Value by CDATA in simplexml_load

 Parsing XML CDATA With SimpleXML

Simplexml_load function is really great to parse xml files,but I have notice its bring some empty fields today. I have checked deeply and found that filed has <ul><li> and Simplexml_load function making that field as array. seems strange and i have search out solutions… and here is the solutions to parse that perfectly.

Solution #1 – Use CDATA

CDATA  section is merely an alternative syntax for expressing character data; there is no semantic difference between character data that manifests as a CDATA section and character data that manifests as in the usual syntax in which “<” and “&” would be represented by “&lt;” and “&amp;“, respectively.

so use this way on your xml file..






now php page to parse it

   $xml = simplexml_load_file('yourxmlfile.xml','SimpleXMLElement', LIBXML_NOCDATA);
echo $xml->yourfield;

 Solution #1 – Use str_replace and replay your all ‘< >’ and  ‘&’ to  “&lt;” and “&amp;“, while creating xml file.



WP Plugin – HRM Work Tracking, How to change WPLANG

How to change language of wordpress plugin HRM Work Tracking

Yesterday I have installed plugin ‘HRM Work Tracking‘ in my English language WordPress site. But everything showing in Germany, I have checked FAQ page of this plugin but all failed, Plugin Developer said,

“Why is the plugin in German? Its original language is german so please be sure to set define(‘WPLANG’, ”); correctly or use a plugin changing backend language (like WP Native Dashboard)”.. but where add this and how.. :) for newbies no details…


We have to add this variable on wp-config.php file. define(‘WPLANG’, ”);

for English use this

define(‘WPLANG’, ‘en_EN’);

for Germany

define(‘WPLANG’, ‘de_DE’);

all hope all works fine

WordPress How to Display Featured Image in post Single.php

Wp Display Featured image on post page

Mostly theme now by default shows that, if your theme not so you can add these codes on your single.php page to display.

Thumbnail Sizes

WordPress has some pre defined sizes, those can help you out. try these if works

the_post_thumbnail();                  // without parameter -> 'post-thumbnail'

the_post_thumbnail('thumbnail');       // Thumbnail (default 150px x 150px max)
the_post_thumbnail('medium');          // Medium resolution (default 300px x 300px max)
the_post_thumbnail('large');           // Large resolution (default 640px x 640px max)
the_post_thumbnail('full');            // Full resolution (original size uploaded)

the_post_thumbnail( array(100,100) );  // Other resolutions

Define your own Thumbnail Sizes in function.php

Apart pre defined sizes you may also can define some sizes as per your requirements. just add these codes on your function.php file

if ( function_exists( 'add_image_size' ) )
	add_image_size( 'homepage-thumb', 200,400, true ); /////  200 pixel wide and 400 pixel tall, resized proportionally  
/////or by this

add_image_size( 'bigSlider', 500, 400, false ); // 500 pixel wide and 400 pixel tall, resized proportionally  

Get Thumbnail on post page

$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ),'full');
$url = $image[0];
$width = $image[1];
$height = $image[2];


Genesis – How to add Widget area before or after post loop?

Wp Genesis is really amazing, but harder for newbies. Adding any widget any where on your page you need to use some codes on function file. or direct on your child theme.

How to add a widget area before loop

For adding widget area on your home page or any page, you need to add function and add all your widget codes under that php function and add that before loop.. here see below


add_action( 'genesis_before_loop', 'child_home_top' );
function child_home_top() { ?>

How to add a widget after loop

add_action( 'genesis_after_loop', 'child_home_bottom' );
function child_home_bottom() { ?>


How to launch Fancybox Popup on page load?

How to Trigger Fancybox function on page load?

Fancybox currently does not directly support a way to automatically launch. So we have to do some javascript codes to make it Trigger on page load. here some a way you can launch popup with fancybox on page load or after some delay as per your requirements.

1# Popup on page Load


 $(document).ready(function() {
            'titlePosition'         : 'inside',
            'transitionIn'          : 'fade',
            'transitionOut'         : 'fade',
	 'href': '',
	'type'				: 'iframe',
            'overlayOpacity'        : 0.9


2# Popup on page Load with trigger


 $(document).ready(function() {
            'titlePosition'         : 'inside',
            'transitionIn'          : 'fade',
            'transitionOut'         : 'fade',
	 'href': '',
	'type'				: 'iframe',
            'overlayOpacity'        : 0.9
     }).trigger("click"); ///// call popup

3# Popup on page Load with delay

    $(document).ready(function() {
            'titlePosition'         : 'inside',
            'transitionIn'          : 'fade',
            'transitionOut'         : 'fade',
	 'href': '',
	'type'				: 'iframe',
            'overlayOpacity'        : 0.9

        //launch on load after 5 second delay
 window.setTimeout('$(".lightboxLog").trigger("click")', 5000);///// call popup with delay 


How to use Custom Fonts with CSS @font-face

Import Custom fonts into your css

For importing custom font type is very popular these days, I still remember approx 10-12 years back we have only ‘arial’ or ‘verdana’  default fonts to use in website. so all website fonts seem same. But now by css and javascript we have option to use custom fonts, even those not so common. so here some way to use custom font type. But best way to use these font in css3 by variable to importing so browser can support those.


font-family: custom_font; //// now you can use this variable in any class
src: url('font/custom_font.ttf'); //// your font path


.myclass {
font-family: custom_font; //// variable to use custom font.

Google fonts

@import url(; //// now you can use this font any class.


#title {
font-family: ‘Oswald’, arial, serif;
font-size: 48px;
line-height: 60px;
margin: 0 0 10px;
text-transform: uppercase;

* some time IE dosen’t support .tff font you need to use

WP Widget – How to Add different Color to Widget title’s Second Words

How to Add a Class to Second words of WordPress Widget’s Title

Now a days bloggers want to show 2 different colors to widget title’s words. Its not possible to adding any class or any html tag on normal widget title, WP remove html tags from it.
if some how we can add an class or span or or tags of any word in this title.So what is solutions to do this..

here is the solution, you need to add this code into function.php file of your theme.

add_filter('widget_title', change_title);
//// and a function to edit widget title "change_title" is function name as below

function change_title($title) {
if($title!=''){ ////// if only title not empty
    $title_parts = explode(' ', $title, 2);
    // break into 2 parts
    $title = ''.$title_parts[0].'';
//add a  tag or you can add span and also give class what ever you want, so we can make a different class in stylesheet to give a style.

    // check if any remaining word, if any other words
        $title .= ' '.$title_parts[1];
///// add that too.
    return $title;


WP Genesis – How to add Menu in the Footer with Copyright Text

How to add Menu in genesis child theme footer along with copyright text. Here im show you how you can change footer copyright text and also show menu’s in the Genesis child theme footer.

remove_action( 'genesis_footer', 'genesis_do_footer' );
//////// 1st remove footer text 

add_action( 'genesis_footer', 'child_do_footer' );
///// now add new text and menu with  a function "child_do_footer" is function name.

function child_do_footer() {
    $creds = '
© All rights Reserved.
'; echo $creds; /////// now print above line. /////// now add menu, use wp nave menu function as in function file. $footernav = wp_nav_menu( array('menu' => 'primary', 'depth' => 1)); echo $footernav;///// print this now }


WP Genesis – How change footer Copyright text

How to change or remove Genesis theme footer copyright text. For removing this we have to use this codes, just copy past these code in your child theme function.php file.

remove_action( 'genesis_footer', 'genesis_do_footer' );
///////// 1st of all just remove current footer text.

add_action( 'genesis_footer', 'child_do_footer' );
/// now add new text within a function on same location in footer. "child_do_footer" is the function.

function child_do_footer() {
    $creds = '
© All rights Reserved.
'; echo $creds; /// now just print above line..what ever you want to add in footer just write in above line. }


Relocated Genesis Child theme’s Footer Widgets Area

Some time we have to relocate footer widget area, its hard if you working of child theme those not hard coded footer widget area on footer.php file.

so here is the solutions for it.

remove_action( 'genesis_before_footer', 'genesis_footer_widget_areas' );
///////////// 1st remove footer widget from current loction
add_action( 'genesis_footer', 'genesis_footer_widget_areas' );
//// now add on new loction, in the above code, "genesis_footer" is the location you can use your one.


How to add google weather forecast in php

How to use Google Weather forecast API in Php

Do you want to display your city Weather forecast by google api, Yes you can do so by php. Google provides Weather API to use on any website. Here Im showing you an example how to use that in php.

By this we can connect google api and that send us detail report about weather forecast of a city in xml format. now we need to go show on our website by the help php .

for showing images


temp_c['data'] ?>° C,

change temp_f['data']  to display in fahrenheit

            condition['data'] ?>

for forecast use these codes



day_of_week['data']; ?>

  low['data'] ?>° F - high['data'] ?>° F,
	            condition['data'] ?>

please check and update me


How to get easily facebook page id or user id

Where find fb fan page id or user id

Some time we really need FB page id or user id, to add on our website or any other places. Its became hard to find now, coz we replace that by our user name or page name. for example

before it as like this

but as we replace page id to user name or page name.

for find this many website ask you to login with facebook from their page. Some time it could be harmful as they can get your all information as you login with them. But here im showing you a really easy step.


add “graph” before your fb page or user page. example

make it

and you will see your page id same can be done by user id




WP how to get Latest posts on external pages

WP Latest Post on external PHP Page hack?

For using wordpress post on external php pages, we have to include WP functions page, with those classes and functions we easily can show our posts
on external pages. otherwise we have to use mysql_query functions.

So what we need to includes

require_once( './wp-load.php' );
//// or you these

define('WP_USE_THEMES', false);

once you includes one of these files, so your half work finished. By these files, we includes all wordpress functions and classes with our external page now.
now you can use wordpress functions to shows any post/category etc.

so by these we can get latest posts

$query = 'showposts=3';

if (have_posts()) :

while (have_posts()) : the_post(); 



WP how to get posts by mysql_query on external pages

WordPress how to show posts on external pages

Some time we really need to get wordpress post on external pages/non wordpress theme pages, seems little difficult but not now any more

We have 2 way to do that, here I’m show you 1st way with ‘mysql_query’, in other post i will show 2nd way.

so what we need to do, 1st of all we need a php page.

$db_username = '###';  
$db_password = '###';  
$db_database = '###';  
mysql_connect($host, $db_username, $db_password);  
@mysql_select_db($db_database) or die();

$query = "Select * FROM wp_posts WHERE post_type='post' AND ID='12'"; /// 12 is post id, you want to get
$query_result = mysql_query($query);
$ardata = mysql_numrows($query_result);

We have store all records into $ardata, wordpress value comes in array mode so we have to run and get all values from array
for that we will use “for” loop

for($i=0; $i< $ardata; $i++){ 

$title = mysql_result($query_result, $i, "post_title");
$content = mysql_result($query_result, $i, "post_content");
$link = mysql_result($query_result, $i, "guid");


Now we have all values ready to each on our design.

example :