How to strip Specific tag from HTML using smarty?

Usually in PHP and smarty there is a function called strip_tags to strip all the tags from HTML. But in if you want to strip <img> tag alone from the HTML or any other tag from HTML content we have to use some regular expressions.

If $content is the smarty variable which holds the HTML content, then use the below regex to parse it and strip <img> tag:

{$content | regex_replace:"/(<img>|<img [^>]*>|<\\/>)/":""}

We can use this to strip any html tags. If you wanna strip <p> tag:


{$content | regex_replace:"/(<p>|<p[^>]*>|<\\/p>)/":""}

This will replace <p>, </p> and all <p many attributes> strings with an empty string.

Thats It!!

How to use print_r() in smarty?

We use print_r() in php to print the arrays recursively. If you're using smarty templating engine we can't use the same to print the arrays recursively. We have to assign the array value in a smarty variable in the corresponding php like this:

$smarty->assign('contacts', array('fax' => '555-222-9876', 'cell' => '555-111-1234'));
$smarty->display('index.tpl');

Then open index.tpl and use the variable contacts like this:
{$contacts|@debug_print_var}

Thats it! it'll print the arrays recursively same as print_r() in PHP !!

How to get specific inline styles from Javascript?

At times we need to get specific inline styles from an HTML element. We can use jQuery to get that easily by specifying like $('#id').css('marginLeft');

But it will return the value of the margin-left inline style only in pixels(px), even if u specified in percentage(%) originally. To overcome that I've come across a solution using javascript using

document.getElementById('myDiv').style.cssText;

Code:

<script type="text/javascript">
function showStyles() {
    var s = document.getElementById('myDiv').style.cssText;
    var c = s.split(";");
    for ( var i = 0; i < c.length; i++ ) {
        var p = c[i].split(":");
        alert( p[0] + " is " + p[1] );
    }
}
</script> 

<div id="myDiv" style="height: 200px; width: 150px; margin-left: -10%;">

</div>

The above script will alert all the inline styles one by one exactly specified. If we

Want margin-left alone then use c[3] to output that. p[0] and p[1] specifies style 

attribute and value for the same.

how to create mobile version of wordpress website?

There are lot of ways to do this. But this is simplest of all but not simpler than responsive site. This method is used to redirect mobile users to another sub-domain. So that you can reduce the load of the server from the same domain. Here I used another sub-domain for mobile version.

First you have to add redirect function to your sub-domain (http://m.example.com). So open the functions.php from your theme folder. Add the redirect function as given below:


function check_is_mobile(){
$cur_url = esc_url("http://".$_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"]);
$mob_url= 'http://m.example.com/';
    if(strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'mobile') || strstr(strtolower($_SERVER['HTTP_USER_AGENT']), 'android'))
            {
                $ex = explode("/",$cur_url);
                $postt_id= $ex[4];
                if(!empty($postt_id)){
                wp_redirect($mob_url.'post.php?id='.$postt_id);
                exit;
                }
                else{
                wp_redirect($mob_url);
                exit;
                }
            }
    }
add_action('wp_head','check_is_mobile',1);

 Then create an index.php file in your sub-domain folder and include the wp-blog-header.php. Then display list of post with the below code.
<?php require($_SERVER["DOCUMENT_ROOT"].'/blog/wp-blog-header.php');?>
  <div id="content">
<?php
     $args = array( 'numberposts' => 10, 'post_status'=>"publish",'post_type'=>"post",'orderby'=>"post_date");
    $postslist = get_posts($args);
   
    foreach ($postslist as $post) : setup_postdata($post); ?>
    <?php add_filter('excerpt_more', 'new_excerpt_more');?>
       <div class="inner_box">        
           <p class="art_head"><a href="<?php echo $_SERVER["REQUEST_URI"]; the_ID(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></p>
           <div class="description">
           <?php the_excerpt();?>
           </div>
      </div>
      <?php endforeach; ?>
    </div>
 <?php
function new_excerpt_more( $more ) {
    return '[.....]';
}
?>

 

How to extract image name from the image url in php?

Sometimes we need to extract image name from the url of the image. For that use the below preg_match script:

<?php
if (preg_match('".*?/?([^/]+?(\.gif|\.png|\.jpg))"', $url, $regs)) {
    echo $image = $regs[1];
} else {
    $image = "";
}

?>
$url is the url of the image and $regs[1] gives the name of the image.Thats it!

How to use more than one navigation in wordpress?

In the backend of wordpress, Goto Appearance->Menus and add your custom menus for primary navigation and save it.

This is only for primary navigaton. Then how to create another navigation? Its pretty simple!. Click the '+' sign tab near the primary navigation on top. Then in the Menu Name enter the new name of the navigation in the text box and click Create  Menu.

Voila! New navigation is created. Now you can add your custom menus to that navigation. But in the front end it shows only primary navigation.
Where is the navigation which I created now ? Don't freak out! We have to call the navigation in our theme file at the place we are displaying..

Open your wordpress wp-content\themes\header.php and find the php function wp_nav_menu();. This is where your navigation displays in your site.

Now you need to display another navigation in your site. So just copy that navigation code(wp_nav_menu()--totally) and paste where You need another navigation. Then go to your admin backend of Appearance->Menus again and inspect Theme locations select box in your firebug or whatever.Clearly shown in image!!

You'll find the navigation created by us in the option like this
<option value="5">secondary navigation</option>

Note that value of our navigation and goto code where we left off. Now paste that value inside that wp_nav_menu() function with 'menu' as a key like this:
<?php wp_nav_menu( array( 'theme_location' => 'primary','menu' => '5' ) ); ?>
Here 5 is the value we are passing to display that navigation.

That It! Save the file and check the site.

How to add review star ratings to google search results for your post?

This question was asked millions of times already, so I decided to put up an article and answer this once and for all.

 There are several ways to include ratings in reviews.The most common way is to include the rating written out as a number directly in the HTML, like this microformats example:

Rating: <span class="rating">4.5</span>

Also you can refer this link by Google which gives detailed information
on this.
But I'll show you the easiest way to achieve this. Just include the below
code anywhere inside your post or page to display rating for review.

<div>
   <span itemscope="itemscope" itemtype="http://data-vocabulary.org/Review">
   <span itemprop="itemreviewed">How to Use Ajax in Magento?</span>
   Rating: <span itemprop="rating">5</span> out of 5
   <span itemprop="reviewer">Vignesh M</span></span>
</div>

Leave the first <span> as it is. In the second <span> tag, You'll find
<span itemprop="itemreviewed">How to Use Ajax in Magento?</span>

It is used to say what we are reviewing or name of the post or product.
In the third line(Which is really important for displaying rating star),

 Rating: <span itemprop="rating">5</span> out of 5

Change the 5 inside the <span itemprop="rating"> to corresponding rating of
the review. Then in the next line you'll find,

<span itemprop="reviewer">Vignesh M</span></span>

It is essential to display ratings by specifying the name of the reviewer.
Then save the post and test the link with Google's Structured Data Testing Tool

Thats It!!